Drilldown with zoom
Weeks drill into hours; the hourly level is a zoomable time series.
Open the chart without page chrome ↗
const options = {
chart: {
height: 380,
fontFamily: "Inter, Geist, \"IBM Plex Sans\", system-ui, sans-serif",
type: "bar",
zoom: {
enabled: true,
type: "x"
},
toolbar: {
show: true
}
},
series: [
{
name: "Orders",
data: [
{
x: "W1",
y: 337,
drilldown: "w1"
},
{
x: "W2",
y: 557,
drilldown: "w2"
},
{
x: "W3",
y: 651,
drilldown: "w3"
},
{
x: "W4",
y: 449,
drilldown: "w4"
},
{
x: "W5",
y: 412,
drilldown: "w5"
},
{
x: "W6",
y: 395,
drilldown: "w6"
},
{
x: "W7",
y: 450,
drilldown: "w7"
},
{
x: "W8",
y: 333,
drilldown: "w8"
},
{
x: "W9",
y: 340,
drilldown: "w9"
},
{
x: "W10",
y: 376,
drilldown: "w10"
},
{
x: "W11",
y: 440,
drilldown: "w11"
},
{
x: "W12",
y: 401,
drilldown: "w12"
}
]
}
],
plotOptions: {
bar: {
borderRadius: 3
}
},
dataLabels: {
enabled: false
},
drilldown: {
enabled: true,
series: [
{
id: "w1",
name: "Week 1 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1767571200000, 1],
[1767574800000, 1],
[1767578400000, 1],
[1767582000000, 1],
[1767585600000, 1],
[1767589200000, 1],
[1767592800000, 1],
[1767596400000, 1],
[1767600000000, 2],
[1767603600000, 3],
[1767607200000, 3],
[1767610800000, 4],
[1767614400000, 4],
[1767618000000, 4],
[1767621600000, 4],
[1767625200000, 3],
[1767628800000, 2],
[1767632400000, 2],
[1767636000000, 1],
[1767639600000, 1],
[1767643200000, 1],
[1767646800000, 1],
[1767650400000, 1],
[1767654000000, 1],
[1767657600000, 1],
[1767661200000, 1],
[1767664800000, 1],
[1767668400000, 1],
[1767672000000, 1],
[1767675600000, 1],
[1767679200000, 1],
[1767682800000, 2],
[1767686400000, 2],
[1767690000000, 3],
[1767693600000, 4],
[1767697200000, 4],
[1767700800000, 4],
[1767704400000, 4],
[1767708000000, 3],
[1767711600000, 3],
[1767715200000, 2],
[1767718800000, 2],
[1767722400000, 1],
[1767726000000, 1],
[1767729600000, 1],
[1767733200000, 1],
[1767736800000, 1],
[1767740400000, 1],
[1767744000000, 1],
[1767747600000, 1],
[1767751200000, 1],
[1767754800000, 1],
[1767758400000, 1],
[1767762000000, 1],
[1767765600000, 1],
[1767769200000, 2],
[1767772800000, 3],
[1767776400000, 3],
[1767780000000, 3],
[1767783600000, 4],
[1767787200000, 4],
[1767790800000, 4],
[1767794400000, 3],
[1767798000000, 3],
[1767801600000, 2],
[1767805200000, 2],
[1767808800000, 1],
[1767812400000, 1],
[1767816000000, 1],
[1767819600000, 1],
[1767823200000, 1],
[1767826800000, 1],
[1767830400000, 1],
[1767834000000, 1],
[1767837600000, 1],
[1767841200000, 1],
[1767844800000, 1],
[1767848400000, 1],
[1767852000000, 1],
[1767855600000, 2],
[1767859200000, 3],
[1767862800000, 3],
[1767866400000, 4],
[1767870000000, 4],
[1767873600000, 4],
[1767877200000, 4],
[1767880800000, 4],
[1767884400000, 3],
[1767888000000, 2],
[1767891600000, 2],
[1767895200000, 1],
[1767898800000, 1],
[1767902400000, 1],
[1767906000000, 1],
[1767909600000, 1],
[1767913200000, 1],
[1767916800000, 1],
[1767920400000, 1],
[1767924000000, 1],
[1767927600000, 1],
[1767931200000, 1],
[1767934800000, 1],
[1767938400000, 1],
[1767942000000, 2],
[1767945600000, 2],
[1767949200000, 3],
[1767952800000, 3],
[1767956400000, 4],
[1767960000000, 4],
[1767963600000, 4],
[1767967200000, 3],
[1767970800000, 3],
[1767974400000, 2],
[1767978000000, 2],
[1767981600000, 1],
[1767985200000, 1],
[1767988800000, 1],
[1767992400000, 1],
[1767996000000, 1],
[1767999600000, 1],
[1768003200000, 1],
[1768006800000, 1],
[1768010400000, 1],
[1768014000000, 1],
[1768017600000, 1],
[1768021200000, 1],
[1768024800000, 1],
[1768028400000, 2],
[1768032000000, 2],
[1768035600000, 3],
[1768039200000, 4],
[1768042800000, 4],
[1768046400000, 4],
[1768050000000, 4],
[1768053600000, 4],
[1768057200000, 3],
[1768060800000, 2],
[1768064400000, 1],
[1768068000000, 1],
[1768071600000, 1],
[1768075200000, 1],
[1768078800000, 1],
[1768082400000, 1],
[1768086000000, 1],
[1768089600000, 1],
[1768093200000, 1],
[1768096800000, 1],
[1768100400000, 1],
[1768104000000, 1],
[1768107600000, 1],
[1768111200000, 1],
[1768114800000, 2],
[1768118400000, 2],
[1768122000000, 3],
[1768125600000, 3],
[1768129200000, 4],
[1768132800000, 4],
[1768136400000, 4],
[1768140000000, 4],
[1768143600000, 3],
[1768147200000, 2],
[1768150800000, 1],
[1768154400000, 1],
[1768158000000, 1],
[1768161600000, 1],
[1768165200000, 1],
[1768168800000, 1],
[1768172400000, 1]
]
},
{
id: "w2",
name: "Week 2 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1768176000000, 1],
[1768179600000, 2],
[1768183200000, 1],
[1768186800000, 1],
[1768190400000, 1],
[1768194000000, 2],
[1768197600000, 2],
[1768201200000, 3],
[1768204800000, 4],
[1768208400000, 5],
[1768212000000, 6],
[1768215600000, 7],
[1768219200000, 7],
[1768222800000, 6],
[1768226400000, 6],
[1768230000000, 5],
[1768233600000, 4],
[1768237200000, 3],
[1768240800000, 1],
[1768244400000, 1],
[1768248000000, 2],
[1768251600000, 2],
[1768255200000, 1],
[1768258800000, 1],
[1768262400000, 1],
[1768266000000, 1],
[1768269600000, 1],
[1768273200000, 1],
[1768276800000, 1],
[1768280400000, 1],
[1768284000000, 2],
[1768287600000, 3],
[1768291200000, 4],
[1768294800000, 5],
[1768298400000, 6],
[1768302000000, 7],
[1768305600000, 7],
[1768309200000, 7],
[1768312800000, 6],
[1768316400000, 5],
[1768320000000, 4],
[1768323600000, 3],
[1768327200000, 1],
[1768330800000, 2],
[1768334400000, 1],
[1768338000000, 1],
[1768341600000, 1],
[1768345200000, 2],
[1768348800000, 1],
[1768352400000, 1],
[1768356000000, 2],
[1768359600000, 2],
[1768363200000, 1],
[1768366800000, 2],
[1768370400000, 1],
[1768374000000, 3],
[1768377600000, 4],
[1768381200000, 5],
[1768384800000, 5],
[1768388400000, 6],
[1768392000000, 6],
[1768395600000, 6],
[1768399200000, 6],
[1768402800000, 5],
[1768406400000, 4],
[1768410000000, 2],
[1768413600000, 1],
[1768417200000, 2],
[1768420800000, 1],
[1768424400000, 2],
[1768428000000, 1],
[1768431600000, 1],
[1768435200000, 1],
[1768438800000, 2],
[1768442400000, 1],
[1768446000000, 1],
[1768449600000, 2],
[1768453200000, 1],
[1768456800000, 2],
[1768460400000, 3],
[1768464000000, 4],
[1768467600000, 6],
[1768471200000, 6],
[1768474800000, 7],
[1768478400000, 6],
[1768482000000, 7],
[1768485600000, 6],
[1768489200000, 5],
[1768492800000, 4],
[1768496400000, 3],
[1768500000000, 1],
[1768503600000, 1],
[1768507200000, 1],
[1768510800000, 2],
[1768514400000, 1],
[1768518000000, 1],
[1768521600000, 1],
[1768525200000, 1],
[1768528800000, 2],
[1768532400000, 1],
[1768536000000, 1],
[1768539600000, 2],
[1768543200000, 1],
[1768546800000, 2],
[1768550400000, 4],
[1768554000000, 6],
[1768557600000, 6],
[1768561200000, 6],
[1768564800000, 6],
[1768568400000, 6],
[1768572000000, 6],
[1768575600000, 5],
[1768579200000, 4],
[1768582800000, 3],
[1768586400000, 2],
[1768590000000, 1],
[1768593600000, 1],
[1768597200000, 1],
[1768600800000, 2],
[1768604400000, 1],
[1768608000000, 1],
[1768611600000, 1],
[1768615200000, 2],
[1768618800000, 1],
[1768622400000, 2],
[1768626000000, 1],
[1768629600000, 1],
[1768633200000, 2],
[1768636800000, 4],
[1768640400000, 5],
[1768644000000, 5],
[1768647600000, 6],
[1768651200000, 6],
[1768654800000, 6],
[1768658400000, 6],
[1768662000000, 5],
[1768665600000, 4],
[1768669200000, 3],
[1768672800000, 2],
[1768676400000, 1],
[1768680000000, 1],
[1768683600000, 1],
[1768687200000, 1],
[1768690800000, 1],
[1768694400000, 2],
[1768698000000, 1],
[1768701600000, 2],
[1768705200000, 1],
[1768708800000, 2],
[1768712400000, 2],
[1768716000000, 1],
[1768719600000, 2],
[1768723200000, 4],
[1768726800000, 5],
[1768730400000, 6],
[1768734000000, 6],
[1768737600000, 7],
[1768741200000, 6],
[1768744800000, 6],
[1768748400000, 5],
[1768752000000, 4],
[1768755600000, 3],
[1768759200000, 1],
[1768762800000, 1],
[1768766400000, 1],
[1768770000000, 2],
[1768773600000, 2],
[1768777200000, 2]
]
},
{
id: "w3",
name: "Week 3 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1768780800000, 1],
[1768784400000, 2],
[1768788000000, 1],
[1768791600000, 2],
[1768795200000, 1],
[1768798800000, 2],
[1768802400000, 1],
[1768806000000, 3],
[1768809600000, 4],
[1768813200000, 6],
[1768816800000, 7],
[1768820400000, 8],
[1768824000000, 8],
[1768827600000, 7],
[1768831200000, 7],
[1768834800000, 6],
[1768838400000, 5],
[1768842000000, 4],
[1768845600000, 1],
[1768849200000, 2],
[1768852800000, 2],
[1768856400000, 1],
[1768860000000, 1],
[1768863600000, 2],
[1768867200000, 1],
[1768870800000, 2],
[1768874400000, 1],
[1768878000000, 2],
[1768881600000, 1],
[1768885200000, 2],
[1768888800000, 2],
[1768892400000, 3],
[1768896000000, 4],
[1768899600000, 6],
[1768903200000, 7],
[1768906800000, 8],
[1768910400000, 8],
[1768914000000, 8],
[1768917600000, 7],
[1768921200000, 6],
[1768924800000, 5],
[1768928400000, 3],
[1768932000000, 1],
[1768935600000, 1],
[1768939200000, 2],
[1768942800000, 2],
[1768946400000, 2],
[1768950000000, 1],
[1768953600000, 2],
[1768957200000, 2],
[1768960800000, 1],
[1768964400000, 2],
[1768968000000, 2],
// ... truncated, use Copy or open the full config
const chart = new WestCoastCharts(document.querySelector('#chart'), options)
chart.render()import WestCoastCharts from 'west-coast-charts'
import types from 'west-coast-charts/types'
import drilldown from 'west-coast-charts/features/drilldown'
WestCoastCharts.use(types).use(drilldown)
const options = {
chart: {
height: 380,
fontFamily: "Inter, Geist, \"IBM Plex Sans\", system-ui, sans-serif",
type: "bar",
zoom: {
enabled: true,
type: "x"
},
toolbar: {
show: true
}
},
series: [
{
name: "Orders",
data: [
{
x: "W1",
y: 337,
drilldown: "w1"
},
{
x: "W2",
y: 557,
drilldown: "w2"
},
{
x: "W3",
y: 651,
drilldown: "w3"
},
{
x: "W4",
y: 449,
drilldown: "w4"
},
{
x: "W5",
y: 412,
drilldown: "w5"
},
{
x: "W6",
y: 395,
drilldown: "w6"
},
{
x: "W7",
y: 450,
drilldown: "w7"
},
{
x: "W8",
y: 333,
drilldown: "w8"
},
{
x: "W9",
y: 340,
drilldown: "w9"
},
{
x: "W10",
y: 376,
drilldown: "w10"
},
{
x: "W11",
y: 440,
drilldown: "w11"
},
{
x: "W12",
y: 401,
drilldown: "w12"
}
]
}
],
plotOptions: {
bar: {
borderRadius: 3
}
},
dataLabels: {
enabled: false
},
drilldown: {
enabled: true,
series: [
{
id: "w1",
name: "Week 1 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1767571200000, 1],
[1767574800000, 1],
[1767578400000, 1],
[1767582000000, 1],
[1767585600000, 1],
[1767589200000, 1],
[1767592800000, 1],
[1767596400000, 1],
[1767600000000, 2],
[1767603600000, 3],
[1767607200000, 3],
[1767610800000, 4],
[1767614400000, 4],
[1767618000000, 4],
[1767621600000, 4],
[1767625200000, 3],
[1767628800000, 2],
[1767632400000, 2],
[1767636000000, 1],
[1767639600000, 1],
[1767643200000, 1],
[1767646800000, 1],
[1767650400000, 1],
[1767654000000, 1],
[1767657600000, 1],
[1767661200000, 1],
[1767664800000, 1],
[1767668400000, 1],
[1767672000000, 1],
[1767675600000, 1],
[1767679200000, 1],
[1767682800000, 2],
[1767686400000, 2],
[1767690000000, 3],
[1767693600000, 4],
[1767697200000, 4],
[1767700800000, 4],
[1767704400000, 4],
[1767708000000, 3],
[1767711600000, 3],
[1767715200000, 2],
[1767718800000, 2],
[1767722400000, 1],
[1767726000000, 1],
[1767729600000, 1],
[1767733200000, 1],
[1767736800000, 1],
[1767740400000, 1],
[1767744000000, 1],
[1767747600000, 1],
[1767751200000, 1],
[1767754800000, 1],
[1767758400000, 1],
[1767762000000, 1],
[1767765600000, 1],
[1767769200000, 2],
[1767772800000, 3],
[1767776400000, 3],
[1767780000000, 3],
[1767783600000, 4],
[1767787200000, 4],
[1767790800000, 4],
[1767794400000, 3],
[1767798000000, 3],
[1767801600000, 2],
[1767805200000, 2],
[1767808800000, 1],
[1767812400000, 1],
[1767816000000, 1],
[1767819600000, 1],
[1767823200000, 1],
[1767826800000, 1],
[1767830400000, 1],
[1767834000000, 1],
[1767837600000, 1],
[1767841200000, 1],
[1767844800000, 1],
[1767848400000, 1],
[1767852000000, 1],
[1767855600000, 2],
[1767859200000, 3],
[1767862800000, 3],
[1767866400000, 4],
[1767870000000, 4],
[1767873600000, 4],
[1767877200000, 4],
[1767880800000, 4],
[1767884400000, 3],
[1767888000000, 2],
[1767891600000, 2],
[1767895200000, 1],
[1767898800000, 1],
[1767902400000, 1],
[1767906000000, 1],
[1767909600000, 1],
[1767913200000, 1],
[1767916800000, 1],
[1767920400000, 1],
[1767924000000, 1],
[1767927600000, 1],
[1767931200000, 1],
[1767934800000, 1],
[1767938400000, 1],
[1767942000000, 2],
[1767945600000, 2],
[1767949200000, 3],
[1767952800000, 3],
[1767956400000, 4],
[1767960000000, 4],
[1767963600000, 4],
[1767967200000, 3],
[1767970800000, 3],
[1767974400000, 2],
[1767978000000, 2],
[1767981600000, 1],
[1767985200000, 1],
[1767988800000, 1],
[1767992400000, 1],
[1767996000000, 1],
[1767999600000, 1],
[1768003200000, 1],
[1768006800000, 1],
[1768010400000, 1],
[1768014000000, 1],
[1768017600000, 1],
[1768021200000, 1],
[1768024800000, 1],
[1768028400000, 2],
[1768032000000, 2],
[1768035600000, 3],
[1768039200000, 4],
[1768042800000, 4],
[1768046400000, 4],
[1768050000000, 4],
[1768053600000, 4],
[1768057200000, 3],
[1768060800000, 2],
[1768064400000, 1],
[1768068000000, 1],
[1768071600000, 1],
[1768075200000, 1],
[1768078800000, 1],
[1768082400000, 1],
[1768086000000, 1],
[1768089600000, 1],
[1768093200000, 1],
[1768096800000, 1],
[1768100400000, 1],
[1768104000000, 1],
[1768107600000, 1],
[1768111200000, 1],
[1768114800000, 2],
[1768118400000, 2],
[1768122000000, 3],
[1768125600000, 3],
[1768129200000, 4],
[1768132800000, 4],
[1768136400000, 4],
[1768140000000, 4],
[1768143600000, 3],
[1768147200000, 2],
[1768150800000, 1],
[1768154400000, 1],
[1768158000000, 1],
[1768161600000, 1],
[1768165200000, 1],
[1768168800000, 1],
[1768172400000, 1]
]
},
{
id: "w2",
name: "Week 2 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1768176000000, 1],
[1768179600000, 2],
[1768183200000, 1],
[1768186800000, 1],
[1768190400000, 1],
[1768194000000, 2],
[1768197600000, 2],
[1768201200000, 3],
[1768204800000, 4],
[1768208400000, 5],
[1768212000000, 6],
[1768215600000, 7],
[1768219200000, 7],
[1768222800000, 6],
[1768226400000, 6],
[1768230000000, 5],
[1768233600000, 4],
[1768237200000, 3],
[1768240800000, 1],
[1768244400000, 1],
[1768248000000, 2],
[1768251600000, 2],
[1768255200000, 1],
[1768258800000, 1],
[1768262400000, 1],
[1768266000000, 1],
[1768269600000, 1],
[1768273200000, 1],
[1768276800000, 1],
[1768280400000, 1],
[1768284000000, 2],
[1768287600000, 3],
[1768291200000, 4],
[1768294800000, 5],
[1768298400000, 6],
[1768302000000, 7],
[1768305600000, 7],
[1768309200000, 7],
[1768312800000, 6],
[1768316400000, 5],
[1768320000000, 4],
[1768323600000, 3],
[1768327200000, 1],
[1768330800000, 2],
[1768334400000, 1],
[1768338000000, 1],
[1768341600000, 1],
[1768345200000, 2],
[1768348800000, 1],
[1768352400000, 1],
[1768356000000, 2],
[1768359600000, 2],
[1768363200000, 1],
[1768366800000, 2],
[1768370400000, 1],
[1768374000000, 3],
[1768377600000, 4],
[1768381200000, 5],
[1768384800000, 5],
[1768388400000, 6],
[1768392000000, 6],
[1768395600000, 6],
[1768399200000, 6],
[1768402800000, 5],
[1768406400000, 4],
[1768410000000, 2],
[1768413600000, 1],
[1768417200000, 2],
[1768420800000, 1],
[1768424400000, 2],
[1768428000000, 1],
[1768431600000, 1],
[1768435200000, 1],
[1768438800000, 2],
[1768442400000, 1],
[1768446000000, 1],
[1768449600000, 2],
[1768453200000, 1],
[1768456800000, 2],
[1768460400000, 3],
[1768464000000, 4],
[1768467600000, 6],
[1768471200000, 6],
[1768474800000, 7],
[1768478400000, 6],
[1768482000000, 7],
[1768485600000, 6],
[1768489200000, 5],
[1768492800000, 4],
[1768496400000, 3],
[1768500000000, 1],
[1768503600000, 1],
[1768507200000, 1],
[1768510800000, 2],
[1768514400000, 1],
[1768518000000, 1],
[1768521600000, 1],
[1768525200000, 1],
[1768528800000, 2],
[1768532400000, 1],
[1768536000000, 1],
[1768539600000, 2],
[1768543200000, 1],
[1768546800000, 2],
[1768550400000, 4],
[1768554000000, 6],
[1768557600000, 6],
[1768561200000, 6],
[1768564800000, 6],
[1768568400000, 6],
[1768572000000, 6],
[1768575600000, 5],
[1768579200000, 4],
[1768582800000, 3],
[1768586400000, 2],
[1768590000000, 1],
[1768593600000, 1],
[1768597200000, 1],
[1768600800000, 2],
[1768604400000, 1],
[1768608000000, 1],
[1768611600000, 1],
[1768615200000, 2],
[1768618800000, 1],
[1768622400000, 2],
[1768626000000, 1],
[1768629600000, 1],
[1768633200000, 2],
[1768636800000, 4],
[1768640400000, 5],
[1768644000000, 5],
[1768647600000, 6],
[1768651200000, 6],
[1768654800000, 6],
[1768658400000, 6],
[1768662000000, 5],
[1768665600000, 4],
[1768669200000, 3],
[1768672800000, 2],
[1768676400000, 1],
[1768680000000, 1],
[1768683600000, 1],
[1768687200000, 1],
[1768690800000, 1],
[1768694400000, 2],
[1768698000000, 1],
[1768701600000, 2],
[1768705200000, 1],
[1768708800000, 2],
[1768712400000, 2],
[1768716000000, 1],
[1768719600000, 2],
[1768723200000, 4],
[1768726800000, 5],
[1768730400000, 6],
[1768734000000, 6],
[1768737600000, 7],
[1768741200000, 6],
[1768744800000, 6],
[1768748400000, 5],
[1768752000000, 4],
[1768755600000, 3],
[1768759200000, 1],
[1768762800000, 1],
[1768766400000, 1],
[1768770000000, 2],
[1768773600000, 2],
[1768777200000, 2]
]
},
{
id: "w3",
name: "Week 3 by hour",
type: "area",
xaxis: {
type: "datetime"
},
stroke: {
width: 1.5,
curve: "smooth"
},
fill: {
opacity: 0.2
},
data: [
[1768780800000, 1],
[1768784400000, 2],
[1768788000000, 1],
[1768791600000, 2],
[1768795200000, 1],
[1768798800000, 2],
[1768802400000, 1],
[1768806000000, 3],
[1768809600000, 4],
[1768813200000, 6],
[1768816800000, 7],
[1768820400000, 8],
[1768824000000, 8],
[1768827600000, 7],
[1768831200000, 7],
[1768834800000, 6],
[1768838400000, 5],
[1768842000000, 4],
[1768845600000, 1],
[1768849200000, 2],
[1768852800000, 2],
[1768856400000, 1],
[1768860000000, 1],
[1768863600000, 2],
[1768867200000, 1],
[1768870800000, 2],
[1768874400000, 1],
[1768878000000, 2],
[1768881600000, 1],
[1768885200000, 2],
[1768888800000, 2],
[1768892400000, 3],
[1768896000000, 4],
[1768899600000, 6],
[1768903200000, 7],
[1768906800000, 8],
[1768910400000, 8],
[1768914000000, 8],
[1768917600000, 7],
[1768921200000, 6],
[1768924800000, 5],
[1768928400000, 3],
[1768932000000, 1],
[1768935600000, 1],
[1768939200000, 2],
[1768942800000, 2],
[1768946400000, 2],
[1768950000000, 1],
[1768953600000, 2],
[1768957200000, 2],
[1768960800000, 1],
[1768964400000, 2],
[1768968000000, 2],
// ... truncated, use Copy or open the full config
const chart = new WestCoastCharts(document.querySelector('#chart'), options)
await chart.render()Waiting for the chart.
Open Data & agent view to read this chart through chart.describe().
Read from the running library through its optional agent/describe module. Text, table and JSON share the same snapshot. Demo data only.
$ wcc chart export drilldown-column-drilldown-zoom.json --out drilldown-column-drilldown-zoom.svg --with-tablePublic agent tools 0.2.3, tested with Library 1.1.5; available from the versioned GitHub release and npm. Save a JSON spec first and check the loaded runtime and supported modules before rendering. Command reference
Loading /gallery/drilldown/column-drilldown-zoom/index.md …