ICE 7

100%

✓ Published0🌍 Public

Last edited Mar 29, 2023

Created on Mar 29, 2023

This line chart displays crime rates over time, sourced from a CSV file loaded via d3.csv. The visualization uses d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for tick rendering, and d3.line with d3.curveBasis to draw the smoothed temperature-style path. The SVG rendering includes labeled axes and a title, with data points mapped through x and y scales. The dataset is fetched from a GitHub gist and parsed as numeric values for year and crime rate.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

Made in this video:

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE 7

A combined line and area chart displays CrimeRate from 2010 to 2019, with the line emphasizing the trend and the area filling beneath it. The visualization uses D3 v5 with SVG rendering, employing `d3.line`, `d3.area`, and `curveBasis` for smooth interpolation, alongside `scaleLinear`, `axisBottom`, and `axisLeft`. The data is loaded via `d3.csv` from a GitHub gist, with the year and crime rate parsed as numeric values. Axis labels and gridlines are styled through CSS, and the chart is centered within a fixed-width SVG container.

Kkakumanusreya

93% match

Loading thumbnail…

ICE 7

This visualization shows the crime rate over time as a smooth orange area chart, with red titles and purple axis labels. It uses D3 v5 to load CSV data from a GitHub gist, parse the year and crime rate values, and render an SVG. The chart employs `scaleTime`, `scaleLinear`, `axisLeft`, `axisBottom`, and an `area` generator with `curveBasis` to create the filled line. Axis labels and a centered title are added manually, with tick marks extending across the plot for gridlines.

Kkakumanusreya

93% match

Loading thumbnail…

Fork of ICE-7 Line Chart

This line chart displays crime indices across different countries, with each country plotted along the x-axis based on a date-converted value and crime index on the y-axis. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` generators to render an SVG path with gridlines, axis labels, and a title. Data is loaded as CSV from a GitHub gist, parsed, and converted so country names become date objects, while crime indices are parsed as numbers. The chart is drawn with red strokes and styled via an external stylesheet.

NNikitha123171

86% match

Loading thumbnail…

ICE-7_Shnanmukha_LineChart

This line chart shows the total US crime rate from 1960 to 2014, with the year on the x-axis and the total crime rate on the y-axis. It uses d3.scaleTime and d3.scaleLinear for the axes, d3.line with curveBasis for the smoothed line, and d3.axisLeft and d3.axisBottom for the ticks. Data is loaded via d3.csv from a remote CSV file and rendered as an SVG with a steelblue path.

Sshanmukhadatta4040@gmail.com

85% match

Loading thumbnail…

ICE-7 Line chart

This line chart displays yearly run totals from a CSV file, using a blue line to show the trend over time. The D3 v5 code leverages `scaleTime` and `scaleLinear` to map data to axes, `axisBottom` and `axisLeft` for tick marks, and a `line` generator to create the path. The SVG is rendered with a grid and labeled axes, with data loaded via D3's `csv` function.

LLG0498

82% match

Loading thumbnail…

ICE - 7 Line Chart

A line chart displays annual sales over time, with a single thick maroon line tracing the trend. The visualization uses D3 v5 to load CSV data via `d3.csv`, parse dates with `d3.timeParse`, and construct scales with `scaleTime` and `scaleLinear`. Axes are generated using `axisBottom` and `axisLeft`, while the line path is created with the `d3.line` generator. The SVG rendering includes labeled axes and gridlines, with data sourced from a GitHub gist.

Nnehabaddam

82% match

Loading thumbnail…

ICE-7: Line Chart

This line chart displays CO2 emissions over the years, using a smooth curve to connect data points from a CSV dataset. The visualization uses D3 v5's `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveBasis` to render the chart as an SVG. A maroon line path and styled axis labels with gridlines are included. The code loads data via `csv` from a gist, formats numeric fields, and appends axes, labels, and a title within a group element.

CChaitanya Galla

82% match

Loading thumbnail…

ice 7 line

This line chart displays accident counts per year from 2000 to 2010, using d3.csv to load the data and d3.scaleTime with d3.scaleLinear for the axes. The visualization renders as an SVG path generated by d3.line, with labeled axes and a title. Grid lines are drawn via d3.axisBottom and d3.axisLeft, while the line itself is styled with a navy stroke.

SSreekarveeravelly

82% match