Question

一周前刚刚开始学习和使用Highcharts。在我的应用程序中，用户从列表框中选择一个键值，并且在该键之外将检索一组值，并使用该数据创建多个线图的系列。在下面的屏幕截图中，第一个系列（浅蓝色）的名称为CDEP158，而在第二个系列（黑色）中，系列名称不应为“系列2”，它应为CDT158。第二系列的“系列2”是这里的问题。

这是图表数据准备代码，它接受来自点击事件中调用的jquery post回调函数的dataChart（结果）。

    function prepareChartData(dataChart)
{
    var dataSeries = [];
    var xTitle;

    for (var i = 0; i < dataChart.length; i++) {
        var items = dataChart[i];
        var xDate = +moment(items.Time);
        var seriesData = parseFloat(items.Value);

        dataSeries.push([xDate, seriesData]);
        xTitle = items.Name;
    }

    if (aeChart === undefined || aeChart === null)
    {
        plotChartData(dataSeries, xTitle);
        return;
    }

    aeChart.addSeries({
        title: xTitle,
        data: dataSeries
    });
};

创建Highchart的新实例及其配置的函数

    function plotChartData(dataseries, xtitle)
{
    aeChart = new Highcharts.Chart({
        chart: {
            renderTo: 'svgtrendspace',
            type: 'line',
            zoomType: 'xy',
            panning: true,
            panKey: 'shift',
            plotBorderWidth: 1
        },
        title: {
            text: ''
        },
        legend: {
            layout: 'horizontal',
            align: 'left',
            itemDistance: 10,
            borderWidth: 0,
            itemMarginTop: 0,
            itemMarginBottom: 0,
            padding: 20
        },
        plotOptions: {
            series: {
                states: {
                    hover: {
                        enabled: false
                    }
                },
                dataLabels: {
                    enabled: false,
                    format: '{y}'
                },
                allowPointSelect: false
            }
        },
        xAxis: {
            type: 'datetime',
            labels: {
                rotation: -65,
                style: {
                    fontSize: '9px',
                    fontFamily: 'Verdana, sans-serif'
                }
            }
        },
        yAxis: {
            gridLineColor: '#DDDDDD',
            gridLineWidth: 0.5
        },
        series: [{
            name: xtitle,
            data: dataseries,
            tooltip: {
                pointFormat: '{series.name}: <b>{point.y}</b><br/>',
                valueDecimals: 2
            }
        }]
    });
};

为什么第一个系列会得到正确的名称，但在第二个系列却没有？我的highcharts配置错了吗？我应该如何正确配置或格式化它来解决问题？

我搜索了与多个系列相关的类似问题，但我找不到任何可以帮助我的类似问题或答案。

非常感谢任何帮助。

Answer 1

它适用于第一个系列的事实意味着问题不在于您的代码，而在于您的init。

您是否可以在上述函数中调用console.log('Title: ' + xTitle);之前发出aeChart.addSeries()语句来检查您传入的内容？我怀疑是第二个系列没有通过标题，因此HighCharts因此自行投入Series2。

也许您不应该在初始xTitle循环的每次迭代中设置for的值？

Highcharts第二个系列名称标记为'Series 2'？

1 个答案: