Interactive surface 3D

Sampled mathematical surfaces and closed parametric meshes for seeing overall three-dimensional shape.

Purpose: Explore a sampled height field or closed parametric mesh.
Use when: Overall shape, peaks, valleys, or connected volume matter more than a single exact sample.
Avoid when: Users need to compare individual values or cannot use a three-dimensional view.
Equivalent data: Formula, topology, domains, sample count, and downloadable CSV expose the full dataset.

Default Rendered example

y = i / 60, x = j / 60, z = sin(x × π) × sin(y × π), with i and j from -60 through 59

Exact surface data

Formula: y = i / 60, x = j / 60, z = sin(x × π) × sin(y × π), with i and j from -60 through 59

14400 ordered points. X domain [-1, 0.9833333333333333]; Y domain [-1, 0.9833333333333333]; Z domain [-1, 1].

View remains stationary; initial drawing may animate. Reduced-motion preference disables animation.

Download all exact points as CSV

y = i / 10, x = j / 10, z = sin(x² + y²) × x / π, with i and j from -30 through 29

Exact surface data

Formula: y = i / 10, x = j / 10, z = sin(x² + y²) × x / π, with i and j from -30 through 29

3600 ordered points. X domain [-3, 2.9]; Y domain [-3, 2.9]; Z domain [-0.9437987534484451, 0.954325476238276].

View remains stationary; initial drawing may animate. Reduced-motion preference disables animation.

Download all exact points as CSV

A closed row-major mesh sampled entirely on the server.

Exact surface data

Formula: θ ∈ [0, 2π], φ ∈ [0, π]; hx = 13.5 × sin³(θ); c = 0.56 × ((1 + cos(θ)) / 2)²⁴; hz = 0.92 × (13cos(θ) − 5cos(2θ) − 2cos(3θ) − cos(4θ)) + c; s = sin(φ); x = s × hx; y = 5.2 × cos(φ); z = −1.5 + s × (hz + 1.5)

3185 ordered points. X domain [-13.5, 13.5]; Y domain [-5.2, 5.2]; Z domain [-15.64, 10.971050872962488].

View rotates automatically and initial drawing may animate. Reduced-motion preference disables animation and keeps the same surface stationary.

Download all exact points as CSV

Usage Example

@interactive.Surface3D(interactive.Surface3DConfig{
  Label: "Parametric heart",
  Series: []interactive.Surface3DSeries{{
    Name: "heart",
    Points: heartPoints, // Server-generated in row-major order.
    Mesh: &interactive.Surface3DMesh{Rows: 49, Columns: 65},
    Style: interactive.Surface3DSeriesStyle{
      Shading: interactive.Surface3DShadingLambert,
      Wireframe: interactive.Bool(false),
    },
  }},
  Grid: interactive.Surface3DGrid{View: &interactive.Surface3DView{
    AutoRotate: interactive.Bool(true),
  }},
  DataSummary: interactive.Surface3DDataSummary{
    Formula: "x = x(u,v); y = y(u,v); z = z(u,v)",
  },
})

Surface variants

Height fields keep unique X/Y samples. Closed meshes add explicit row-major topology and may repeat seam or pole coordinates.

Go API

v0.0.1

The examples above cover behavior and composition. pkg.go.dev is the canonical reference for exported types, functions, methods, and Go documentation.

github.com/araihu/goshtoso-charts/components/interactive

Enabled, disabled, hidden, and omitted wrapper behavior, controls, export, and client transitions are shared by every chart. Review chart controls, then compare static/vector and interactive capabilities.

Open v0.0.1 API