Skip to main content
SimilarExport ZIP
100%

Project - 3D Vertical Bar Chart for Total Profit with Sales-Profit Quadrant of Sub-Category Product

✓ Published0🌍 Public
AAnjan Shrestha
Last edited Apr 2, 2022
Created on Apr 2, 2022
Forked from Bonus ICE

This example displays a 3D vertical bar chart comparing total profit across product sub-categories, grouped into four sales-profit quadrants: low sales/low profit, low sales/high profit, high sales/low profit, and high sales/high profit. Built with Highcharts and the Highcharts-3D module, it renders stacked columns with an isometric perspective using the chart’s `options3d` settings for depth and rotation. Data is hardcoded as arrays of category-index and profit-value pairs, while quadrant assignments are encoded as separate series stacks. The visualization highlights profit distribution patterns within retail categories.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

BONUS ICE1 - 3D Bar Chart for Total Profit with Sales-Profit and Quadrant of Sub-Category Product

This 3D bar chart displays total profit across 17 product sub-categories, categorized into four quadrants based on sales and profit levels. The visualization uses Highcharts with the highcharts-3d module, enabling a column chart with 3D depth and rotation angles. The data series are stacked with distinct groupings, showing product categories like Phones as having both high sales and high profit. The chart’s interactivity and visual depth are rendered client-side using JavaScript and jQuery to initialize the chart within an HTML container.

SShreeti Upreti
86% match
Loading thumbnail…

BONUS ICE1 - 3D Bar Chart

This example uses Highcharts and the Highcharts 3D add-on to render a three-dimensional vertical bar chart that visualizes total profit for sub-category products, grouped into quadrants based on sales and profit levels. The chart displays profit values on the y-axis and product categories on the x-axis, with distinct series for low and high sales/profit combinations. The code configures 3D properties such as depth, alpha, beta, and viewDistance within the `options3d` object to create the perspective view.

Rrallabandisushen@gmail.com
80% match
Loading thumbnail…

Project - Horizontal Bar Chart for Total Profit of Sub-Category Product (Using React Tool and d3.js)

This example shows a horizontal bar chart of total profit across product sub-categories, with blue bars on an SVG canvas and labeled axes. It loads CSV data from a GitHub gist using `d3.csv`, processes the profit values with a row function, and renders the chart in React. The visualization uses `scaleBand` for the categorical y-axis, `scaleLinear` for the profit-driven x-axis, and generates gridlines and tick labels via `xScale.ticks()`. Axis labels and bar rectangles are positioned through SVG `<g>` and `<rect>` elements within a React component.

AAnjan Shrestha
79% match
Loading thumbnail…

Project - Horizontal Bar Chart for Total Sales of Sub-Category Product (Using React Tool and d3.js)

This example shows a horizontal bar chart of total sales for product sub-categories, with bars rendered in blue on an SVG canvas. It uses React to manage state and lifecycle, while d3’s `csv` loads the dataset and `scaleBand` and `scaleLinear` map the categorical and numeric ranges. The chart draws gridlines and tick labels via `xScale.ticks()`, and each bar’s width represents sales value. The data is fetched from a GitHub gist URL.

AAnjan Shrestha
74% match
Loading thumbnail…

3D BarChart for superstore dataset

This 3D bar chart visualizes sales for three product categories—Furniture, Office Supplies, and Technology—across four regions (East, West, South, Central) in a superstore dataset. The code uses the AnyChart library, specifically `anychart.column3d()`, to render vertical bars with a tilted 3D perspective via `chart.zAngle(35)` and `chart.zAspect('25%')`. It includes an animated entrance, a legend, and tooltips formatted as `${%Value}` to display dollar amounts. The data is hardcoded within the script, and styling is applied through inline CSS for a full-window container.

Yyamunayennem
70% match
Loading thumbnail…

sales comparision by segment

A horizontal bar chart compares sales across product sub-categories for three customer segments. The visualization uses D3.js v5 to load data from a CSV file and render SVG rectangles, with each segment represented as a separate category. Sales values scale linearly on the x-axis, while sub-categories are positioned on a band scale for the y-axis. The chart includes axes generated with `d3.axisLeft` and `d3.axisBottom`, and the code filters and aggregates the data by segment and sub-category.

Oosaka004
70% match
Loading thumbnail…

3D Bar Chart using D3.js

This example visualizes regional company performance with a 3D bar chart, comparing TotalCost, TotalRevenue, and TotalProfit for each region. The visualization uses the `d3-3d` and `d3-x3d` libraries alongside D3.js v5, rendering interactive 3D bars within an X3DOM scene. Data is loaded asynchronously from a CSV file using `d3.csv`, with each row parsed into multi-series values. The chart is created using `d3.x3d.chart.barChartMultiSeries()` and attached to the DOM via `chartHolder.datum(data).call(myChart)`, replacing initially generated random dataset.

Ggayathrikavya
69% match
Loading thumbnail…

3D Bar Chart using D3.js

This example visualizes supermarket sales data as an interactive 3D bar chart, with each bar representing a city across multiple months. The visualization uses D3.js v5 for data loading and layout, combined with the d3-3d library to extrude bars into three dimensions, and X3DOM for WebGL rendering of the 3D scene. Sales figures are parsed from a CSV file via `d3.csv`, and the chart is created using `d3.x3d.chart.barChartMultiSeries()`, which manages axes and bar positioning in 3D space. The rendering approach leverages the d3-x3d bridge to convert D3 selections into X3D DOM elements for real-time interactivity.

SsreepavanKothapalli
69% match