Repository: incubator-zeppelin Updated Branches: refs/heads/master b5e2e62f2 -> 71c1af84a
Fix Yaxis cut Number This PR fixes https://issues.apache.org/jira/browse/ZEPPELIN-243 By adding a TickFormat to yAxis. This is using a slightly custom SI-Format: * k - kilo, 10³ * M - mega, 10ⶠ* B - giga, 10⹠(instead of G) * T - tera, 10¹² * P - peta, 10¹ⵠ* E - exa, 10¹⸠* Z - zetta, 10²¹ * Y - yotta, 10²ⴠ Author: Damien CORNEAU <[email protected]> Closes #507 from corneadoug/fix/ZEPPELIN-243 and squashes the following commits: 16adde7 [Damien CORNEAU] Add Yaxis tickFormat Project: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/commit/71c1af84 Tree: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/tree/71c1af84 Diff: http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/diff/71c1af84 Branch: refs/heads/master Commit: 71c1af84a1c4f285842dfd5c85fc99ffc4bfca26 Parents: b5e2e62 Author: Damien CORNEAU <[email protected]> Authored: Thu Dec 3 15:19:09 2015 +0900 Committer: Damien CORNEAU <[email protected]> Committed: Tue Dec 8 12:35:15 2015 +0900 ---------------------------------------------------------------------- .../notebook/paragraph/paragraph.controller.js | 52 +++++++++++--------- 1 file changed, 30 insertions(+), 22 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/71c1af84/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js ---------------------------------------------------------------------- diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js index e8aa6ed..f73db75 100644 --- a/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js +++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js @@ -990,6 +990,31 @@ angular.module('zeppelinWebApp') }; + var integerFormatter = d3.format(',.1d'); + + var customAbbrevFormatter = function(x) { + var s = d3.format('.3s')(x); + switch (s[s.length - 1]) { + case 'G': return s.slice(0, -1) + 'B'; + } + return s; + }; + + var xAxisTickFormat = function(d, xLabels) { + if (xLabels[d] && (isNaN(parseFloat(xLabels[d])) || !isFinite(xLabels[d]))) { // to handle string type xlabel + return xLabels[d]; + } else { + return d; + } + }; + + var yAxisTickFormat = function(d) { + if(d >= Math.pow(10,6)){ + return customAbbrevFormatter(d); + } + return integerFormatter(d); + }; + var setD3Chart = function(type, data, refresh) { if (!$scope.chart[type]) { var chart = nv.models[type](); @@ -1007,21 +1032,8 @@ angular.module('zeppelinWebApp') yLabels = scatterData.yLabels; d3g = scatterData.d3g; - $scope.chart[type].xAxis.tickFormat(function(d) { - if (xLabels[d] && (isNaN(parseFloat(xLabels[d])) || !isFinite(xLabels[d]))) { - return xLabels[d]; - } else { - return d; - } - }); - - $scope.chart[type].yAxis.tickFormat(function(d) { - if (yLabels[d] && (isNaN(parseFloat(yLabels[d])) || !isFinite(yLabels[d]))) { - return yLabels[d]; - } else { - return d; - } - }); + $scope.chart[type].xAxis.tickFormat(function(d) {return xAxisTickFormat(d, xLabels);}); + $scope.chart[type].yAxis.tickFormat(function(d) {return xAxisTickFormat(d, yLabels);}); // configure how the tooltip looks. $scope.chart[type].tooltipContent(function(key, x, y, data) { @@ -1058,17 +1070,13 @@ angular.module('zeppelinWebApp') } else if (type === 'multiBarChart') { d3g = pivotDataToD3ChartFormat(p, true, false, type).d3g; $scope.chart[type].yAxis.axisLabelDistance(50); + $scope.chart[type].yAxis.tickFormat(function(d) {return yAxisTickFormat(d);}); } else if (type === 'lineChart' || type === 'stackedAreaChart' || type === 'lineWithFocusChart') { var pivotdata = pivotDataToD3ChartFormat(p, false, true); xLabels = pivotdata.xLabels; d3g = pivotdata.d3g; - $scope.chart[type].xAxis.tickFormat(function(d) { - if (xLabels[d] && (isNaN(parseFloat(xLabels[d])) || !isFinite(xLabels[d]))) { // to handle string type xlabel - return xLabels[d]; - } else { - return d; - } - }); + $scope.chart[type].xAxis.tickFormat(function(d) {return xAxisTickFormat(d, xLabels);}); + $scope.chart[type].yAxis.tickFormat(function(d) {return yAxisTickFormat(d);}); $scope.chart[type].yAxis.axisLabelDistance(50); if ($scope.chart[type].useInteractiveGuideline) { // lineWithFocusChart hasn't got useInteractiveGuideline $scope.chart[type].useInteractiveGuideline(true); // for better UX and performance issue. (https://github.com/novus/nvd3/issues/691)
