Fork of interactive bar chart

100%

Fork of interactive bar chart

✓ Published0🌍 Public

Last edited Mar 12, 2022

Created on Mar 12, 2022

This interactive column chart displays GEMSTONES data, with bars representing values for categories like Diamond, Bluesaphire, Emerald, and others. The chart uses a 3D perspective effect with configurable rotation parameters. Built with the Highcharts JavaScript library and jQuery, the code configures a column chart with stacked, grouped bars and custom depth settings. The y-axis is labeled "Most effected Countries with Covid," though the series data appears to represent prices.

AI-generated description

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

Similar vizzes

Loading thumbnail…

interactive bar chart

This interactive bar chart displays gemstone prices using a 3D column layout, with each bar representing a different gem type such as Diamond, Emerald, and Ruby. The chart employs Highcharts within a jQuery interface, configured with 3D rendering options including alpha, beta, and depth settings. The data values, shown on the y-axis labeled with COVID-related context, are presented in a single series titled "Total Price." The visualization uses categorical x-axis labels and stacked column formatting to compare the gemstone values.

Eeravellisaimeghana

87% match

Loading thumbnail…

Untitled

A 3D bar chart displays the prices of gemstone categories (diamond, emerald, ruby) across four unnamed series. The visualization uses AnyChart’s `bar3d` chart type with data mapped from a static dataset. The chart includes animated rendering, a dollar-formatted y-axis, rotated x-axis labels, a legend, and custom tooltips showing values in dollars. The bar series are styled with depth and perspective via `zAspect`, `zAngle`, and `zDistribution` settings.

Eeravellisaimeghana

76% match

Loading thumbnail…

maggi

This visualization displays a 3D bar chart comparing gemstone prices (diamond, emerald, ruby) across four unspecified value categories. The chart uses AnyChart's `bar3d` method with a Cartesian 3D layout. The code maps data through `anychart.data.set` and `mapAs` to create four series, applies dollar formatting to the y-axis labels, and configures tooltips, legends, and interactive hover modes. The chart is rendered in a full-page container using AnyChart's standard API.

Eeravellisaimeghana

75% match

Loading thumbnail…

Sai Meghana

This example visualizes six years of gemstone price data across multiple gem types using an interactive 3D bar chart. The visualization renders the dataset as a multi-series bar chart in three-dimensional space, with each bar’s height representing a yearly value. The code loads CSV data via `d3.csv`, parses it with a custom row function, and renders the chart using the `d3.x3d.chart.barChartMultiSeries` API, which integrates D3 with X3DOM for WebGL-based 3D graphics. The chart is displayed within an HTML div using D3’s selection and `.datum()` method.

Eeravellisaimeghana

73% match

Loading thumbnail…

Fork of 3D chart

This example displays the top 10 countries most affected by COVID-19 using a 3D bar chart rendered via the d3-x3d library and X3DOM. It loads CSV data from a GitHub gist, parses each row into key-value pairs for country and case counts, and feeds this into a multi-series bar chart component. The chart is attached to a div with a heading, and the visualization updates once the asynchronous CSV fetch completes. The code relies on d3.csv for data parsing, d3.select for DOM manipulation, and the chart’s datum and call methods for rendering.

VVineela Reddy

71% match

Loading thumbnail…

Fork of Fork of Interactive pie and bar

This interactive dashboard combines a pie chart and bar chart to compare the top 5 countries across teaching, research, and citations. Hovering over a bar updates the pie chart and legend to display the corresponding data breakdown. Built with React and D3 v3, it uses SVG rendering with animations via `transition().duration(500)` to smoothly update bar heights and colors. The data is processed from a JavaScript object containing frequency values for each category.

JJerlineJJ

71% match

Loading thumbnail…

Fork of Fork of ICE-6: Rendering Marks and Channels with React & D3

This bar chart displays COVID-19 data for fifteen countries, ranking them by basic cost. The visualization uses React to manage state and render SVG elements, while D3 v5 provides scales, axes, and data loading via `d3.csv`. Marks are drawn as bars using `rect` elements, with `d3.scaleBand` for the y-axis and `d3.scaleLinear` for the x-axis. The chart loads data from a CSV file hosted on GitHub.

Cchandanagandla

71% match

Loading thumbnail…

interactive

A 3D interactive column chart shows the total COVID-19 case counts for the most affected countries, with the United States leading at over 80 million cases. The chart uses Highcharts with 3D options enabled, setting alpha and beta angles for rotation and a depth for the columns. Data is provided inline as arrays of [index, value] pairs, mapped to category labels for each country. The jQuery `$` function initializes the chart within a container div, using the Highcharts `column` chart type with stacking and grouping disabled.

Bbhargavarathod

70% match