@antv/g2 - npm Package Compare versions

Comparing version 3.0.0-rc5.7 to 3.0.0-rc5.8

package.json

 {
   "name": "@antv/g2",
-  "version": "3.0.0-rc5.7",
+  "version": "3.0.0-rc5.8",
   "description": "the Grammar of Graphics in Javascript",
@@ -5,0 +5,0 @@ "main": "build/g2.js",

src/animate/animate.js

@@ -255,3 +255,3 @@ /**
   if (this[geomType] && this[geomType].cfg && this[geomType].cfg[animationType]) {
-    return Util.defaultsDeep(this[geomType].cfg[animationType], defaultCfg);
+    return Util.deepMix({}, defaultCfg, this[geomType].cfg[animationType]);
   }
@@ -258,0 +258,0 @@ return defaultCfg;

src/animate/index.js

@@ -63,3 +63,3 @@ /**
   if (animateCfg && animateCfg[animationType]) {
-    return Util.defaultsDeep(animateCfg[animationType], defaultCfg);
+    return Util.deepMix({}, defaultCfg, animateCfg[animationType]);
   }
@@ -66,0 +66,0 @@ return defaultCfg;

src/chart/chart.js

@@ -405,7 +405,11 @@ /**
     });
-    const legendController = this.get('legendController');
+
     const tooltipController = this.get('tooltipController');
+    tooltipController && tooltipController.clear();
 
-    legendController && legendController.clear();
-    tooltipController && tooltipController.clear();
+    if (!this.get('keepLegend')) {
+      const legendController = this.get('legendController');
+      legendController && legendController.clear();
+    }
+
     super.clearInner();
@@ -420,4 +424,5 @@ }
     super.paint();
-    this._renderLegends(); // 渲染图例
+    !this.get('keepLegend') && this._renderLegends(); // 渲染图例
     this._renderTooltips(); // 渲染 tooltip
+    this.set('keepLegend', false);
   }
@@ -424,0 +429,0 @@

src/chart/controller/axis.js

@@ -253,3 +253,3 @@ /**
     }
-    cfg = Util.merge(true, {}, Global.axis[position], cfg, options[field]);
+    cfg = Util.deepMix({}, Global.axis[position], cfg, options[field]);
     cfg.ticks = scale.getTicks();
@@ -256,0 +256,0 @@

src/chart/controller/guide.js

@@ -26,6 +26,6 @@ /**
       let type = option.type;
-      const config = Util.defaultsDeep(option, Global.guide[type], {
+      const config = Util.deepMix({
         xScales,
         yScales
-      });
+      }, Global.guide[type], option);
       type = Util.upperFirst(type);
@@ -40,4 +40,5 @@ const guide = new Guide[type](config);
   line(cfg = {}) {
-    cfg.type = 'line';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'line'
+    }, cfg));
     return this;
@@ -47,4 +48,5 @@ }
   arc(cfg = {}) {
-    cfg.type = 'arc';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'arc'
+    }, cfg));
     return this;
@@ -54,4 +56,5 @@ }
   text(cfg = {}) {
-    cfg.type = 'text';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'text'
+    }, cfg));
     return this;
@@ -61,14 +64,20 @@ }
   image(cfg = {}) {
-    cfg.type = 'image';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'image'
+    }, cfg));
+    return this;
   }
 
   region(cfg = {}) {
-    cfg.type = 'region';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'region'
+    }, cfg));
+    return this;
   }
 
   html(cfg = {}) {
-    cfg.type = 'html';
-    this.options.push(cfg);
+    this.options.push(Util.mix({
+      type: 'html'
+    }, cfg));
+    return this;
   }
@@ -75,0 +84,0 @@

src/chart/controller/legend.js

@@ -118,2 +118,3 @@ const Util = require('../../util');
         }
+        chart.set('keepLegend', true); // 图例不重新渲染
         chart.repaint();
@@ -365,9 +366,9 @@ }
 
-    const legendCfg = Util.defaultsDeep({
-      maxLength,
-      items
-    }, legendOptions[field] || legendOptions, Global.legend[position], {
+    const legendCfg = Util.deepMix({
       title: {
         text: scale.alias || scale.field
       }
+    }, Global.legend[position], legendOptions[field] || legendOptions, {
+      maxLength,
+      items
     });
@@ -427,9 +428,9 @@
     const options = self.options;
-    const legendCfg = Util.defaultsDeep({
-      items,
-      attr
-    }, options[field] || options, Global.legend[position], {
+    const legendCfg = Util.deepMix({
       title: {
         text: scale.alias || scale.field
       }
+    }, Global.legend[position], options[field] || options, {
+      items,
+      attr
     });
@@ -515,6 +516,6 @@
 
-    const legendCfg = Util.defaultsDeep({
+    const legendCfg = Util.deepMix({}, Global.legend[position], legendOptions, {
       maxLength,
       items
-    }, legendOptions, Global.legend[position]);
+    });
 
@@ -521,0 +522,0 @@ const legend = container.addGroup(Legend.Category, legendCfg);

src/chart/controller/scale.js

@@ -16,18 +16,2 @@ /**
 
-function getRange(values) {
-  if (Util.isArray(values[0])) {
-    let tmp = [];
-    for (let i = 0; i < values.length; i++) {
-      tmp = tmp.concat(values[i]);
-    }
-    values = tmp;
-  }
-  const max = Math.max.apply(null, values);
-  const min = Math.min.apply(null, values);
-  return {
-    min,
-    max
-  };
-}
-
 class ScaleController {
@@ -78,3 +62,3 @@ constructor(cfg) {
     if (!Scale.isCategory(type) && type !== 'time') {
-      const range = getRange(values);
+      const range = Util.Array.getRange(values);
       cfg.min = range.min;
@@ -88,10 +72,2 @@ cfg.max = range.max;
     }
-    /* if (!Scale.isCategory(type) && type !== 'time' && isIntervalY && (!cfg.min || cfg.min > 0)) {
-      var defs = this.defs;
-      var newDef = {};
-      newDef[field] = {
-        min: 0
-      };
-      this.defs = Util.mix(true, newDef, defs);
-    }*/
     return cfg;
@@ -98,0 +74,0 @@ }

