Public
Edited
Sep 17, 2023
data = FileAttachment("sp500-components-2023-09-10.json").json()
import { chart }
with { data as data, treemapSelected as treemapType, schemeSelected as schemeColor}
from "@chiahsun-ws/treemap"
chart
import {treemapOptions as treemapOptions2, schemeOptions as schemeOptions2} from "@chiahsun-ws/nested-treemap"
viewof treemapSelected2 = Inputs.select(treemapOptions2, {value: treemapOptions2[5], label: "Treemap types"})
schemeOptions2
viewof schemeSelected2 = Inputs.select(schemeOptions2, {value: schemeOptions2[18], label: "Scheme colors"})
import { chart as chart2 }
with { data as data, treemapSelected2 as treemapType, schemeSelected2 as schemeColor}
from "@chiahsun-ws/nested-treemap"
chart2
import {treemapOptions as treemapOptions3, schemeOptions as schemeOptions3 } from "@chiahsun-ws/zoomable-nested-treemap"
viewof treemapSelected3 = Inputs.select(treemapOptions3, {value: "treemapSquarify", label: "Treemap types"})
viewof schemeSelected3 = Inputs.select(schemeOptions3, {value: "interpolateMagma", label: "Scheme colors"})
width = 1500
height = 2000
import { chart as chart3 }
with {
data as data,
treemapSelected2 as treemapType,
schemeSelected2 as schemeColor,
width as width,
height as height
}
from "@chiahsun-ws/zoomable-nested-treemap"
chart3
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
