3D Charts

Dashboard supports three-dimensional chart types powered by ECharts-GL with WebGL rendering. 3D charts add depth to data visualization and are useful for exploring relationships across three variables.

Warning

3D charts require WebGL support in the browser. They are lazy-loaded on first use (approximately 300 KB additional download). Performance depends on the device’s GPU capabilities and the volume of data being rendered.

Available 3D Chart Types

3D Bar Chart

Extends the traditional bar chart into three dimensions. Each bar has X, Y, and Z positions plus height representing the data value. Best for comparing values across two categorical dimensions.

3D Scatter Chart

Plots data points in three-dimensional space. Each point’s position is determined by three numeric fields. Best for identifying clusters, outliers, and correlations across three variables simultaneously.

3D Surface Chart

Renders a continuous surface defined by X, Y, and Z values. The surface is colored based on the Z-axis value. Best for visualizing mathematical functions or continuous data distributions.

Creating a 3D Chart

  1. Navigate to Dashboard ‣ Chart Library

  2. Click New

  3. Set the Chart Type to one of: 3D Bar Chart, 3D Scatter Chart, or 3D Surface Chart

  4. Configure the data model, measures, and dimensions as with any chart

  5. Go to the 3D Options tab:

    • Enable 3D - Must be checked for 3D rendering

    • Camera Preset - Choose an initial viewing angle:

      • Default - Standard perspective view

      • Top Down - Looking straight down at the XY plane

      • Front - Looking at the XZ plane

      • Side - Looking at the YZ plane

      • Isometric - Equal-angle projection

      • Perspective - Natural perspective with depth

    • X-Axis Field - The field for the X dimension

    • Y-Axis Field - The field for the Y dimension

    • Z-Axis Field - The field for the Z dimension (typically the measure value)

  6. Click Save

Interacting with 3D Charts

3D charts support interactive controls:

  • Rotate - Click and drag to rotate the view around the data

  • Zoom - Scroll to zoom in and out

  • Pan - Right-click and drag to pan the view

  • Reset - Double-click to reset to the default camera position

Performance Considerations

3D rendering uses the device’s GPU via WebGL. Keep these guidelines in mind:

  • Data volume - Limit to a few thousand data points for smooth interaction. Use the Max Data Points setting in the Real-time tab.

  • Mobile devices - 3D charts may be slow on mobile devices or older hardware. Consider providing 2D alternatives for mobile users.

  • Multiple 3D charts - Having several 3D charts on one dashboard increases GPU load. Limit to 1-2 per dashboard for best performance.

  • Auto-refresh - Avoid short refresh intervals on 3D charts. The re-rendering cost is higher than for 2D charts.

Tip

If a 3D chart feels sluggish, try reducing the data volume with filters or a shorter date range, or switch to a 2D chart type that conveys the same information.

See also