fixing error

elastic · Nov 5, 2016 · 43d3930 · 43d3930
1 parent c25722b
commit 43d3930
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 41 deletions.
diff --git a/src/ui/public/vislib/lib/axis/axis.js b/src/ui/public/vislib/lib/axis/axis.js
@@ -198,30 +198,11 @@ export default function AxisFactory(Private) {
     }
 
     getLength(el, n) {
-      const widthSpacing = 43;
       if (this.axisConfig.isHorizontal()) {
-        return $(el).parent().width() / n - widthSpacing;
+        return $(el).parent().width() / n;
+      } else {
+        return $(el).parent().height() / n;
       }
-      return $(el).parent().height() / n;
-    }
-
-    updateXaxisHeight() {
-      const el = this.axisConfig.get('rootEl');
-      const position = this.axisConfig.get('position');
-      const selection = d3.select(el).selectAll('.vis-wrapper');
-
-      selection.each(function () {
-        const visEl = d3.select(this);
-
-        if (visEl.select('.inner-spacer-block').node() === null) {
-          visEl.selectAll('.y-axis-spacer-block')
-          .append('div')
-          .attr('class', 'inner-spacer-block');
-        }
-
-        const height = visEl.select(`.axis-wrapper-${position}`).style('height');
-        visEl.selectAll(`.y-axis-spacer-block-${position} .inner-spacer-block`).style('height', height);
-      });
     }
 
     adjustSize() {
@@ -249,7 +230,6 @@ export default function AxisFactory(Private) {
 
         if (config.isHorizontal()) {
           selection.attr('height', length);
-          self.updateXaxisHeight();
           if (position === 'top') {
             selection.select('g')
             .attr('transform', `translate(0, ${length - parseInt(style.lineWidth)})`);

diff --git a/src/ui/public/vislib/lib/handler.js b/src/ui/public/vislib/lib/handler.js
@@ -48,13 +48,13 @@ export default function HandlerBaseClass(Private) {
       ], Boolean);
 
       if (this.categoryAxes.length && this.categoryAxes[0].axisConfig.isHorizontal()) {
-        this.renderArray = this.renderArray
-          .concat(this.categoryAxes)
-          .concat(this.valueAxes);
-      } else {
         this.renderArray = this.renderArray
           .concat(this.valueAxes)
           .concat(this.categoryAxes);
+      } else {
+        this.renderArray = this.renderArray
+          .concat(this.categoryAxes)
+          .concat(this.valueAxes);
       }
 
       // memoize so that the same function is returned every time,

diff --git a/src/ui/public/vislib/lib/layout/layout.js b/src/ui/public/vislib/lib/layout/layout.js
@@ -1,10 +1,12 @@
 import d3 from 'd3';
 import _ from 'lodash';
+import $ from 'jquery';
 import VislibLibLayoutLayoutTypesProvider from 'ui/vislib/lib/layout/layout_types';
+import AxisProvider from 'ui/vislib/lib/axis';
 export default function LayoutFactory(Private) {
 
   const layoutType = Private(VislibLibLayoutLayoutTypesProvider);
-
+  const Axis = Private(AxisProvider);
   /**
    * Builds the visualization DOM layout
    *
@@ -39,6 +41,10 @@ export default function LayoutFactory(Private) {
     render() {
       this.removeAll(this.el);
       this.createLayout(this.layoutType);
+      // update y-axis-spacer height based on precalculated horizontal axis heights
+      if (this.opts.get('type') === 'point_series') {
+        this.updateCategoryAxisSize();
+      }
     };
 
     /**
@@ -50,13 +56,39 @@ export default function LayoutFactory(Private) {
      * @returns {*} Creates the visualization layout
      */
     createLayout(arr) {
-      const self = this;
-
-      return _.each(arr, function (obj) {
-        self.layout(obj);
+      return _.each(arr, (obj) => {
+        this.layout(obj);
       });
     };
 
+    updateCategoryAxisSize() {
+      const visConfig = this.opts;
+      const axisConfig = visConfig.get('categoryAxes[0]');
+      const axis = new Axis(visConfig, axisConfig);
+      const position = axis.axisConfig.get('position');
+
+      const el = $(this.el).find(`.axis-wrapper-${position}`);
+      const length = axis.axisConfig.isHorizontal() ? $(this.el).width() : $(this.el).height();
+
+      // render svg and get the width of the bounding box
+      const svg = d3.select('body')
+        .append('svg')
+        .attr('style', 'position:absolute; top:-10000; left:-10000');
+      const {width, height} = svg.append('g')
+        .call(axis.getAxis(length)).node().getBBox();
+      svg.remove();
+
+      if (axis.axisConfig.isHorizontal()) {
+        const titleHeight = 15;
+        const spacerNodes = $(this.el).find(`.y-axis-spacer-block-${position}`);
+        el.find('.x-axis-div-wrapper').height(`${height}px`);
+        spacerNodes.height(el.height() + titleHeight);
+      } else {
+        el.find('.y-axis-div-wrapper').width(`${width}px`);
+      }
+    };
+
+
     /**
      * Appends a DOM element based on the object keys
      * check to see if reference to DOM element is string but not class selector

diff --git a/src/ui/public/vislib/lib/layout/splits/column_chart/y_axis_split.js b/src/ui/public/vislib/lib/layout/splits/column_chart/y_axis_split.js
@@ -1,6 +1,4 @@
 import d3 from 'd3';
-import _ from 'lodash';
-
 define(function () {
   return function YAxisSplitFactory() {
 
@@ -11,7 +9,7 @@ define(function () {
      */
 
     // render and get bounding box width
-    return function (selection, parent, opts) {
+    return function (selection) {
 
       selection.each(function () {
         const div = d3.select(this);

diff --git a/src/ui/public/vislib/lib/types/point_series.js b/src/ui/public/vislib/lib/types/point_series.js
@@ -69,18 +69,17 @@ export default function ColumnHandler(Private) {
         config.chart = {
           type: 'point_series',
           series: _.map(series, (seri) => {
-            return _.defaults({
+            return {
               show: true,
               type: cfg.type || 'line',
               mode: cfg.mode || 'normal',
               interpolate: cfg.interpolate,
               smoothLines: cfg.smoothLines,
               drawLinesBetweenPoints: cfg.drawLinesBetweenPoints,
               showCircles: cfg.showCircles,
-              radiusRatio: cfg.radiusRatio
-            }, {
+              radiusRatio: cfg.radiusRatio,
               data: seri
-            });
+            };
           })
         };
       }

diff --git a/src/ui/public/vislib/styles/_layout.less b/src/ui/public/vislib/styles/_layout.less
@@ -12,7 +12,7 @@
   min-height: 0;
   min-width: 0;
   overflow: hidden;
-  padding: 10px;
+  padding: 10px 0;
 }
 
 .vis-wrapper svg {
@@ -162,7 +162,7 @@
 }
 
 .x-axis-title {
-  min-height: 1px;
+  min-height: 0px;
   max-height: 15px;
   min-width: 20px;
   overflow: hidden;