2013-04-09 23 views
8

Wydaje się, że podczas wyświetlania podpowiedzi na wykresie kołowym Highcharts 3.0 wydaje się mieć problem z dokładnością liczby zmiennoprzecinkowej. Udało mi się odtworzyć dokładny błąd za pomocą jednego z wykresów kołowych demonstracyjnych highcharts - Pie with Legend. Kliknij "Edytuj w JsFiddle", aby edytować javascript.Wykres kołowy wykresu high chart jest ignorowany przy ustawianiu wartości procentowej toolDip i ma problem z niedokładnością zmiennoprzecinkową.

Wewnątrz panelu javascript wyszukaj sekcję serii i danych. Przechowuj dane Firefoxa i IE i odrzuć resztę danych, abyśmy mogli skupić się na 2 plasterkach tortu. Obydwa uchwyty danych nie mają wartości procentowej, która może wynosić nawet 100, więc wykresy wyliczają dla nas wartości procentowe. Kliknij przycisk Uruchom u góry, mysz nad plasterkami, procenty są bardzo dokładne, z maksymalną liczbą miejsc po przecinku. Ale czekaj, spójrz na opcję javascript tooltip, highcharts wyraźnie ignoruje ustawienie "percentageDecimals: 1". To jest problem nr 1.

Teraz ręcznie edytować dane procentowe w następujący sposób: [ 'Firefox', 57.7], [IE, 42.3] więc sumują się dokładnie do 100,0. Ponownie naciśnij przycisk Uruchom, na etykietach przekrojów wyświetla się "Firefox: 57.0000000000001%" i "IE: 42,3%". Wygląda na to, że przeliczenie procentowe zostało wykonane niezależnie od tego, czy wartości procentowe wynoszą do 100, czy też nie, wprowadzając tutaj małą niedokładność punktu zmiennoprzecinkowego. To jest problem nr 2. Gdyby w tym przypadku działało zaokrąglanie "percentDecimals", kwestia ta mogła zostać ukryta.

Chciałbym wiedzieć: * Ktoś jeszcze widzi ten sam problem i ma jakieś obejście? * Czy w wynikach wyszukiwania mogą pojawić się odpowiedzi na te tematy i czy są znane błędy?

+0

Nie wiem, dlaczego istnieje "percentDecimals", ale oczywiście nie ma takiej opcji w Highcharts. Jeśli chodzi o niedokładność, spróbuj w JS obliczyć 0,1 + 0,2 i obejrzeć efekty. Co mogę poradzić, to usunąć pointFormat i użyć tylko tooltip.formatter. –

+1

Dzięki Paweł. Udało mi się użyć tooltip.formatter = function() { return this.point.name + ': ' + Highcharts.numberFormat (this.percentage, 1) + '%'; } –

+1

Możesz także użyć po prostu 'this.percentage.toFixed (1)' :) –

Odpowiedz

16

Odpowiedź na to pytanie na podstawie komentarza Billy Reverb za:

Wystarczy zastąpić to atrybuty:

tooltip: { 
    pointFormat: '{series.name}: <b>{point.percentage}%</b>', 
    percentageDecimals: 1 
} 

na to:

tooltip: { 
    formatter: function() { 
        return this.point.name + ': <b>' + Highcharts.numberFormat(this.percentage, 1) + '%</b>'; 
       } 
} 
14

Prostszym rozwiązaniem jest użycie

{point.percentage:.1f}% 

w ciągu pointFormat

+1

to działało dla mnie, ale co oznacza .1f? – Naeem

+0

Geniusz, właśnie tego szukałem! .1f oznacza 1 pływające miejsce. f oznacza pływak. – craig1231

2

dla mnie upvoted rozwiązanie nie działa:

tooltip: { 
    formatter: function() { 
        return this.point.name + ': <b>' + Highcharts.numberFormat(this.percentage, 1) + '%</b>'; 
       } 
} 

ale to zrobił:

this.percentage.toFixed(1) 
1

Zanim pójdziesz głowa-Desk-head-desk, starając sformatować procent.

Oto kilka sposobów, aby to zrobić:

  1. (Math.round(this.point.percentage*100)/100) + ' %'
  2. Highcharts.numberFormat(this.percentage, 1) + '%'
  3. this.percentage.toFixed(1)
  4. {point.percentage}% or {point.percentage:.1f}%

często używam nr 4 w etykiet i etykiet oraz gdy nie jest używany niestandardowa funkcja formatowania.