Bikes

100%

✓ Published0🌍 Public

Last edited Apr 24, 2015

Created on Apr 24, 2015

Two time series lines compare daily bike counts on Montreal’s Berri and Parc streets throughout 2013, revealing seasonal patterns and distinct traffic volumes. The visualization loads two CSV files and merges their data to determine shared scale domains. Using D3 v3’s `d3.svg.line`, `d3.time.scale`, and `d3.svg.axis`, it renders steelblue and red SVG paths with hover highlighting. Data originates from Montréal’s open data portal.

AI-generated description

Similar vizzes

Loading thumbnail…

Stylised Scatter Chart with React & D3

A React-based scatter chart visualizes hourly Velib bike availability in Paris, aggregated from a remote CSV via `d3.csv` and `d3.rollups`. The SVG rendering uses `d3.scaleTime` for the x-axis (September 6–18, 2021) and `d3.scaleLinear` for the y-axis, with circles sized and positioned by bike counts. D3 generates tick marks, while React components (`AxisBottom`, `AxisTop`, `Marks`) handle layout, and a dropdown filters data options.

MManon ROMAIN

72% match

Loading thumbnail…

Stylised Bar Chart with React & D3

This stylized bar chart displays the total number of available bikes per hour, aggregated from a CSV file of Vélib’ station data. Built with React and D3 v7, the visualization loads the dataset via `d3.csv`, groups entries with `d3.rollups`, and sorts the results to highlight the top ten busiest hours. The code uses `d3.scaleBand` and `d3.scaleLinear` to position colored rectangles, with SVG axes and labels rendered through custom React components, all styled with the Poppins font.

MManon ROMAIN

71% match

Loading thumbnail…

fresh block

This visualization displays bicycle and docking station availability in Lyon, France. The data includes station locations from a JSON file and time-stamped availability counts from CSV files. The code uses D3.js (version 4) to render an SVG visualization. It loads the data files and creates an interactive display showing the dynamic changes in bike and slot availability over time.

MMarineRu

70% match

Loading thumbnail…

line chart ice7

This line chart displays bike users from 2012 to 2022, with time on the x-axis and user counts on the y-axis. The SVG visualization uses d3.scaleTime and d3.scaleLinear for scaling, d3.axisBottom and d3.axisLeft for axes, and d3.line to generate the path. Data is loaded via d3.csv from a GitHub gist, then parsed with Date and numeric conversions before rendering.

Ddivyagunuguntla

70% match

Loading thumbnail…

Temperature Visualization

This interactive line chart uses the D3.js brush-and-zoom technique to explore hourly bike-sharing usage in Washington DC, highlighting how the number of users correlates with temperature. The visualization, built with D3 v4 and rendered as SVG, displays temperature as a colored line over a two-year period (2011-2012). Users can brush along the lower time-series context chart to select a time range, and the main panel zooms in to reveal finer-grained patterns. The chart is part of a broader exploratory project investigating relationships between rider counts and weather attributes like temperature, humidity, and windspeed. Data comes from the UCI Machine Learning Repository's Bike Sharing dataset, and the implementation builds on prior work by mbostock and curran, with the source code available under an MIT license.

663anp3ca

70% match

Loading thumbnail…

on me way

This line chart visualizes bicycle sales over time, with a black path connecting data points to show the trend. The plot uses D3 scales (`scaleTime`, `scaleLinear`) for axes and a React-based rendering pipeline with SVG output. Data is loaded as CSV from a gist and parsed with `d3.csv`. Axes are generated via custom React components, while the line path is drawn using the `d3.line` generator. Styling applies Poppins font and muted teal accents.

UUlbert Alain Odle

69% match

Loading thumbnail…

Cars Scatterplot

This visualization displays Citi Bike trip data from 2020, comparing trip durations at both the start and end stations across different months. A scatterplot shows the correlation between these two duration measurements, with an interactive slider to filter by month, while a bar chart below displays the number of trips starting from each station. The visualization uses D3 v6 scales, axes, and SVG shapes for both charts, with data loaded from a CSV file and parsed into numeric values.

MMillycc

68% match

Loading thumbnail…

Projet_DataViz_Matrice_Histogramme

This visualization combines a train-station adjacency matrix with a live histogram of journey regularity. It plots TGV and Intercités routes, where each matrix cell’s opacity encodes the percentage of on-time trips, and clicking a cell highlights its row and column. The histogram charts monthly regularity for selected routes using a dynamic bar chart. Built with Vue and D3 v4, the code applies `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom`, while a slider filters data by year. Data comes from CSV files (`trajets_tgv.csv`, `trajets_intercites.csv`) and renders as SVG.

KKylaste

68% match