src/chart/controller/tooltip.js

@@ -259,9 +259,12 @@ /**
     const chart = self.chart;
+    const canvas = self._getCanvas();
     const defaultCfg = self._getDefaultTooltipCfg();
-    const options = self.options;
-    Util.defaultsDeep(options, defaultCfg, {
+    let options = self.options;
+    options = Util.deepMix({
       plotRange: chart.get('plotRange'),
-      capture: false
-    });
-
+      capture: false,
+      canvas,
+      frontPlot: chart.get('frontPlot'),
+      backPlot: chart.get('backPlot')
+    }, defaultCfg, options);
     if (options.crosshairs && options.crosshairs.type === 'rect') {
@@ -276,5 +279,3 @@ options.zIndex = 0; // toolip 背景框不可遮盖住 geom，防止用户配置了 crosshairs
 
-    const canvas = self._getCanvas();
-    const tooltip = canvas.addGroup(Tooltip, options);
-    canvas.sort();
+    const tooltip = new Tooltip(options);
     self.tooltip = tooltip;
@@ -404,3 +405,3 @@
     const tooltip = this.tooltip;
-    tooltip && tooltip.remove();
+    tooltip && tooltip.destroy();
     this.tooltip = null;
@@ -407,0 +408,0 @@ this.prePoint = null;

src/component/axis/base.js

@@ -9,2 +9,3 @@ /**
 const Grid = require('./grid');
+const Global = require('../../global');
 
@@ -79,22 +80,21 @@ class Base extends Group {
       fill: '#ccc',
-      textBaseline: 'middle'
+      textBaseline: 'middle',
+      fontFamily: Global.fontFamily
     };
     if (title) {
-      Util.defaultsDeep(title, {
+      this.setSilent('title', Util.deepMix({
         autoRotate: true,
         textStyle,
         offset: 48
-      });
-      this.setSilent('title', title);
+      }, title));
     }
     if (label) {
-      Util.defaultsDeep(label, {
+      this.setSilent('label', Util.deepMix({
         autoRotate: true,
         textStyle,
         offset: 10
-      });
-      this.setSilent('label', label);
+      }, label));
     }
     if (grid) {
-      Util.defaultsDeep(grid, {
+      this.setSilent('grid', Util.deepMix({
         lineStyle: {
@@ -104,4 +104,3 @@ lineWidth: 1,
         }
-      });
-      this.setSilent('grid', grid);
+      }, grid));
     }
@@ -108,0 +107,0 @@ }

src/component/guide/base.js

@@ -31,3 +31,3 @@ /**
     const defaultCfg = this.getDefaultCfg();
-    Util.defaultsDeep(cfg, defaultCfg);
+    cfg = Util.deepMix({}, defaultCfg, cfg);
     Util.mix(this, cfg);
@@ -34,0 +34,0 @@ }

src/component/guide/html.js

@@ -74,4 +74,4 @@ /**
     const alignY = self.alignY;
-    const domWidth = DomUtil.getWidth(childDom);
-    const domHeight = DomUtil.getHeight(childDom);
+    const domWidth = DomUtil.getOuterWidth(childDom);
+    const domHeight = DomUtil.getOuterHeight(childDom);
 
@@ -78,0 +78,0 @@ const position = {

src/component/guide/line.js

@@ -18,3 +18,2 @@ /**
       type: 'line',
-      // TODO 需要调整
       zIndex: 15,
@@ -21,0 +20,0 @@ /**

src/component/guide/text.js

@@ -37,3 +37,2 @@ /**
         fontWeight: 500,
-        fontFamily: 'sans-serif',
         textAlign: 'center'
@@ -40,0 +39,0 @@ },

src/component/label/labels.js

@@ -130,4 +130,4 @@ /**
     let left = cfg.x;
-    const width = DomUtil.getWidth(htmlDom);
-    const height = DomUtil.getHeight(htmlDom);
+    const width = DomUtil.getOuterWidth(htmlDom);
+    const height = DomUtil.getOuterHeight(htmlDom);
 
@@ -134,0 +134,0 @@ top = top - height / 2;

src/component/legend/base.js

@@ -6,2 +6,3 @@ /**
 const Util = require('../../util');
+const Global = require('../../global');
 const { Group } = require('@antv/g');
@@ -59,3 +60,4 @@
           fill: '#333', // 默认样式
-          textBaseline: 'middle'
+          textBaseline: 'middle',
+          fontFamily: Global.fontFamily
         }, title)
@@ -62,0 +64,0 @@ });

src/component/legend/category.js

@@ -137,3 +137,4 @@ /**
         textAlign: 'start',
-        textBaseline: 'middle'
+        textBaseline: 'middle',
+        fontFamily: Global.fontFamily
       },
@@ -271,4 +272,4 @@ /**
       const checkColor = this.get('textStyle').fill;
-      let markerItem = findShapeByName(clickedItem, 'legend-marker');
-      let textItem = findShapeByName(clickedItem, 'legend-text');
+      let markerItem;
+      let textItem;
       if (mode === 'single') {
@@ -278,6 +279,6 @@ const itemsGroup = this.get('itemsGroup');
         Util.each(children, child => {
+          markerItem = findShapeByName(child, 'legend-marker');
+          textItem = findShapeByName(child, 'legend-text');
           if (child !== clickedItem) {
             child.set('checked', false);
-            markerItem = findShapeByName(child, 'legend-marker');
-            textItem = findShapeByName(child, 'legend-text');
             if (markerItem.attr('fill')) {
@@ -298,6 +299,8 @@ markerItem.attr('fill', unCheckColor);
             textItem.attr('fill', checkColor);
-            clickedItem.set('checked', true);
+            child.set('checked', true);
           }
         });
       } else {
+        markerItem = findShapeByName(clickedItem, 'legend-marker');
+        textItem = findShapeByName(clickedItem, 'legend-text');
         if (markerItem.attr('fill')) {
@@ -408,3 +411,4 @@ markerItem.attr('fill', checked ? unCheckColor : item.marker.fill);
         }
-
+        // update checked status
+        clickedItem.checked = (mode === 'single') ? true : !(clickedItem.checked);
         const domClass = parentDom.className;
@@ -420,2 +424,5 @@ const originColor = parentDom.getAttribute('data-color');
               child.style.color = unCheckedColor;
+
+              const childItem = findItem(items, child.getAttribute('data-value'));
+              childItem.checked = false;
             } else {
@@ -460,3 +467,3 @@ if (textDom) {
           currentTarget: parentDom,
-          checked: (mode === 'single') ? true : !clickedItem.checked
+          checked: (mode === 'single') ? true : clickedItem.checked
         });
@@ -738,3 +745,3 @@ };
     if (this.get('useHtml')) {
-      return DomUtil.getWidth(this.get('legendWrapper'));
+      return DomUtil.getOuterWidth(this.get('legendWrapper'));
     }
@@ -746,3 +753,3 @@ return super.getWidth();
     if (this.get('useHtml')) {
-      return DomUtil.getHeight(this.get('legendWrapper'));
+      return DomUtil.getOuterHeight(this.get('legendWrapper'));
     }
@@ -749,0 +756,0 @@

src/component/legend/continuous.js

@@ -6,2 +6,3 @@ /**
 const Util = require('../../util');
+const Global = require('../../global');
 const Base = require('./base');
@@ -55,3 +56,4 @@ const { Event, Group } = require('@antv/g');
         textAlign: 'center',
-        textBaseline: 'middle'
+        textBaseline: 'middle',
+        fontFamily: Global.fontFamily
       },
@@ -58,0 +60,0 @@ /**

src/component/legend/size.js

@@ -6,2 +6,3 @@ /**
 const Util = require('../../util');
+const Global = require('../../global');
 const Continuous = require('./continuous');
@@ -29,3 +30,4 @@ const CIRCLE_GAP = 8;
         textAlign: 'start',
-        textBaseline: 'middle'
+        textBaseline: 'middle',
+        fontFamily: Global.fontFamily
       }
@@ -32,0 +34,0 @@ });

src/component/tooltip/index.js

@@ -6,4 +6,5 @@ /**
 const Util = require('../../util');
+const Base = require('../../base');
 const Global = require('../../global');
-const { Group, DomUtil } = require('@antv/g');
+const { DomUtil } = require('@antv/g');
 
@@ -104,6 +105,5 @@ const CONTAINER_CLASS = 'g2-tooltip';
 
-class Tooltip extends Group {
+class Tooltip extends Base {
   getDefaultCfg() {
     return {
-      zIndex: 10,
       /**
@@ -174,2 +174,6 @@ * 右下角坐标
       follow: true,
+      /**
+       * 是否允许鼠标停留在 tooltip 上，默认不允许
+       * @type {Boolean}
+       */
       enterable: false
