在揭示HighCharts时,无法根据需要禁用传奇标题 /启用传奇标题



我正在使用" 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小提琴链接

请参阅传奇标题位置

您无法将JSON.stringify用于功能。您需要将图表发布为svg

$("#download").click(function() {
    var obj = {};
    ...
    obj.svg = chart.getSVG(chart.options);
    ...
});

实时演示: https://jsfiddle.net/blacklabel/u7399oknb/

API参考: https://api.highcharts.com/class-reference/highcharts.chart#getsvg

最新更新