编辑highcharts图例的样式(仅对某些字符串加粗)

时间:2012-08-21 08:46:37

标签: highcharts

引用此帖子How to wrap legend items in highcharts我使用

成功调整了我的图例宽度
legend: {
  itemStyle: {
    width: 90 // or whatever
},

但我需要检查一些条件,如果条件为真,我应该用粗体突出显示标签,所以我使用labelFormatter,但我发现在添加itemStyle选项后,我的html标签只能工作到回车......你可以在这里看到:http://jsfiddle.net/yDWh9/5/

我该如何解决这个问题?

谢谢

______编辑_______

这是由highcharts生成的代码:

<g class="highcharts-legend-item" zindex="1" transform="translate(8,18)">
   <text x="21" y="15" style="font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;font-size:12px;cursor:pointer;color:#3E576F;width:290;fill:#3E576F;" text-anchor="start" zindex="2">
      <tspan style="font-weight:bold" x="21">Lorem ipsum</tspan>
      <tspan dy="16" x="21">dolor sit amet</tspan>
   </text>
   <rect rx="2" ry="2" fill="#AA4643" x="0" y="4" width="16" height="12" stroke-width="0.000001" zindex="3" stroke="#AA4643"></rect>
</g>

你可以看到它打破了两个tspan中的字符串,只有第一个字符串有权重:粗体

1 个答案:

答案 0 :(得分:0)

尝试

legend: {
    useHTML: true,
    itemStyle: {
    width: 90 // or whatever
},

和系列:

series: [{
    name: '<b>Tokyo</b>',
    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
}, {
    name: 'New York',
    data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
}, {
    name: 'Berlin',
    data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
}, {
    name: '<b>London</b>',
    data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
}]