Skip to main content
SimilarExport ZIP
100%

Anitha Shivaramaiah(11537410) - Interactive bar chart

✓ Published0🌍 Public
AAnitha Shivaramaiah
Last edited Apr 6, 2023
Created on Apr 5, 2023
Forked from HTML Starter

This interactive bar chart displays simulated sales data for makeup products across seven categories and six brand-location combinations, using a 3D column layout with depth and rotation. The chart, built with Highcharts and the Highcharts 3D module via jQuery, groups bars by product on the x-axis and stacks series by region, showing comparative performance across Nyka, Loreal, and Maybelline stores in different countries. The visualization uses alpha and beta angles for the 3D perspective, with a z-axis labeled “Region” to contextualize the spatial arrangement.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

AnithaShivaramaiah (11537410) 3D Bar Chart with D3.js

This example shows monthly expenses from January through December for multiple expense categories as a 3D multi-series bar chart. The chart renders in an X3DOM scene, driven by the d3-x3d library alongside d3-3d, with D3 v5 loading CSV data from a GitHub gist. The code uses `d3.csv` to parse the data, `d3.select` to attach the chart to a div, and the `d3.x3d.chart.barChartMultiSeries()` component to generate the 3D visualization. Axes and scales are not explicitly customized, relying on the chart component’s defaults.

AAnitha Shivaramaiah
74% match
Loading thumbnail…

Untitled

A 3D bar chart displays revenue for three product categories across four states, with vertical bars for Nail polish, Eyebrow pencil, and Lipstick, and color-coded series for Florida, Texas, Arizona, and Nevada. The chart is built using the AnyChart JavaScript library, which handles data mapping, animation, tooltips, and legend rendering. The SVG output is generated dynamically via the AnyChart API, with dollar-formatted Y-axis labels and rotated x-axis labels.

Ssalimjivani
74% match
Loading thumbnail…

Fork of Fork of Bonus ICE Saranya

This example displays a 3D bar chart comparing top car brand sales across three countries—the United States, India, and Germany—using the Highcharts library with its highcharts-3d module. The chart renders columns with depth, stacking, and grouping disabled, and applies rotation angles (alpha: 55, beta: 25) to create a three-dimensional perspective. Data for each series is defined as arrays of coordinate-value pairs, where the first element indicates the category index on the x-axis and the second represents sales in billions of USD. The chart is embedded in a simple HTML page and initialized via jQuery’s `$(function () { ... })` callback, with the container div set to 400 pixels in height.

Vviswak12
73% match
Loading thumbnail…

Bonus ICE - 3D Bar Chart Sharanya Javvaji

A 3D bar chart visualizes sales for seven car manufacturers from 2015 to 2022. Each column is a manufacturer, with eight stacked segments per column representing annual sales; the chart’s depth axis maps years. The visualization uses the Highcharts library and its highcharts-3d JavaScript API, with options3d enabling perspective rotation (alpha 25, beta 40) and a set view distance. Data is hardcoded in the series arrays, with pink, yellow, and default color-coded segments for different years.

SSharanya1307
73% match
Loading thumbnail…

Fork of Bonus ICE Saranya

This example presents a 3D bar chart comparing top car brand sales across the United States, India, and Germany, using Highcharts and the highcharts-3d module. The chart uses a column series with depth, stacking, and group Z padding to create a three-dimensional visual, with categories for brands like Tesla, Ford, and BMW on the x-axis and sales in billions of USD on the y-axis. Individual series map specific brands to each country, with sparse data points shown for India and Germany. The visualization is rendered inside a div container using jQuery to initialize the chart.

SSamanvitha1
72% match
Loading thumbnail…

Fork of Bonus ICE Saranya

This example presents a 3D bar chart comparing top car brand sales across the United States, India, and Germany, using Highcharts and the highcharts-3d module. The chart uses a column series with depth, stacking, and group Z padding to create a three-dimensional visual, with categories for brands like Tesla, Ford, and BMW on the x-axis and sales in billions of USD on the y-axis. Individual series map specific brands to each country, with sparse data points shown for India and Germany. The visualization is rendered inside a div container using jQuery to initialize the chart.

SSamanvitha1
72% match
Loading thumbnail…

AnithaShivaramaiah(11537410) 3D Scatter plot using D3.js

This example visualizes monthly expense data across two sets of three months using a 3D scatter plot. It displays two series of markers: one mapping April, August, and December expenses, and another mapping January, February, and March expenses, each with distinct colors, sizes, and opacity. The visualization is rendered using Plotly's `scatter3d` trace type via the `Plotly.newPlot` API, while the data is loaded and parsed with D3.js's `d3.csv` function from a GitHub Gist. Interactive 3D axes with customized background colors, grid lines, and titles represent the different expense categories.

AAnitha Shivaramaiah
72% match
Loading thumbnail…

3D-bar chart(Revanth)

This example shows a 3D bar chart of top-10 car sales, with bars grouped by country of origin (United States, India, UK) and height representing sales in billions of USD. Using Highcharts with the highcharts-3d extension, the chart renders with a rotation angle and perspective via the `options3d` settings, with columns configured through `plotOptions.column` for depth and stacking. The page loads Highcharts from a CDN within a minimal HTML wrapper, with data specified as coordinate pairs in the series.

RRevanthGrreddy
72% match