@@ -179,3 +183,3 @@ };
 
-  _setTooltipWrapper() {
+  _initTooltipWrapper() {
     const self = this;
@@ -197,19 +201,28 @@ const containerTpl = self.get('containerTpl');
 
-  _beforeRenderUI() {
+  _init() {
     const crosshairs = this.get('crosshairs');
-    if (crosshairs && crosshairs.type === 'rect') {
-      Util.defaultsDeep(this.get('crosshairs'), Global.tooltipCrosshairsRect);
-    } else {
-      Util.defaultsDeep(this.get('crosshairs'), Global.tooltipCrosshairsLine);
+    const frontPlot = this.get('frontPlot');
+    const backPlot = this.get('backPlot');
+    let crosshairsGroup;
+
+    if (crosshairs) {
+      if (crosshairs.type === 'rect') {
+        this.set('crosshairs', Util.deepMix({}, Global.tooltipCrosshairsRect, crosshairs));
+        crosshairsGroup = backPlot.addGroup({
+          zIndex: 0
+        });
+      } else {
+        this.set('crosshairs', Util.deepMix({}, Global.tooltipCrosshairsLine, crosshairs));
+        crosshairsGroup = frontPlot.addGroup();
+      }
     }
 
-    const crosshairsGroup = this.addGroup({
-      zIndex: 0
-    });
-
     this.set('crosshairsGroup', crosshairsGroup);
-    this._setTooltipWrapper();
+    this._initTooltipWrapper();
   }
 
-  _renderUI() {
+  constructor(cfg) {
+    super(cfg);
+    this._init(); // 初始化属性
+
     if (this.get('items')) {
@@ -221,2 +234,3 @@ this._renderTooltip();
 
+
   _clearDom() {
@@ -278,2 +292,3 @@ const container = this.get('container');
     this.set('crossLineShapeY', null);
+    this.set('crosshairsRectShape', null);
     crosshairsGroup.clear();
@@ -319,5 +334,3 @@ }
   _renderVerticalLine(canvas, plotRange) {
-    const {
-      style
-    } = this.get('crosshairs');
+    const { style } = this.get('crosshairs');
     const attrs = Util.mix({
@@ -334,5 +347,3 @@ x1: 0,
   _renderHorizontalLine(canvas, plotRange) {
-    const {
-      style
-    } = this.get('crosshairs');
+    const { style } = this.get('crosshairs');
     const attrs = Util.mix({
@@ -349,5 +360,4 @@ x1: plotRange ? plotRange.bl.x : canvas.get('width'),
   _renderBackground(canvas, plotRange) {
-    const {
-      style
-    } = this.get('crosshairs');
+    const { style } = this.get('crosshairs');
+    const crosshairsGroup = this.get('crosshairsGroup');
     const attrs = Util.mix({
@@ -360,3 +370,3 @@ x: plotRange ? plotRange.tl.x : 0,
 
-    const shape = this.addShape('rect', {
+    const shape = crosshairsGroup.addShape('rect', {
       attrs
@@ -401,4 +411,5 @@ });
     let markerGroup = self.get('markerGroup');
+    const frontPlot = self.get('frontPlot');
     if (!markerGroup) {
-      markerGroup = self.addGroup({
+      markerGroup = frontPlot.addGroup({
         zIndex: 1
@@ -518,3 +529,3 @@ });
     container.style.visibility = 'visible';
-    this.sort();
+    // canvas.sort();
     canvas.draw();
@@ -540,3 +551,3 @@ }
 
-  remove() {
+  destroy() {
     const self = this;
@@ -558,3 +569,4 @@ const crossLineShapeX = self.get('crossLineShapeX');
     crosshairsRectShape && crosshairsRectShape.remove();
-    super.remove();
+    // super.remove();
+    super.destroy();
   }
@@ -561,0 +573,0 @@ }

src/facet/base.js

@@ -10,2 +10,3 @@ /**
 const cloneDeep = require('lodash/cloneDeep');
+const Global = require('../global');
 
@@ -75,3 +76,4 @@ // 绑定事件
           textAlign: 'center',
-          fill: '#444'
+          fill: '#444',
+          fontFamily: Global.fontFamily
         }
@@ -85,3 +87,4 @@ },
           rotate: 90,
-          fill: '#444'
+          fill: '#444',
+          fontFamily: Global.fontFamily
         }
@@ -88,0 +91,0 @@ }

src/geom/label/geom-labels.js

@@ -80,3 +80,4 @@ const { Group } = require('@antv/g');
     const labelCfg = self.get('labelCfg');
-    Util.merge(labels, labelCfg.cfg);
+    // Util.merge(labels, labelCfg.cfg);
+    Util.deepMix(labels, labelCfg.cfg);
     self.set('label', labels);
@@ -95,5 +96,7 @@ }
     if (geomType === 'polygon' || (labelCfg && labelCfg.offset < 0 && Util.indexOf(IGNORE_ARR, geomType) === -1)) {
-      return Util.merge({}, self.get('label'), Global.innerLabels);
+      // return Util.merge({}, self.get('label'), Global.innerLabels);
+      return Util.deepMix({}, self.get('label'), Global.innerLabels);
     }
-    return Util.merge({}, Global.label, self.get('label'));
+    // return Util.merge({}, Global.label, self.get('label'));
+    return Util.deepMix({}, Global.label, self.get('label'));
   }
@@ -100,0 +103,0 @@

src/geom/mixin/active.js

@@ -102,2 +102,3 @@ /**
     const self = this;
+    let isStop = false; // 判断 shape 是否正在动画
     if (!Util.isArray(shapes)) {
@@ -118,2 +119,6 @@ shapes = [ shapes ];
     Util.each(shapes, shape => {
+      if (shape.get('animating')) {
+        isStop = true;
+        return false;
+      }
       if (!shape.get('_originAttrs')) {
@@ -127,2 +132,6 @@ shape.set('_originAttrs', Util.cloneDeep(shape.__attrs)); // 缓存原来的属性，由于 __attrs.matrix 是数组，所以此处需要深度复制
 
+    if (isStop) {
+      return;
+    }
+
     self.set('activeShapes', shapes);
@@ -129,0 +138,0 @@ self.set('preShapes', shapes);

src/global.js

@@ -10,5 +10,8 @@ /**
 const Default = {
-  version: '3.0.0-rc5.5',
+  version: '3.0.0-rc5.8',
   trackable: true,
   animate: true,
+  snapArray: [ 0, 1, 2, 4, 5, 10 ],
+  // 指定固定 tick 数的逼近值
+  snapCountArray: [ 0, 1, 1.2, 1.5, 1.6, 2, 2.2, 2.4, 3, 4, 5, 6, 7.5, 8, 10 ],
   widthRatio: { // 宽度所占的分类的比例
@@ -41,3 +44,3 @@ column: 1 / 2, // 一般的柱状图占比 1/2
   }
-  Util.merge(Global, Default, newTheme);
+  Util.deepMix(Global, Default, newTheme);
   Global.setTheme = setTheme;
@@ -44,0 +47,0 @@ }

src/scale/auto/number.js

@@ -10,3 +10,3 @@ /**
 const MAX_COUNT = 7;
-const INTERVAL_ARRAY = [ 0, 1, 2, 4, 5, 10 ];
+const Global = require('../../global');
 
@@ -20,5 +20,15 @@ module.exports = function(info) {
   const maxCount = info.maxCount || MAX_COUNT;
+  const isFixedCount = minCount === maxCount; // 是否限定死了个数
+  const minLimit = Util.isNil(info.minLimit) ? -Infinity : info.minLimit; // 限定的最小值
+  const maxLimit = Util.isNil(info.maxLimit) ? Infinity : info.maxLimit; // 限定最大值
   let avgCount = (minCount + maxCount) / 2;
-  let count;
+  let count = avgCount;
+  // 用户传入的逼近数组
+  const snapArray = info.snapArray ? info.snapArray : (isFixedCount ? Global.snapCountArray : Global.snapArray);
 
+  // 如果限定大小范围，同时大小范围等于用户传入的范围，同时限定了个数，interval 按照个数均分
+  if (min === minLimit && max === maxLimit && isFixedCount) {
+    interval = (max - min) / (count - 1);
+  }
+
   if (Util.isNil(min)) {
@@ -48,3 +58,3 @@ min = 0;
     const temp = (max - min) / (avgCount - 1);
-    interval = AutoUtil.snapFactorTo(temp, INTERVAL_ARRAY, 'ceil');
+    interval = AutoUtil.snapFactorTo(temp, snapArray, 'ceil');
     if (maxCount !== minCount) {
@@ -59,5 +69,3 @@ count = parseInt((max - min) / interval, 10);
       // 不确定tick的个数时，使得tick偏小
-      interval = AutoUtil.snapFactorTo((max - min) / (count - 1), INTERVAL_ARRAY, 'floor');
-    } else {
-      count = avgCount;
+      interval = AutoUtil.snapFactorTo((max - min) / (count - 1), snapArray, 'floor');
     }
@@ -67,4 +75,5 @@ }
     // 校正 max 和 min
-    max = AutoUtil.snapMultiple(max, interval, 'ceil'); // 向上逼近
-    min = AutoUtil.snapMultiple(min, interval, 'floor'); // 向下逼近
+    max = Math.min(AutoUtil.snapMultiple(max, interval, 'ceil'), maxLimit); // 向上逼近
+    min = Math.max(AutoUtil.snapMultiple(min, interval, 'floor'), minLimit); // 向下逼近
+
     count = Math.round((max - min) / interval);
@@ -95,5 +104,11 @@ min = Util.fixedBase(min, interval);
 
+  max = Math.min(max, maxLimit);
+  min = Math.max(min, minLimit);
+
   ticks.push(min);
   for (let i = 1; i < count; i++) {
-    ticks.push(Util.fixedBase(interval * i + min, interval));
+    const tickValue = Util.fixedBase(interval * i + min, interval);
+    if (tickValue < max) {
+      ticks.push(tickValue);
+    }
   }
@@ -100,0 +115,0 @@ if (ticks[ticks.length - 1] < max) {

src/scale/linear.js

@@ -45,2 +45,9 @@ /**
       /**
+       * min value limitted of the scale
+       * @type {Number}
+       * @default null
+       */
+      minLimit: null,
+
+      /**
        * max value of the scale
@@ -53,2 +60,9 @@ * @type {Number}
       /**
+       * max value limitted of the scale
+       * @type {Number}
+       * @default null
+       */
+      maxLimit: null,
+
+      /**
        * 是否为了用户习惯，优化min,max和ticks，如果进行优化，则会根据生成的ticks调整min,max，否则舍弃(min,max)范围之外的ticks
@@ -72,3 +86,9 @@ * @type {Boolean}
        */
-      tickInterval: null
+      tickInterval: null,
+
+      /**
+       * 用于计算坐标点时逼近的数组
+       * @type {Array}
+       */
+      snapArray: null
     });
@@ -116,5 +136,8 @@ }
       max,
+      minLimit: self.minLimit,
+      maxLimit: self.maxLimit,
       minCount: count,
       maxCount: count,
-      interval
+      interval,
+      snapArray: this.snapArray
     });
@@ -121,0 +144,0 @@ return tmp.ticks;

src/theme/dark.js

@@ -12,3 +12,3 @@ /**
 
-const DarkTheme = Util.defaultsDeep({
+const DarkTheme = Util.deepMix({}, BasicTheme, {
   background: {
@@ -193,5 +193,5 @@ fill: '#1F1F1F',
   }
-}, BasicTheme);
+});
 
 module.exports = DarkTheme;
 

src/theme/default.js

@@ -16,3 +16,3 @@ /**
 
-const FONT_FAMILY = '"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", SimSun, "sans-serif"';
+const FONT_FAMILY = '"-apple-system", BlinkMacSystemFont, "Segoe UI", Roboto,"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",SimSun, "sans-serif"';
 // tooltip 相关 dom 的 css 类名
@@ -64,3 +64,4 @@ const TOOLTIP_CONTAINER_CLASS = 'g2-tooltip';
           lineHeight: 20,
-          textBaseline: 'middle'
+          textBaseline: 'middle',
+          fontFamily: FONT_FAMILY
         },
@@ -89,3 +90,4 @@ autoRotate: true
           lineHeight: 20,
-          textBaseline: 'middle'
+          textBaseline: 'middle',
+          fontFamily: FONT_FAMILY
         }
@@ -113,3 +115,4 @@ },
           lineHeight: 20,
-          textBaseline: 'middle'
+          textBaseline: 'middle',
+          fontFamily: FONT_FAMILY
         }
@@ -138,3 +141,4 @@ },
           lineHeight: 20,
-          textBaseline: 'middle'
+          textBaseline: 'middle',
+          fontFamily: FONT_FAMILY
         }
@@ -161,3 +165,4 @@ },
           fontSize: 12,
-          lineHeight: 20
+          lineHeight: 20,
+          fontFamily: FONT_FAMILY
         }
@@ -191,3 +196,4 @@ },
           textBaseline: 'middle',
-          lineHeight: 20
+          lineHeight: 20,
+          fontFamily: FONT_FAMILY
         }
@@ -233,3 +239,4 @@ },
       fontSize: 12,
-      textBaseline: 'middle'
+      textBaseline: 'middle',
+      fontFamily: FONT_FAMILY
     }
@@ -243,3 +250,4 @@ },
       textBaseline: 'top',
-      fontStyle: 'bold'
+      fontStyle: 'bold',
+      fontFamily: FONT_FAMILY
     }
@@ -251,3 +259,4 @@ },
       fontSize: 12,
-      textBaseline: 'middle'
+      textBaseline: 'middle',
+      fontFamily: FONT_FAMILY
     }
@@ -277,3 +286,4 @@ },
         textBaseline: 'middle',
-        lineHeight: 20
+        lineHeight: 20,
+        fontFamily: FONT_FAMILY
       }, // 图例项文本的样式
@@ -294,3 +304,4 @@ unCheckColor: '#bfbfbf'
         textBaseline: 'middle',
-        lineHeight: 20
+        lineHeight: 20,
+        fontFamily: FONT_FAMILY
       }, // 图例项文本的样式
@@ -312,3 +323,4 @@ unCheckColor: '#bfbfbf'
         textBaseline: 'middle',
-        lineHeight: 20
+        lineHeight: 20,
+        fontFamily: FONT_FAMILY
       }, // 图例项文本的样式
@@ -330,3 +342,4 @@ unCheckColor: '#bfbfbf'
         textBaseline: 'middle',
-        lineHeight: 20
+        lineHeight: 20,
+        fontFamily: FONT_FAMILY
       }, // 图例项文本的样式
@@ -513,3 +526,4 @@ unCheckColor: '#bfbfbf'
           fontSize: 12,
-          textAlign: 'center'
+          textAlign: 'center',
+          fontFamily: FONT_FAMILY
         }
@@ -523,3 +537,5 @@ }
         textBaseline: 'middle',
-        textAlign: 'start'
+        textAlign: 'start',
+        fontFamily: FONT_FAMILY
+
       }
@@ -526,0 +542,0 @@ },

src/util.js

@@ -7,2 +7,4 @@ /**
 
+const MAX_LEVEL = 5;
+
 function _mix(dist, obj) {
@@ -33,2 +35,3 @@ for (const k in obj) {
   isDate: require('lodash/isDate'),
+  isPlainObject: require('lodash/isPlainObject'),
   toArray: require('lodash/toArray'),
@@ -42,5 +45,3 @@ indexOf: require('lodash/indexOf'),
   round: require('lodash/round'),
-  merge: require('lodash/merge'),
   filter: require('lodash/filter'),
-  defaultsDeep: require('lodash/defaultsDeep'),
   isEqualWith: require('lodash/isEqualWith'),
@@ -155,2 +156,37 @@ isEqual: require('lodash/isEqual'),
 
+function deepMix(dst, src, level) {
+  level = level || 0;
+  for (const k in src) {
+    if (src.hasOwnProperty(k)) {
+      const value = src[k];
+      if (value !== null && Util.isPlainObject(value)) {
+        if (!Util.isPlainObject(dst[k])) {
+          dst[k] = {};
+        }
+        if (level < MAX_LEVEL) {
+          deepMix(dst[k], src[k], level + 1);
+        } else {
+          dst[k] = src[k];
+        }
+      } else if (Util.isArray(value)) {
+        dst[k] = [];
+        dst[k] = dst[k].concat(value);
+      } else if (value !== undefined) {
+        dst[k] = src[k];
+      }
+    }
+  }
+}
+
+
+Util.deepMix = function() {
+  const args = Util.toArray(arguments);
+  const rst = args[0];
+  for (let i = 1; i < args.length; i++) {
+    const source = args[i];
+    deepMix(rst, source);
+  }
+  return rst;
+};
+
 Util.Array = {
@@ -184,2 +220,23 @@ merge(dataArray) {
   },
+  getRange(values) {
+    if (!values.length) { // 如果没有数值则直接返回0
+      return {
+        min: 0,
+        max: 0
+      };
+    }
+    if (Util.isArray(values[0])) {
+      let tmp = [];
+      for (let i = 0; i < values.length; i++) {
+        tmp = tmp.concat(values[i]);
+      }
+      values = tmp;
+    }
+    const max = Math.max.apply(null, values);
+    const min = Math.min.apply(null, values);
+    return {
+      min,
+      max
+    };
+  },
   firstValue(data, name) {
@@ -186,0 +243,0 @@ let rst = null;

No alert changes

Improved metrics

Lines of code

65145

increased by0.26%

Worsened metrics

Total package byte prevSize

18743917

decreased by-0.63%

Number of package files

296

decreased by-2.63%

No dependency changes