github.com/depley/nicegui-custom-echarts

  // scatter series with lot of data

  const echartOptions = {
    xAxis: { type: "value" },
    yAxis: { type: "value" },
    series: [{ 
      type: "scatter", 
      data: Array.from(
        { length: 10000 }, (_, i) => [i, i]
      )
    }]
  };
      

  // line series with animation

  const echartOptions = {
    xAxis: {
      type: "category",
      data: ["Mon", "Tue", "Wed", "Thu", "Fri"],
    },
    yAxis: {type: "value"},
    series: [{
      type: "line",
      data: [150, 230, 224, 147, 260] 
    }],
    animationDuration: 5000,
  };
      

on page load on resize

// simple resize observer

const el = document.getElementById("chart-container");
const chart = echarts.init(el);

const resizeObserver = new ResizeObserver(chart.resize).observe(el);

chart.setOption(echartOptions);
      

// on_off createResizeObserver

const el = document.getElementById("chart-container");
const chart = echarts.init(el);

const createResizeObserver = () => {
  new ResizeObserver(chart.resize).observe(el);
  chart.off("finished", createResizeObserver);
};
chart.on("finished", createResizeObserver);   

chart.setOption(echartOptions);