Geek asks and answers

JQPlot - region-based tick format

How can I format ticks in my jqplot to handle the change between, and. and "" depending on the region in which I am located.

For instance.

  • European - 1.000,00
  • US - 1,000.00
  • Other 1,000.00

My jqplot initialization example looks like ...

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

I looked through the documentation, but I'm not sure what keywords I need to look for ... any help would be appreciated

+5
source share
1 answer

Based on this , you can use a format string such as:

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

This format string along with the value ends with the arguments in the call $.jqplot.sprintf. Then you can set the delimiters as follows:

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

So this code:

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

Let's do this:

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 - .

+12

More articles:


All Articles