WEBPAGE

100%

✓ Published1🌍 Public

Last edited Apr 26, 2024

Created on Apr 25, 2024

This dashboard presents a collection of data visualizations, offering buttons to navigate between different chart types such as bar charts, scatter plots, heatmaps, and line charts. It loads Chart.js for canvas-based bar charts and displays externally hosted SVG images for other visualizations, with buttons linking out to VizHub projects built with Tableau, Python, PowerBI, and D3.js. The interface uses a gradient background and interactive hover effects on its selection buttons.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of WEBPAGE

This example is an interactive dashboard that presents a set of pre-rendered SVG charts, including a COVID-19 cases timeline, a scatter plot, a heatmap, and an orders comparison. Users select charts via buttons, which trigger the loading and display of external SVG files from a GitHub repository. The interface uses HTML, CSS, and vanilla JavaScript to manage button events and swap between a Chart.js bar chart rendered on a Canvas and the static SVG images. The chart views are designed for comparison and quick access, with a focus on switching between different data representations.

Ssannihitha.k23@gmail.com

81% match

Loading thumbnail…

Webpage-DV-Group7

This example is a gallery hub for seven distinct D3.js visualizations, each presented as a styled hyperlink. It shows a collection of interactive charts, including a bar chart for population data, an interactive pie chart, a side-by-side bar chart, an interactive scatter plot, an interactive line chart, an interactive heat map, and an interactive colored bar chart. The interface uses plain HTML and CSS for layout, with each link pointing to a separate VizHub project where each D3.js visualization is implemented. The gallery functions as a static navigation page, relying on external VizHub links for the actual interactive content.

LLayaMyadam@my.unt.edu

80% match

Loading thumbnail…

D3.js

This example demonstrates the capabilities of VizHub by loading D3.js and Chart.js through CDN links and rendering interactive data visualizations on an HTML canvas or as embedded SVG images. The interface presents a set of buttons that display different chart types, including bar charts, scatter plots, and distribution graphs, with each button triggering a hide-and-show mechanism between the canvas and an image element. The code imports a local ES6 module for a message and uses Chart.js to create the bar chart on the canvas, while SVG charts are loaded from external GitHub URLs. The styling uses a Roboto font and gradient background for presentation.

Ssannihitha.k23@gmail.com

79% match

Loading thumbnail…

webpage

This example demonstrates a chart viewer that switches between a Chart.js canvas bar chart and pre-rendered SVG visualizations, including scatter plots, heatmaps, and time-series comparisons. Users select charts via HTML buttons, triggering functions that hide the Canvas element and load external SVG files from GitHub using the `img.src` property. The Chart.js `Chart` constructor handles the bar chart with categorical data, while SVG images are displayed directly, with error handling via `onerror`. It also includes an ES6 module exporting a message string.

Ssannihitha.k23@gmail.com

79% match

Loading thumbnail…

Tableau

This interactive dashboard displays a collection of pre-rendered SVG charts covering COVID-19 statistics and e-commerce analytics. Users select a topic from a set of buttons, which loads corresponding SVG images hosted on GitHub. The interface uses HTML buttons with event listeners in JavaScript to toggle between chart displays, while Chart.js is loaded for potential canvas-based visualizations, though the primary interaction relies on swapping SVG image sources.

Ssannihitha.k23@gmail.com

77% 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

76% match

Loading thumbnail…

PowerBi

This example presents a series of Power BI-style data visualizations, including bar charts, scatter plots, and trend analyses, which users can select via buttons. It uses the Chart.js library to render a canvas-based bar chart and loads pre-generated SVG files from GitHub for other chart types. The interface is built with HTML, CSS, and vanilla JavaScript, with event listeners managing the display of either the canvas chart or an SVG image.

Ssannihitha.k23@gmail.com

73% match

Loading thumbnail…

My Webpage

This personal webpage presents a survey of scientific data visualization through custom HTML, CSS, and JavaScript, featuring an embedded SVG illustration and a data table. The page displays a CSV dataset rendered as an HTML table, with JavaScript calculating and displaying column sums, averages, and overall summary statistics. The interface includes a header, navigation menu, and footer, styled through an external stylesheet. The SVG logo and data summary demonstrate basic web technologies for presenting structured information, using native JavaScript functions for parsing and computation rather than external libraries.

Ssaikrishnabussa

73% match