Skip to main content
SimilarExport ZIP
100%

Visualization Task Test

✓ Published1🌍 Public
PPramana Yuda Sayeti
Last edited Aug 19, 2020
Created on Aug 8, 2020
Forked from HTML Starter

This visualization presents a document user consent dashboard, displaying participant data across multiple sites and studies. It shows bar, pie, and doughnut charts built with Chart.js, rendering frequencies of quiz completion status and document types. The application loads a mock CSV dataset using D3’s `csv` function, then filters and refreshes charts dynamically based on user selections from dropdown menus. It employs Underscore.js utilities like `_.pluck` for data extraction, with custom color generation and tooltip percentage calculations.

AI-generated description

A bare minimum HTML page.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Visualitation Task

This visualization presents a dashboard of participant data from a mock clinical trial CSV file, using bar and pie charts to show quiz completion status, document types, participant countries, and study types. It relies on Chart.js to render the charts, with D3.js (`csv`) for data loading, Underscore.js (`_.pluck`) for data extraction, and a custom `convertToArrObj` utility to transform frequency counts into chart-ready objects. The charts sort categorical data by frequency, and pie charts display tooltip percentages.

PPramana Yuda Sayeti
88% match
Loading thumbnail…

Charts, Charts, Charts

This visualization displays four distinct chart types side by side: a doughnut chart, bar chart, radar chart, and pie chart. Each chart presents a different dataset, such as airline passenger numbers, player skill ratings, and EU population figures. The code uses Chart.js 2.8.0 for rendering all charts onto canvas elements, while D3.js v7 handles loading CSV data from a GitHub gist. The bar chart and pie chart use hardcoded arrays, but the doughnut chart demonstrates fetching and parsing external CSV data.

Ddevvansh1997
73% match
Loading thumbnail…

Data visualization Project

This visualization presents a dashboard for an art and technology workshop dataset, showing attendance metrics and registration trends. It uses D3 v7 to render SVG charts, including a track-based attendance breakdown and a registered-versus-attended comparison. The interface includes interactive controls like dropdowns and text inputs for filtering, alongside summary cards displaying key statistics. The visualization is built with Vue, incorporates custom CSS styling, and references embedded PNG images for chart representations.

Ssahasrakaturi91@gmail.com
71% match
Loading thumbnail…

Activity 6_Task 1

This visualization displays a scatter plot of data points rendered as green circles, with blue tick marks along the axes and gray axis labels. The chart is built using React for the user interface and D3.js (v5) for the SVG rendering, leveraging D3's selection and scale APIs. The visualization is embedded in an HTML page that loads React, ReactDOM, and D3 from a CDN, with the chart drawn from a bundled JavaScript file. The dataset originates from source v3, though the specific data values are not visible in the provided code.

Ssaikarthiknimmagadda@gmail.com
71% match
Loading thumbnail…

Rendering Data with React and D3

A full-screen donut chart visualizes all CSS named colors, sourced from a CSV file of named color values. The visualization uses React to manage state and render SVG elements, while D3 v7 handles the data loading via `d3.csv` and the pie layout and arc generation with `d3.pie` and `d3.arc`. Each color category is represented by a pie slice filled with its corresponding hexadecimal value.

AA
70% match
Loading thumbnail…

Data Visualization Project

This example presents a gallery of visualizations, beginning with an embedded Tableau public dashboard and including multiple iframes of D3-based charts such as bar, pie, scatter, tree, and 3D bar graphs hosted on VizHub. The page also references Google Colab and Figma-embedded screenshots. Built with React, the code uses standard HTML, CSS, and JavaScript to lay out these components, with the Tableau Viz API script loading the interactive dashboard and VizHub iframes displaying the individual charts.

Aav.dj.2000@gmail.com
70% match
Loading thumbnail…

Testing D3

This visualization displays survey responses from students, showing each participant’s self-assessed collaboration skill as a horizontal bar chart. The bars are sorted in descending order by collaboration score, with aliases displayed along the vertical axis. Built with React and D3 v7, the example uses `d3.csv` to load data from a CSV file, and `scaleBand` and `scaleLinear` to map aliases and collaboration values to screen coordinates. The SVG rendering updates dynamically as the data loads, with a loading message shown initially.

AAdaman32
70% match
Loading thumbnail…

Activity6_task-1

This visualization displays the populations of 20 countries from a CSV dataset, using a horizontal bar chart rendered as SVG elements within a React application. The chart employs D3 v5 scales to map country names to the y-axis and population values to the x-axis. Population data is loaded asynchronously via `csv()` and formatted with `format('.2s')` for abbreviated tick labels. The axis components and colored rectangles are built from D3 scale outputs using JSX, with tooltips provided by SVG `<title>` elements.

Aamulyareddykondru01@gmail.com
70% match