首页 > 解决方案 > Highcharts 多个 rowsUrl 在同一个图表中

问题描述

如何使用 rowsUrl 显示多个系列?

小提琴示例:https ://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/data/livedata-rows

Highcharts.chart('container', {
  chart: {
    type: 'spline'
  },
  title: {
    text: 'Live Data (Rows JSON)'
  },

  subtitle: {
    text: 'Data input from a remote JSON file'
  },

  data: {
    rowsURL: 'https://demo-live-data.highcharts.com/time-rows.json',
    firstRowAsNames: false,
    enablePolling: true
  }
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

标签: highcharts

解决方案


使用seriesMapping属性:

data: {
    ...,
    seriesMapping: [{
        x: 0,
        y: 1
    }, {
        x: 0,
        y: 2
    }]
}

现场演示:https ://jsfiddle.net/BlackLabel/k8gt2vLp/

API:https ://api.highcharts.com/highcharts/data.seriesMapping


推荐阅读