展开Highcharts

Question

我正在使用“ highcharts”：“ ^ 6.1.2”，我已经修改了图例标题

legend: {
    layout: 'horizontal',
    backgroundColor: '#FFFFFF',
    align: 'left',                      
    verticalAlign: 'top',
    margin:35,
    x: 90,
    y:-25,
    itemDistance: 50,
    symbolHeight : 17,
    symbolWidth : 17,
    itemStyle : {
        "fontFamily": "'Raleway', sans-serif !important",
        "fontSize"  : "14px !important",
    },
    title : {
        text : "Filter by :",
        style : {
            "fontFamily": "'Raleway', sans-serif !important",
            "fontSize" : "1rem !important",
            "color" : "#5d737e !important", 
            "fontWeight": "500 !important",
        }
    }
},

也加载为

chart: {
    type: 'area',
    events: {
        load: function(e) { 
            var title = this.legend.title;
            title.translate(-83, 27);
        },
        redraw: function(e) { 
            var title = this.legend.title;
            title.translate(-83, 27);
        },
    }
},

我需要下载并共享此图，因为我添加了自定义按钮并使用了导出模块。

exporting: {
    chartOptions: {
    chart:{
        events: {
            load: function(e) { 
                var title = this.legend.title;
                title.translate(-83, 27);
            },
            redraw: function(e) { 
                var title = this.legend.title;
                title.translate(-83, 27);
            },
        }
    },
    legend: {
        layout: 'horizontal',
        backgroundColor: '#FFFFFF',
        align: 'left',                      
        verticalAlign: 'top',
        margin:35,
        x: 90,
        y:-25,
        itemDistance: 50,
        symbolHeight : 17,
        symbolWidth : 17,
        itemStyle : {
            "fontFamily": "'Raleway', sans-serif !important",
            "fontSize"  : "14px !important",
        },
        title : {
            text : "Filter by :",
            style : {
                "fontFamily": "'Raleway', sans-serif !important",
                "fontSize" : "1rem !important",
                "color" : "#5d737e !important", 
                "fontWeight": "500 !important",
            }
        }
      }
    }
}

但是导出时图例标题显示不正确。定制点击不会应​​用它。但是，如果我使用默认下载选项，则可以正常工作

这里是js fiddle link

查看图例标题位置

Answer 1

不能将JSON.stringify用于这些功能。您需要将图表发布为svg：

$("#download").click(function() {
    var obj = {};
    ...

    obj.svg = chart.getSVG(chart.options);
    ...

});

实时演示： https://jsfiddle.net/BlackLabel/u739oknb/

API参考： https://api.highcharts.com/class-reference/Highcharts.Chart#getSVG