2014-04-27 2 views
0

У меня есть highchart pie chart, которые имеют этикетки со следующим форматом:Как отредактировать html ярлыка высокой четкости?

{point.name} <div class="pct">{point.percentage:.2f}%</div> 

Но несчастливо, то ДИВ удаляется, когда метки будут загружены.

Существует какой-либо способ применения класса, поэтому проценты имеют одинаковое соответствие независимо от стиля ярлыка?

Вот jsfiddle, где вы можете попробовать: http://jsfiddle.net/69x7a/5/

HTML

<div id="container" style="width: 100%; height: 400px;"></div> 

CSS

.pct { 
    color: blue; 
    font-size: 8px; 
} 

JS

$(function() { 
    $('#container').highcharts({ 
     plotOptions: { 
      pie: { 
       cursor: 'pointer', 
       dataLabels: { 
        enabled: true, 
        format: '{point.name} <div class="pct">{point.percentage:.2f}%</div>' 
       } 
      } 
     }, 
     series: [{ 
      type: 'pie', 
      data: [ 
       ['Firefox', 45.0], 
       ['IE',  26.8], 
       { 
        name: 'Chrome', 
        y: 12.8, 
        dataLabels: { 
         style: { 
          color: "#ff0000", 
          fontFamily: 'serif', 
          fontSize: '17px' 
         } 
        } 
       }, 
       ['Safari', 8.5], 
       ['Opera',  6.2], 
       ['Others', 0.7] 
      ] 
     }] 
    }); 
}); 
+0

http://jsfiddle.net/6GKCJ/2/ –

ответ

2

Кажется класс удален, но вы можете сделать это:

   format: '<b >{point.name}</b>:<span style="color: blue;font-size: 8px;"> {point.percentage:.1f}%</span> 
Смежные вопросы