首页 文章

Highcharts - 导出图表的当前状态

提问于
浏览 次
2

Highcharts的导出方法根据用户的交互使用图表的初始状态而不是最新状态 . 如果您显示/隐藏某些系列，然后导出图表，您仍然可以获得所有系列而不是图表实际显示的系列 .

var chart;
$(document).ready(function() {

    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'chart',
            defaultSeriesType: 'line',
        },

        title: {
            text: 'Expression Profile',
        },

        subtitle: {
            text: 'Reference: act'
        },

        xAxis: {
            categories: ['14das-seedling','25das-aerial','35das-aerial',
                         '42das-rosette','42das-stem','53das-stem',
                         '53das-inflores'],
            title: {
                text: 'Development stages',
                margin:20
            }

        },

        yAxis: {
            title: {                                            
                text: 'Log10 act'
            },

            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },

        legend: {
            margin:20
        },

        tooltip: {
            formatter: function() {
                return '<b>mir'+ this.series.name +'</b>
'+
                                this.x +' 
log10:'+ this.y ;
            }
        },

        series: [
            {
                name: '156a',
                data: [-2.75607, -3.41066, -4.10053, -4.63856, 
                       -4.73462,-4.6145,-3.90987]
            },
            {
                name: '156b',
                data: [-4.15935, -6.54969, -6.70229, -5.80646, 
                       -5.68092,-5.38481,-5.96406]
            },
            {
                name: '156c',
                data: [-4.83317, -5.52142, -4.94995, -5.47179, 
                       -4.97123,-4.86163,-5.12806]
            },
            {
                name: '156d',
                data: [0, -5.93499, -5.41856, -5.88918, 
                       -6.70304,-5.69335,-5.39792]
            },
            {
                name: '156e',
                data: [-4.0707, -6.1185, -6.58353, -6.17734, 
                       -6.84433,-5.4114,-5.37817]
            },
            {
                name: '156f',
                data: [-3.97561, -5.02619, -5.67834, -5.65722, 
                       -5.76238,-4.51125,-5.30344]
            },
            {
                name: '156g',
                data: [-3.81589, -2.50758, -2.41623, -3.63983, 
                       -3.73004,-2.90055,-3.61997]
            },
            {
                name: '156h',
                data: [-4.31169, -5.74017, -5.55419, -5.26679,
                       -5.01009,-4.99596,-5.68062]
            }
         ] 
    });
});

这是我的小提琴：http://jsfiddle.net/sherlock85/safKs/

是否可以导出图表的当前状态？

任何帮助，将不胜感激 .

highcharts export

3 回答

  • 0

    对我来说，即使修改图表，也会导出最新的状态 . 我想如果你在修改后做了chart.redraw（），它将导出最新的状态 . 还尝试升级到最新版本的highcharts .

    回复于
  • 1

    此问题已在Highcharts的2.1.5版中得到修复 . 我相信下面的changelog评论可以解决您的问题 .

    现在，导出的图表在缩放和可见性选项后面向用户设置的最小和最大值 .

    回复于
  • 1

    如果您在图表中使用了以下代码，问题仍然存在：

    chart = new Highcharts.Chart({
        chart: {
            ...,
            events: {
                load: function(event) {
                    this.series.forEach(function(d,i){if(d.options.id==1)d.hide()})
                }
            }    
        },...

    这段代码负责最初隐藏图表中的系列（本例中id == 1） . 它似乎具有无法导出图形当前状态的负面影响 .

    删除它，并解决了最初的问题 .

    如果您仍想保留数据系列的“初始隐藏”，并使用AJAX（和jQuery）来获取数据，请使用以下类型的代码：

    $.ajax({
    type: "GET",
    url: myURL,
    data: {data: myData},
    dataType: 'json',
    success: function(data) {
        chart.series[0].setData(data[0], true);
        chart.series[1].setData(data[1], true);
    },
    complete: function(jqXHR, textStatus) {
        chart.series[1].hide();
    }
});
    回复于

相关问题