CircleMark Residuos decultivos generados

100%

CircleMark Residuos decultivos generados

✓ Published0🌍 Public

Last edited Mar 7, 2021

Created on Mar 7, 2021

Forked from Rect Chart Residuos decultivos generados

This visualization displays crop residue waste generated in 2018 across different zones and months, using a circle mark where the size of each circle encodes the WasteKgs value. The chart orders zones on the y-axis and months on the x-axis, with tooltips revealing exact waste amounts. It is built with the vega-lite-api library, which registers Vega and Vega-Lite, and loads data from a CSV file via d3.csv. The visualization applies custom configuration for axis styling and title formatting.

AI-generated description

A visualization constructed using the vega-lite-api. Still Needs Order to x and y

MIT Licensed

Similar vizzes

Loading thumbnail…

Rect Chart Residuos decultivos generados

A rect chart visualizes crop waste generated across zones by month for 2018, with color intensity representing kilograms of waste and tooltips revealing exact values. Built with the vega-lite-api, the visualization uses `vl.markRect()` and encodes zones on the y-axis and months on the x-axis via a time unit. Data is loaded asynchronously with d3.csv from a GitHub gist, and the chart is rendered with vega and vega-lite, configured for dark text and larger fonts to improve readability.

AAndres de la Garza

84% match

Loading thumbnail…

residuosdecultivosgenerados Refactored

This bar chart shows crop residue generation in thousands of kilograms across twelve zones, with each horizontal bar labeled by zone and scaled linearly by its January value. The visualization uses React to render SVG elements, with d3.scaleBand for the categorical y-axis and d3.scaleLinear for the numeric x-axis. Data is loaded asynchronously via d3.csv from a GitHub gist, and tick labels are formatted with a custom "M Kg" suffix. The chart includes gridlines from the bottom axis and zone names from the left axis, implemented through custom React components.

AAndres de la Garza

80% match

Loading thumbnail…

residuosdecultivosgenerados with axes

This visualization displays agricultural crop residue generation data across different zones using a horizontal bar chart. The React component loads CSV data from a GitHub gist and renders a bar chart using SVG, with d3.scaleBand for the categorical y-axis and d3.scaleLinear for the x-axis. The code uses d3.csv for data loading, and d3.max to determine the domain, with axis ticks and labels generated via the scale’s .ticks() method. Each rectangle’s width corresponds to the value for the month of January, with axis lines and text labels providing reference points.

AAndres de la Garza

76% match

Loading thumbnail…

residuosdecultivosgenerados

This bar chart shows the sum of crop residue generated per zone across Mexico, with each bar colored by state. The visualization aggregates population data by zone and sorts bars in descending order, with tooltips revealing the state name for each segment. Built with the vega-lite-api, it uses `markBar`, `fieldQ` for quantitative population values, and a category20b color scheme. Data is loaded asynchronously via d3.csv from a GitHub-hosted CSV file, and the chart renders with vega-tooltip handler and custom config for improved readability.

AAndres de la Garza

74% match

Loading thumbnail…

Styleized residuosdecultivosgenerados Refactored

This example shows a horizontal bar chart displaying monthly agricultural crop residue generation across multiple zones. Each bar’s length represents the value for a given month, with zones listed along the vertical axis and a formatted x-axis indicating totals. Built with React and D3 v6 (using `scaleBand`, `scaleLinear`, and `format`), the chart renders as SVG. Data is loaded via `csv` from a remote gist URL, and components like `AxisBottom`, `AxisLeft`, and `Marks` handle scales, labels, and bar drawing. The title labels the metric as "Residuos Decultivos Generados."

AAndres de la Garza

72% match

Loading thumbnail…

Scatter Plot - RDG2018

This scatter plot displays monthly waste measurements in kilograms (WasteKgs) for 2018, sorted by month. The visualization uses React with D3 v6 for scales and SVG rendering, loading CSV data from a GitHub gist. It employs `scaleTime` for the x-axis and `scaleLinear` for the y-axis, with reusable axis components and circle marks that include native SVG tooltips via the `<title>` element. Custom Poppins typography and teal circle styling give the chart a clean, modern appearance.

AAndres de la Garza

71% match

Loading thumbnail…

Mexico Waste Data 2018 - Choropleth

This interactive SVG bar chart displays the total weight of waste in kilograms for each month of 2018, using data from a remote CSV file. Built with React and D3 v6, it processes the time-series data by binning monthly values and scaling the y-axis. The visualization uses SVG rendering with axis components and interactive tooltips, providing a clear view of monthly waste trends throughout the year.

AAndres de la Garza

68% match

Loading thumbnail…

RESIDUOS

This visualization displays the composition of waste found on beaches, using a bubble chart where each circle represents a specific item and its size corresponds to the count of that item found. The data is grouped and colored by its broader category, such as plastics, paper, or metal, and hovering over a bubble reveals its exact category, subcategory, and count. The chart is built with D3.js v4, using the `d3.pack()` API to create the circle-packing layout and scaling the radii from the data's `N_item` values. The visualization also includes interactive mouseover effects that enlarge the circle and display a tooltip with the waste details, all rendered as SVG elements with custom styling and transitions.

IIzaskunLS

66% match