Fork of Fork of GDP Serbia

100%

Fork of Fork of GDP Serbia

✓ Published0🌍 Public

Hharika-1929

Last edited Jul 3, 2022

Created on Jul 3, 2022

This line chart displays the number of actions per month, with data sourced from a CSV file. The visualization uses D3’s `scaleBand` for the x-axis months and `scaleLinear` for the y-axis action counts, rendered as an SVG with React. The chart includes a smooth curve via `line()` and `curveNatural`, circular data points with tooltips, and labeled axes. The y-axis uses dashed gridlines, and the title is centered above the plot area.

AI-generated description

A program that follows your mouse with a circle.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of GDP Serbia

This chart visualizes the number of actions per month in Serbia, using a line and scatter plot. The data is loaded from a CSV file and rendered using React with SVG. D3’s `scaleBand` and `scaleLinear` map months and action counts to the axes, while `line()` constructs the path. Circles with tooltips show each data point, and the style is defined in external CSS.

BbeauMarko

94% match

Loading thumbnail…

Fork of Actions per month

This visualization shows the proportion of Covid versus non-Covid blood donations in Serbia across each month of 2020, using stacked area forms to compare the two categories. The chart renders as an SVG within a React application, using D3 v6 methods such as `scaleTime`, `scaleLinear`, and `scaleOrdinal` for axes and color encoding, while the `area` generator in d3.area draws the layered curves. The csv data is loaded via the d3.csv function, and the lower layer is visually de-emphasized with reduced opacity to highlight the selected Covid category.

BbeauMarko

79% match

Loading thumbnail…

GDP Serbia

This visualization displays Serbia’s GDP over time as a smooth, natural-curved line chart rendered as SVG in a React app. It uses d3.scaleTime and d3.scaleLinear to map years and GDP values, with d3.line and curveNatural for the path. The data comes from a CSV file filtered to Serbia. Axes are custom-built components, and tooltips appear via SVG titles on circles, though circles are currently commented out.

Ggayathrikavya

78% match

Loading thumbnail…

GDP Serbia

A line chart displays the annual GDP of Serbia over time, loaded from a CSV file and rendered as a smooth natural curve. The visualization uses React to build SVG elements, with Axes and Marks components, while d3.scaleTime and d3.scaleLinear handle the x- and y-axis scaling. Tooltips are included as commented-out code, and the chart applies a Poppins font with a custom color scheme for the line and axes.

BbeauMarko

78% match

Loading thumbnail…

Fork of Fork of fork1

This fork shows a horizontal bar chart of the top 10 most populous countries, using data from the year 2019. The visualization renders to SVG via React and uses D3's `scaleBand` and `scaleLinear` to map country names and population values to coordinates. Axes and grid lines are drawn using `axisLeft`, `axisBottom`, and `ticks()`. The dataset is loaded from a CSV URL, though the URL is empty in the code.

RRamyapriyaPutta

74% match

Loading thumbnail…

Fork of Fork of Activity 7

This is a horizontal bar chart showing the population of 20 countries in 2020, rendered as SVG elements within a React application. The chart uses D3 version 5 scales (`d3.scaleBand` and `d3.scaleLinear`) to map country names and population values to positions and lengths. Data is loaded from a CSV file via a custom `useData` hook, with tick marks styled blue and a green fill for each bar. Tooltips display the formatted population value on hover.

MManideeprenikindi

74% match

Loading thumbnail…

Fork of Activity 7

A horizontal bar chart displays the populations of twenty countries in 2020, loaded from a CSV file. Built with React and D3 v5, the visualization uses `scaleBand` and `scaleLinear` to map country names and population values to SVG rectangles. Axes are generated with custom React components, and a tooltip using SVG `<title>` elements reveals precise values. The chart is formatted with D3's `format` function to abbreviate large numbers.

MManideeprenikindi

74% match

Loading thumbnail…

Fork of line chart

This example shows how a line chart can be used to display country GDP over time, with each line representing a different country. It uses Chart.js to render the chart on an HTML canvas element, fetching CSV data from a remote URL and parsing it into datasets. The chart is configured with labeled axes for GDP and Year, and the code explicitly sets axis labels via both Chart.js options and DOM manipulation. The rendering approach relies on Canvas 2D through Chart.js, with a fixed chart size of 800 by 400 pixels.

Mmukundakrishna.r@gmail.com

73% match