Observable Framework — ECharts (observable-framework-lib-echarts)

Observable Framework documentation: Library: Apache ECharts Source: https://observablehq.com/framework/lib-echarts

Apache ECharts, an open-source JavaScript visualization library, is available by default as echarts in Markdown. You can also import it explicitly like so:

import * as echarts from "npm:echarts";

To use ECharts, declare a container element with the desired dimensions, display it, and then call echarts.init.

const myChart = echarts.init(display(html`<div style="width: 600px; height:400px;"></div>`));

myChart.setOption({
  title: {
    text: "ECharts getting started example"
  },
  tooltip: {},
  xAxis: {
    data: ["shirt", "cardigan", "chiffon", "pants", "heels", "socks"]
  },
  yAxis: {},
  series: [
    {
      name: "sales",
      type: "bar",
      data: [5, 20, 36, 10, 10, 20]
    }
  ]
});