Add a function to allow the min/max values to be formated

c3js · May 20, 2016 · 8223963 · 8223963
1 parent 223404a
commit 8223963
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 2 deletions.
diff --git a/htdocs/samples/chart_gauge.html b/htdocs/samples/chart_gauge.html
@@ -30,6 +30,9 @@
           },
 //          min: 0, // 0 is default, //can handle negative min e.g. vacuum / voltage / current flow / rate of change
 //          max: 100, // 100 is default
+//          minmaxformat: function (value, isMax) {
+//              return value + '%';
+//          },
 //          units: ' %',
 //          width: 39 // for adjusting arc thickness
         },

diff --git a/src/arc.js b/src/arc.js
@@ -135,6 +135,13 @@ c3_chart_internal_fn.textForArcLabel = function (d) {
     return format ? format(value, ratio, id) : $$.defaultArcValueFormat(value, ratio);
 };
 
+c3_chart_internal_fn.textForGaugeMinMax = function (value, isMax) {
+    var $$ = this,
+        format = $$.getGaugeMinMaxFormat();
+
+    return format ? format(value, isMax) : value;
+};
+
 c3_chart_internal_fn.expandArc = function (targetIds) {
     var $$ = this, interval;
 
@@ -234,6 +241,11 @@ c3_chart_internal_fn.getArcLabelFormat = function () {
     return format;
 };
 
+c3_chart_internal_fn.getGaugeMinMaxFormat = function () {
+    var $$ = this, config = $$.config;
+    return config.gauge_minmaxformat;
+};
+
 c3_chart_internal_fn.getArcTitle = function () {
     var $$ = this;
     return $$.hasType('donut') ? $$.config.donut_title : "";
@@ -405,11 +417,11 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
         $$.arcs.select('.' + CLASS.chartArcsGaugeMin)
             .attr("dx", -1 * ($$.innerRadius + (($$.radius - $$.innerRadius) / (config.gauge_fullCircle ? 1 : 2))) + "px")
             .attr("dy", "1.2em")
-            .text(config.gauge_label_show ? config.gauge_min : '');
+            .text(config.gauge_label_show ? $$.textForGaugeMinMax(config.gauge_min, false) : '');
         $$.arcs.select('.' + CLASS.chartArcsGaugeMax)
             .attr("dx", $$.innerRadius + (($$.radius - $$.innerRadius) / (config.gauge_fullCircle ? 1 : 2)) + "px")
             .attr("dy", "1.2em")
-            .text(config.gauge_label_show ? config.gauge_max : '');
+            .text(config.gauge_label_show ? $$.textForGaugeMinMax(config.gauge_max, true) : '');
     }
 };
 c3_chart_internal_fn.initGauge = function () {

diff --git a/src/config.js b/src/config.js
@@ -184,6 +184,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
         gauge_min: 0,
         gauge_max: 100,
         gauge_startingAngle: -1 * Math.PI/2,
+        gauge_minmaxformat: undefined,
         gauge_units: undefined,
         gauge_width: undefined,
         gauge_expand: {},