jqplot: Show Decimal Places

Fraser picture Fraser · Jan 9, 2013 · Viewed 12.5k times · Source

I'm using jqplot to show a bar chart with :

$.jqplot.config.enablePlugins = true;
      var s1 = [8916.55, 1860.45, 60.33];
      var ticks = ['Total Cost', 'Total Chargeable', 'Total Invoiced'];

      plot1 = $.jqplot('chart_div', [s1], {
          // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
          seriesColors: ["#009DDE", "lightgreen", "green"],
          animate: !$.jqplot.use_excanvas,
          seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            pointLabels: { show: true },
            rendererOptions:{ 
              varyBarColor : true,
              animation: {
                speed: 1000
              }
            }
          },
          axes: {
              xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                ticks: ticks
              },
              yaxis: {
                tickOptions:{
                  formatString: "\u00A3\%'d"
                }
              }
          },
          highlighter: { 
            show: false 
          },

      });

      $('#chart1').bind('jqplotDataClick', 
          function (ev, seriesIndex, pointIndex, data) {
              $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
          }
      );

It is working fine, however, it is stripping out the decimal places on the bar labels and rounding the values to the nearest int. How can I stop this and show the results to the correct 2 decimal places? I tried formatString: "\u00A3\%'d%.2f" but it would appear to be formatting the string before it gets here

I am using jqplot.barRenderer.min.js, jqplot.categoryAxisRenderer.min.js, jqplot.pointLabels.min.js

Answer

AnthonyLeGovic picture AnthonyLeGovic · Jan 9, 2013

Try using formatString: "%#.2f"