See here for the example code that generated this page

3D Surface Chart Examples

This page demonstrates 3D surface plots in JSPlots using Plotly.

Single and multiple surfaces: Basic 3D surface visualization with grouping
Interactive controls: Rotate, zoom, and pan to explore from all angles
Filtering: Use dropdown filters to filter data and dynamically update the surface
Color gradients: Automatic color schemes for different groups

Click and drag to rotate the 3D plots. Use scroll wheel to zoom!

Example 1: Basic 3D Surface

A simple 3D surface showing a ripple pattern. This demonstrates the basic usage with a single surface.

3D Surface: sin(√(x² + y²))

Example 2: Multiple Surfaces with Grouping

Compare different mathematical functions by grouping. Each function gets its own color gradient.

Multiple 3D Surfaces Comparison

Example 3: 3D Surface with Filtering

This example demonstrates filtering capability. Use the dropdown filters to filter by distance from origin or region (quadrant). The surface updates dynamically as you adjust the filters - perfect for exploring subsets of your data!

3D Surface with Filtering

Example 4: Shape Family Filtering

This example shows the power of filtering for exploring different mathematical families. Use the shape family filter to switch between trigonometric functions and polynomials. Within each family, you can see different shapes by color.

Shape Family Explorer

Example 5: Wave Interference Pattern

A classic physics demonstration showing interference from two wave sources.

Wave Interference Pattern

Key Features Summary

Interactive 3D controls: Click and drag to rotate, scroll to zoom, shift+drag to pan
Multiple surface support: Compare different datasets on the same plot with distinct color gradients
Data filtering: Interactive multi-select dropdowns for both continuous and categorical variables (like distance, region, or shape family)
Dynamic updates: Surfaces update in real-time as you adjust filters - perfect for exploring data subsets
Scientific applications: Perfect for mathematical functions, simulations, and terrain data
Integration: Combine with other plot types, images, and text blocks

Tip: Hover over the surface to see exact x, y, z coordinates!