Skip to main content
SimilarExport ZIP
100%

Fork of Table

✓ Published1🌍 Public
GGayan Priyadarshana
Last edited Aug 28, 2023
Created on Aug 28, 2023
Forked from Table

This visualization presents a tabular heatmap of price changes across various DPC websites, organized by website name in rows and the most recent 12 year-month periods in columns. Each cell displays a numeric change value, with background colors encoding the magnitude of change: reds indicate lower values, oranges mark zero, and greens represent higher values, based on quartile thresholds. The table is built using D3 v7, loading CSV data with `d3.csv`, grouping rows with `d3.group`, and sorting year-month pairs in descending order.

AI-generated description

https://d3-graph-gallery.com/graph/bubblemap_template.html

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Table

This table visualization displays monthly price data for DPC websites, with columns representing the most recent twelve months and rows sorted alphabetically by website name. Cell background colors encode percentage changes using a diverging scale from red through orange to green, calculated from quartile thresholds of all change values. The page includes a frequency menu built with a custom d3.menu component, though it only logs selection changes to the console. The implementation uses d3.csv for data loading, d3.group for aggregation, and d3.select for DOM manipulation.

GGayan Priyadarshana
93% match
Loading thumbnail…

Fork of Fork of Table

This interactive D3.js v7 visualization displays a heatmap-style pricing table for DPC website names, comparing new price values against change percentages across time periods. The visualization includes a dropdown menu allowing users to filter data by assessment frequency (Daily, Weekly, BiWeekly, or Monthly), dynamically updating the table to show the 12 most recent time columns. The code utilizes D3's `csv` for data loading, `group` for data aggregation, and custom menu functionality with `dispatch` events. Data is filtered and sorted in descending chronological order, with color-coded cells indicating price changes.

GGayan Priyadarshana
90% match
Loading thumbnail…

Fork of Type Table

This fork of the Type Table displays a color-coded matrix of DPC website publication prices across twelve recent year-month columns. The table groups rows by website name, sorted alphabetically, and uses a menu component from a custom `menu()` module to select frequency. The visualization builds an HTML table using d3.csv, d3.group, and d3.select, with cell backgrounds colored based on Change value percentiles—red for low, yellow for zero, and green for high—via inline style functions. Data comes from a static CSV hosted on GitHub Gist.

CChindamrohan321@gmail.com
85% match
Loading thumbnail…

Type Table

This example visualizes a table of DPC website publication data, displaying monthly price changes across twelve time periods. Rows are sorted alphabetically by website name, while columns represent recent months in descending order. Cell background colors encode the magnitude of change, using a quartile-based color scale that ranges from red for low values through yellow to green for high values. The visualization uses D3.js, loading CSV data via `d3.csv`, grouping with `d3.group`, and building the HTML table dynamically with D3 selections. A custom menu component enables frequency selection.

Cchris.shimotake@gmail.com
83% match
Loading thumbnail…

Table

A data table displays steel scrap prices for various DPC website names, showing the new price, prior price, and value change across the latest 12 year-month periods. Rows are grouped by publication name and sorted alphabetically, while columns are ordered chronologically with headers like "Dec19". The code uses d3.csv to load the data and d3.group to organize it, with d3.append building the table structure. Cell background colors encode the Change column using quartile-based thresholds, ranging from red for low values to green for high ones.

GGayan Priyadarshana
78% match
Loading thumbnail…

Fork of filters changing the headers correctly

This interactive table visualizes assessment data, allowing users to filter by frequency (Daily, Weekly, BiWeekly, Monthly) via a custom menu. The table displays DPC website names as rows, with columns dynamically updating to show the 12 most recent time periods—dates, weeks, or month-year labels—depending on the selected frequency. Built with D3.js v7, the visualization uses `d3.csv` to fetch remote data and `d3.group` to structure entries. The menu component is custom-built with an `on` method that triggers table regeneration.

GGayan Priyadarshana
74% match
Loading thumbnail…

Fork of Fork of ice7

This area chart displays the opening bid prices for January 2021, using a purple semi-transparent fill beneath a green curved line to emphasize price trends over time. The visualization uses D3 v5 with SVG rendering, employing `scaleTime` for the date axis and `scaleLinear` for price, while smoothing the path with `curveBasis`. Axis labels appear in orange, and gridlines are drawn in blue. The data is loaded from an external CSV file and formatted for the y-axis using `format('.5s')`.

PPujitha14challagulla
70% match
Loading thumbnail…

Fork of Fork of assignment 7 PieChart

This dashboard displays four coordinated D3 v7 charts from a 200-row CSV dataset: a scatter plot of units sold versus profit colored by region, a pie chart of revenue distribution across regions, a line chart of monthly revenue trends, and an area chart of cumulative monthly revenue. Each visualization uses SVG rendering with scales, axes, and color encoding via `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.pie`, `d3.arc`, and `d3.rollups` for aggregation. The interactive layout includes grid lines and legends within styled chart sections.

Sshyamraghav12@gmail.com
70% match