2013-01-31 9 views
5

W jaki sposób sformatować ticks w moim jqplot, aby obsłużyć zmianę pomiędzy i. i "" w zależności od regionu, w którym się znajduję.JQPlot - tagi formatowania oparte na regionie

Na przykład.

  • Europejska - 1.000,00
  • US - 1.000,00
  • Pozostałe 1 000,00

Mój przykład inicjalizacji jqplot wygląda ....

plot3 = $.jqplot('saturationChart', lineArray, 
     { 
      title:m_Language.saturationChartName, 
      series:lineColor, 
      legend:{show:true, location:'se'}, 
      // You can specify options for all axes on the plot at once with 
      // the axesDefaults object. Here, we're using a canvas renderer 
      // to draw the axis label which allows rotated text. 
      axes:{ 
      xaxis:{ 
//   label:'Minutes', 
       renderer: $.jqplot.LogAxisRenderer, 
       tickDistribution:'power', 
       labelRenderer: $.jqplot.CanvasAxisLabelRenderer, 
       labelOptions: { 
       //fontSize: '12pt' 
       }, 
      }, 
      yaxis:{ 
//   label:'Megaohms', 
       renderer: $.jqplot.LogAxisRenderer, 
       tickDistribution:'power', 
       labelRenderer: $.jqplot.CanvasAxisLabelRenderer, 
       labelOptions: { 
       //fontSize: '12pt' 
       } 
      }, 
      } 
     }); 

Spojrzałem za pośrednictwem dokumentacji, ale nie jestem pewien, jakie słowa kluczowe muszę szukać ... każda pomoc byłaby doceniana

Odpowiedz

12

podstawie this, można użyć ciągu formatu jak następuje:

yaxis: { 
    tickOptions: { formatString: "%'.2f" }, 
    min : 0 
} 

To format string, wraz z wartością, skończyć jako argumentów w wywołaniu $.jqplot.sprintf. Następnie można ustawić separatory następująco:

$.jqplot.sprintf.thousandsSeparator = ','; 
$.jqplot.sprintf.decimalMark = '.'; 

Więc ten kod:

var value = 10000; 
$.jqplot.sprintf.thousandsSeparator = '.'; 
$.jqplot.sprintf.decimalMark = ','; 
console.log($.jqplot.sprintf("European %'.2f", value)); 

$.jqplot.sprintf.thousandsSeparator = ' '; 
$.jqplot.sprintf.decimalMark = ','; 
console.log($.jqplot.sprintf("Other %'.2f", value)); 

$.jqplot.sprintf.thousandsSeparator = ','; 
$.jqplot.sprintf.decimalMark = '.'; 
console.log($.jqplot.sprintf("US %'.2f", value)); 

przyniesie to:

European 10,000.00 
Other 10 000,00 
US 10,000.00 

jednak zobaczyć, jak Europejski nich jest taka sama jak NAS? Kiedy te ustawienia separatora zostaną zmienione, spowoduje to zastąpienie ciągu znaków, dlatego też europejski kończy się tak, jak to robi: zastępując przecinki kropkami, a następnie kropki przecinkami przekazują oryginalny ciąg znaków.

powodu, że trzeba byłoby dostarczenie sposobu formatowania niestandardowego kleszcz więc można stosować te ustawienia w locie, a następnie wykonaj ciąg wymienić:

yaxis: { 
    tickOptions: { 
     tickOptions: { formatString: "%'.2f" }, 
     formatter: function(format, value){ 
      return FormatTick(format, value); 
     } 
    } 
} 

.... 

function FormatTick(format, value) { 
    var prevThousandsSeparator = $.jqplot.sprintf.thousandsSeparator; 
    var prevDecimalMark = $.jqplot.sprintf.decimalMark; 

    $.jqplot.sprintf.thousandsSeparator = '#'; 
    $.jqplot.sprintf.decimalMark = '_'; 

    var formattedValue = $.jqplot.sprintf(format, value); 
    formattedValue = formattedValue.replace($.jqplot.sprintf.decimalMark, Language.DecimalMark) 
     .replace($.jqplot.sprintf.thousandsSeparator, Language.ThousandsSeparator); 

    $.jqplot.sprintf.thousandsSeparator = prevThousandsSeparator; 
    $.jqplot.sprintf.decimalMark = prevDecimalMark; 

    return formattedValue; 
} 

Oznacza to, że trzeba także niektóre wygodny mechanizm do ustalenia zarówno ustawień narodowych użytkownika, jak i właściwych znaków separatora do użycia. W ten sposób zapisuję i przywracam znaki thousandsSeparator i, aby upewnić się, że ustawienie ich w ten sposób nie spowoduje nieumyślnych problemów w innych miejscach.

Należy również zauważyć, że moje rozwiązanie zakłada, że ​​znaki # i _ nie będą miały wartości, którą chcesz sformatować. Jeśli tak nie jest, zmodyfikuj separatory w metodzie FormatTick na coś bardziej odpowiedniego.

+0

Uczenie się, że mogę ustawić $ .jqplot.sprintf.thousandsSeparator i $ .jqplot.sprintf.decimalMark rozwiązałem dla mojej strony niemieckiej. Wielkie dzięki! – alfonx