Highcharts - 傳奇物品填充

Question

Highcharts 中標簽項的文本填充似乎存在問題。 與 Chrome 相比，我在 Firefox 中得到了非常不同的結果： http : //jsfiddle.net/moppa/cMXyG/18/

如果我檢查瀏覽器中的元素， tspan標簽在 Chrome 中的高度為 16 像素，但為 20 像素。 在 FF 中，它看起來像是添加了一些像素作為填充，因為文本沒有填滿整個標簽。 我已經嘗試過legend.itemStyle行高和字體大小設置，但沒有運氣。

有沒有人有任何想法？ Firefox 25.0.1 和 Chrome 31.0.1650.57m

附加代碼以符合 JSFiddle 限制：

var chart = new Highcharts.Chart({

    chart: {
        renderTo: 'container'
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    legend: {
        layout: 'vertical',
        itemMarginTop: 0,
        itemMarginBottom: 0,
        align: 'right',
        verticalAlign: 'middle',
        padding:0
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]},
    {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]},
    {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]},
    {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]},
    {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]},
    {
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]}]

});

Answer 1

嘗試使用itemMarginBottom屬性，如下所示：

legend: {
    layout: 'vertical',
    itemMarginBottom:7,
    align: 'right',
    verticalAlign: 'top',
    itemStyle: {
        font: '9pt Raleway,Helvetica,sans-serif',
        color: '#A0A0A0'
    },
    itemHoverStyle: {
        color: '#FFF'
    },
    itemHiddenStyle: {
        color: '#444'
    }
}

Answer 2

你能檢查一下主版本嗎？ 這個例子： http : //jsfiddle.net/cMXyG/19/ .

對我來說它看起來不錯，請參閱：

• 外：

• 鉻：

可能由 lineWidth 的不同計算引起的小差異（~1px）。