「实战应用」如何用图表控件LightningChart JS创建树状图应用？

// 引入LightningChart JS图表库
<script src="https://unpkg.com/@arction/lcjs@^2.3.0/dist/lcjs.iife.js"></script>
 
// 创建一个LightningChart实例
const lightningChart = new Arction.Charting.LightningChart();
 
// 创建一个树状图表
const treeMapChart = lightningChart.ChartXY({
  container: 'treemap-container', // 指定DOM元素的ID
  theme: Arction.Charting.themes.lightTheme, // 使用亮色主题
  title: {
    text: 'Tree Map Example' // 图表标题
  },
  axes: [
    { // 主轴定义
     position: 'left',
      title: {
        text: 'Size'
      },
      scale: {
        type: 'log', // 使用对数尺度
        minimum: 1,
        maximum: 10000
      }
    },
    { // 副轴定义
     position: 'bottom',
      title: {
        text: 'Name'
      }
    }
  ]
});
 
// 构建树状图表的数据
const data = [
  {name: 'Item 1', value: 1000},
  {name: 'Item 2', value: 600},
  {name: 'Item 3', value: 300}
  // ... 更多数据项
];
 
// 创建树状图系列
const treemapSeries = treeMapChart.addTreeMapSeries(
  data,
  node => node.value, // 指定节点值的访问器
  node => node.name // 指定节点标签的访问器
);
 
// 初始化树状图
treemapSeries.build();

这段代码演示了如何使用LightningChart JS创建一个简单的树状图应用。首先，我们引入了LightningChart JS库。接着，我们创建了一个LightningChart实例，并定义了一个树状图表。然后，我们为树状图表定义了数据和配置，并创建了一个树状图系列。最后，我们构建并初始化了这个树状图，使其能够在指定的DOM元素中显示。