Question

很抱歉，如果之前有人提出此问题，但我找不到与我的问题相关的类似问题。

我遇到的问题是，当导出到PNG，JPG等时，该系列会加倍。因此，如果我的屏幕图表上绘制了四个系列，那么在导出时它将在图例中有八个系列。

我认为问题与导出后续执行图表的'加载'事件有关。

$(function () {

    Highcharts.setOptions({
        global: {
            useUTC: false
        }
    });

    function fnFetchData(chart) {
        // Just imagine an AJAX request has just been done to get a JSON response
        //  JSONData = $.getJSON('/FetchSales');   
        var JSONData
        JSONData = {
            seriesName: 'Sales 2013',
            data: [(Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1, (Math.random() * 100) + 1, 
                   (Math.random() * 100) + 1]
        };

        //alert('About to load the chart Data');

        chart.addSeries({
            name: JSONData.seriesName,
            data: JSONData.data,
            type: 'spline'
        }, true);
        chart.redraw(true);
    };


    // Create the chart
    $('#container').highcharts({
        chart: {
            events: {
                load: function () {
                    fnFetchData(this);
                }
            }
        },
        title: {
            text: 'Chart Data from load Event'
        },
        exporting: {
            enabled: true,
            scale: 2,
            filename: 'ChartWithDoubleupSeries'
        },
        spline: {
            animation: false
        },
        series: []
    });

});

我可以重现这个问题，这是一个例子：

http://jsfiddle.net/FtjJF/

我一直认为导出时可能会出现'load'事件的错误，除非这是标准行为，我需要包含和额外的选项。

版本详情：

Highstock JS v1.3.1（2013-04-09）
Highstock JS v1.3.1（2013-04-09）导出模块

Answer 1

简单的解决方法是使用setTimeout（）：

            load: function () {
                var chart = this;
                setTimeout(function() { 
                    fnFetchData(chart);
                }, 1);
            }

对我而言，看起来像一个错误，报道：https://github.com/highslide-software/highcharts.com/issues/1868 谢谢！

Answer 2

目前作为替代解决方案是将系列名称存储到数组中。当load事件被触发时，我检查系列名称以查看它是否存在于数组中。如果是，请不要调用addSeries方法。

var AvailableSeries = [];

$( chart.series).each(function(key,value){
   AvailableSeries.push(value.name);
});


if ($.inArray( 'Sales 2013' ,AvailableSeries)==-1 )  {
    chart.addSeries(name:'Sales 2013', data:[234,453,56732,435,4,45,32,232,43]});  
};

经过一段时间的长期解决方案调查后，我添加了这行“options.chart.events = null;”到exportpting.js脚本。

此解决方案的问题可能是导出图表时执行图表事件的正当理由。我想不出一个。可能应该有一个选项来在导出时禁止事件：

{ exporting:{ skipEvents:true } }

Answer 3

通过实用的方式导出图表，使加载事件为空

var chart = $('#chart-container').highcharts();
chart.exportChart(
    {type: 'image/png', filename: 'name'},
    {chart: { events:null } });

导出时图例中的重复系列

3 个答案: