如何将DataPool连接到其他组件？

如何将DataPool连接到其他组件首先你必须创建DataPool对象定义一个连接器并传递数据引用。关于这个主题的更多信息请参考数据池部分。之后你需要将连接器传递给组件配置就完成了。如何将组件连接到单元格1. 启用布局创建器图形界面要使用带有布局系统和编辑模式的仪表盘首先必须加载layout模块。 导入的顺序非常重要所以请确保在导入仪表盘模块之后再导入layout模块。scriptsrchttps://code.highcharts.com/dashboards/dashboards.js/scriptscriptsrchttps://code.highcharts.com/dashboards/modules/layout.js/script每个单元格都必须有一个id字段。相同的id必须传递给组件配置中的renderTo字段。组件和单元格的示例配置gui: { enabled: true, layouts: [{ id: layout-1, rows: [{ cells: [{ id: dashboard-col-0 }] }] }] }, components: [{ renderTo: dashboard-col-0, type: Highcharts, chartOptions: { chart: { type: pie }, series: [{data: [1,2,3]}] }, }]2. 禁用默认布局创建器您可以为布局创建自己的HTML结构使用CSS或其他CSS框架例如Tailwind、Bootstrap。 请记住每个容器都应有一个唯一的id用于渲染组件。div idcontainer div div iddashboard-col-0/div /div /divgui: { enabled: false } components: [{ renderTo: dashboard-col-0, type: Highcharts, chartOptions: { chart: { type: pie }, series: [{data: [1,2,3]}] }, }]禁用的图形界面不允许你使用编辑模式模块。我们如何同步组件要同步组件你必须指定你想在每个组件之间同步的事件并且它们必须使用相同的连接器。同步组件的示例components: [{ connector: { id: Vitamin }, sync: { visibility: true, highlight: true, extremes: true }, renderTo: dashboard-col-0, type: Highcharts, chartOptions: { chart: { type: pie } }, }, { renderTo: dashboard-col-1, connector: { id: Vitamin }, sync: { visibility: true, highlight: true, extremes: true }, type: Highcharts, chartOptions: { xAxis: { type: category }, chart: { animation: false, type: column } } }]查看我们的最简仪表盘演示中此同步功能的工作原理。