JQPlot - 基於區域的格式刻度

Question

如何格式化jqplot中的刻度以處理和之間的變化。和「」取決於我所在的地區。

例如。

• 歐洲 - 1.000,00
• 美國 - 1,000.00
• 其他1 000,00

我的例子jqplot初始化貌似....

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' 
       } 
      }, 
      } 
     }); 

我看着通過文檔，但我不知道我需要尋找什麼關鍵字...任何幫助，將不勝感激

Answer 1

基於this，您可以使用格式字符串類似如下：

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

該格式字符串，值一起，最終作爲參數到到$.jqplot.sprintf通話。然後，您可以設置分隔如下：

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

所以這個代碼：

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)); 

會產生這樣的：

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

不過，看到歐洲一個怎麼是一樣的我們？當這些分隔符設置被更改時，會導致字符串替換，因此歐洲人爲什麼會這樣結束：用句點替換逗號，然後用逗號替換句點，可以讓您恢復原始字符串。

正因爲如此，您需要提供一個自定義的刻度格式化方法，所以你可以申請在即時的設置，然後做一個字符串替換：

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; 
} 

這意味着你還需要一些方便的機制來建立用戶的語言環境和正確的分隔符字符來使用。我以這種方式保存並恢復了字符thousandsSeparator和decimalMark，只是爲了確保以這種方式設置它們不會在其他地方引起無意的問題。

另請注意，我的解決方案假定#和_字符不會處於您想格式化的值中。如果不是這樣，請將FormatTick方法中的分隔符修改爲更適合的方法。