Advanced Charts
- These chart renderers are planned for later.
- Examples describe proposed contracts for each chart family.
- Reference illustrations show the intended chart shapes.
Advanced overview
Planned for later.
Advanced: Tree
Show parent/child relationships.
Data type: ChartHierarchyNode. Planned; illustrative contract, not available in the basic release.
1ChartHierarchyNode[] values = [2 { id: "apple", parent: "fruit", label: "Apples", value: 120 }3]Advanced: Treemap
Show hierarchical quantities as nested rectangles.
Data type: ChartHierarchyNode. Planned; illustrative contract, not available in the basic release.
1ChartHierarchyNode[] values = [2 { id: "apple", parent: "fruit", label: "Apples", value: 120 }3]Advanced: Sunburst
Show a hierarchy as nested rings.
Data type: ChartHierarchyNode. Planned; illustrative contract, not available in the basic release.
1ChartHierarchyNode[] values = [2 { id: "apple", parent: "fruit", label: "Apples", value: 120 }3]Advanced: Circle packing
Show a hierarchy as nested circles.
Data type: ChartHierarchyNode. Planned; illustrative contract, not available in the basic release.
1ChartHierarchyNode[] values = [2 { id: "apple", parent: "fruit", label: "Apples", value: 120 }3]Advanced: Network
Connect identified nodes using source/target edges.
Data type: ChartGraphNode + ChartGraphEdge. Planned; illustrative contract, not available in the basic release.
1ChartGraphNode[] values = [2 { id: "orchard", label: "Orchard" }3]Advanced: Sankey
Show weighted flows between stages.
Data type: ChartGraphEdge + ChartGraphNode. Planned; illustrative contract, not available in the basic release.
1ChartGraphEdge[] values = [2 { source: "orchard", target: "store", weight: 120 }3]Advanced: Chord
Show weighted connections around a circle.
Data type: ChartGraphEdge + ChartGraphNode. Planned; illustrative contract, not available in the basic release.
1ChartGraphEdge[] values = [2 { source: "orchard", target: "store", weight: 120 }3]Advanced: Geographic points
Place observations on longitude/latitude coordinates.
Data type: ChartGeoPoint. Planned; illustrative contract, not available in the basic release.
1ChartGeoPoint[] values = [2 { latitude: 41.8, longitude: -87.6, value: 120 }3]Advanced: Region map
Color geographic regions by measurement; requires matched region geometry.
Data type: ChartGeoRegion. Planned; illustrative contract, not available in the basic release.
1ChartGeoRegion[] values = [2 { region: "north", value: 120 }3]Advanced: 3D scatter
Compare three numeric measurements.
Data type: ChartXYZPoint. Planned; illustrative contract, not available in the basic release.
1ChartXYZPoint[] values = [2 { x: 120, y: 60, z: 40, label: "Apples" }3]Advanced: 3D line
Connect ordered positions in three dimensions.
Data type: ChartXYZPoint. Planned; illustrative contract, not available in the basic release.
1ChartXYZPoint[] values = [2 { x: 120, y: 60, z: 40, label: "Apples" }3]Advanced: Surface
Show values on a grid or connected mesh.
Data type: ChartSurface. Planned; illustrative contract, not available in the basic release.
1ChartSurface[] values = [2 { x: [0, 1], y: [0, 1], z: [[1, 2], [2, 3]] }3]Advanced: Contour
Show equal-value contours from a surface.
Data type: ChartSurface. Planned; illustrative contract, not available in the basic release.
1ChartSurface[] values = [2 { x: [0, 1], y: [0, 1], z: [[1, 2], [2, 3]] }3]Common Mistakes
Keep numbers numeric. Two text coordinates are not a basic chart point. A numeric X/Y point needs a non-empty label, and duplicate coordinates within one named list are rejected. Bar and slice charts require a category; numeric X/Y uses line or area.
Use more than one named list to compare groups. Percentage stacks need a positive total at every coordinate. Stacks and slices reject more than 256 displayed points rather than changing the meaning of totals. Intermediate and advanced examples are proposed contracts.