@antv/g2 - npm Package Compare versions

Comparing version 3.0.0-rc5.2 to 3.0.0-rc5.3

package.json

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

src/animate/action.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview Default animation funciton
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const G = require('@antv/g');

src/animate/animate.js

 /**
  * @fileOverview Default animation configuration for geoms
+ * @author sima.zhang
  */
@@ -4,0 +5,0 @@ const Util = require('../util');

src/animate/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The entry of chart's animation
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const Animate = require('./animate');

src/chart/controller/axis.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The controller of axis
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -240,10 +244,12 @@ const { Axis } = require('../../component/index');
     const options = self.options;
+    const field = scale.field;
     const isShowTitle = !!(Global.axis[position] && Global.axis[position].title); // 用户全局禁用 title
 
-    if (isShowTitle) {
+    // bugfix: title was set by chart.axis('field', { title: {} })
+    if (isShowTitle || (options[field] && options[field].title)) {
       cfg.title = {
-        text: scale.alias || scale.field
+        text: scale.alias || field
       };
     }
-    cfg = Util.merge(true, {}, Global.axis[position], cfg, options[scale.field]);
+    cfg = Util.merge(true, {}, Global.axis[position], cfg, options[field]);
     cfg.ticks = scale.getTicks();
@@ -250,0 +256,0 @@

src/chart/controller/coord.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The controller of coordinate
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Coord = require('../../coord/index');

src/chart/controller/event.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The controller of chart's events
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@

src/chart/controller/guide.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The controller of guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { Guide } = require('../../component/index');

src/chart/controller/index.js

@@ -1,3 +0,1 @@
-
-
 module.exports = {
@@ -4,0 +2,0 @@ Scale: require('./scale'),

src/chart/controller/legend.js

@@ -123,3 +123,28 @@ const Util = require('../../util');
 
+  _filterLabels(shape, geom, visible) {
+    if (shape.get('gLabel')) {
+      shape.get('gLabel').set('visible', visible);
+    } else {
+      const labelCfg = geom.get('labelCfg');
+      if (labelCfg && labelCfg.fields && labelCfg.fields.length > 0) {
+        const xScale = geom.getXScale();
+        const yScale = geom.getYScale();
+        const xField = xScale.field;
+        const yField = yScale.field;
+        const shapeData = shape.get('origin')._origin;
+        const labelContainer = geom.get('labelContainer');
+        const labels = labelContainer.get('labelsGroup').get('children');
+        Util.each(labels, label => {
+          const labelData = label.get('attrs').point;
+          if ((labelData[xField] === shapeData[xField]) && (labelData[yField] === shapeData[yField])) {
+            label.set('visible', visible);
+            shape.set('gLabel', label);
+          }
+        });
+      }
+    }
+  }
+
   _bindFilterEvent(legend, scale) {
+    const self = this;
     const chart = this.chart;
@@ -129,5 +154,8 @@ const field = scale.field;
       const range = ev.range;
-      chart.filterShape(function(obj) {
+      chart.filterShape(function(obj, shape, geom) {
         if (obj[field]) {
-          return obj[field] >= range[0] && obj[field] <= range[1];
+          const filtered = (obj[field] >= range[0] && obj[field] <= range[1]);
+          // shape 带 label，则还需要隐藏 label
+          self._filterLabels(shape, geom, filtered);
+          return filtered;
         }
@@ -304,4 +332,5 @@ return true;
 
-    const plotRange = self.plotRange;
-    const maxLength = (position === 'right' || position === 'left') ? plotRange.bl.y - plotRange.tr.y : plotRange.tr.x - plotRange.bl.x;
+    const chart = self.chart;
+    const canvas = chart.get('canvas');
+    const maxLength = (position === 'right' || position === 'left') ? canvas.get('height') : canvas.get('width');
 
@@ -469,4 +498,4 @@ Util.each(ticks, tick => {
 
-    const plotRange = self.plotRange;
-    const maxLength = (position === 'right' || position === 'left') ? plotRange.bl.y - plotRange.tr.y : plotRange.tr.x - plotRange.bl.x;
+    const canvas = chart.get('canvas');
+    const maxLength = (position === 'right' || position === 'left') ? canvas.get('height') : canvas.get('width');
 
@@ -473,0 +502,0 @@ const legendCfg = Util.defaultsDeep({

src/chart/controller/tooltip.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The controller of tooltip
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -293,3 +297,3 @@ const Global = require('../../global');
               if (tmpPoint) {
-                const subItems = geom.getTipItems(tmpPoint);
+                const subItems = geom.getTipItems(tmpPoint, options.title);
                 if (Util.indexOf(TYPE_SHOW_MARKERS, type) !== -1) {
@@ -316,3 +320,3 @@ Util.each(subItems, v => {
             if (shape && shape.get('visible') && shape.get('origin')) {
-              items = geom.getTipItems(shape.get('origin'));
+              items = geom.getTipItems(shape.get('origin'), options.title);
             }
@@ -319,0 +323,0 @@ }

src/component/axis/base.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the base class of Axis
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { LabelsRenderer } = require('../label/index');

src/component/axis/circle.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the circle axis of polar coordinate
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/axis/grid.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the grid of axis
+ * @author sima.zhang
+ */
 const { Group } = require('@antv/g');
@@ -2,0 +6,0 @@ const Util = require('../../util');

src/component/axis/helix.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the helix axis of helix coordinate
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/axis/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the entry of axis
+ * @author sima.zhang
+ */
 module.exports = {
@@ -2,0 +6,0 @@ Line: require('./line'), // 基础的直线坐标轴

src/component/axis/line.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the radius axis of polar coordinate and axis of cartesian coordinate
+ * @author sima.zhang
+ */
 const Base = require('./base');
@@ -2,0 +6,0 @@ const Util = require('../../util');

src/component/axis/polyline.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the axis of map coodinate
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/guide/arc.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the arc guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/guide/base.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the base class of guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const KEYWORDS = [ 'min', 'max', 'median' ];

src/component/guide/html.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the html guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { DomUtil } = require('@antv/g');

src/component/guide/image.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the image guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/guide/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the entry of guide
+ * @author sima.zhang
+ */
 module.exports = {
@@ -2,0 +6,0 @@ Line: require('./line'),

src/component/guide/line.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the line guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/guide/region.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the region guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/guide/text.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the text guide
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/label/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the entry of labels
+ * @author sima.zhang
+ */
 const Labels = require('./labels');
@@ -2,0 +6,0 @@ Labels.LabelsRenderer = require('./labels-renderer');

src/component/label/labels-renderer.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class that performs label rendering
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Labels = require('./labels');

src/component/label/labels.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The Label class
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { DomUtil, Group } = require('@antv/g');

src/component/legend/base.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The base class of legend
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { Group } = require('@antv/g');

src/component/legend/category.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of category legend
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -184,3 +188,8 @@ const Base = require('./base');
        */
-      reversed: false
+      reversed: false,
+      /**
+       * 是否自动换行
+       * @type {Boolean}
+       */
+      autoWrap: true
     });
@@ -197,3 +206,3 @@ }
       this._renderItems();
-      this._adjustItems();
+      this.get('autoWrap') && this._adjustItems(); // 默认自动换行
       this._renderBack();
@@ -200,0 +209,0 @@ } else { // 使用 html 渲染图例

src/component/legend/color.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of the gradient color legend
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Continuous = require('./continuous');

src/component/legend/continuous.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The base class of continuous legend
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/component/legend/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The entry of legend
+ * @author sima.zhang
+ */
 module.exports = {
@@ -2,0 +6,0 @@ Category: require('./category'), // 分类图例

src/component/legend/size.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of the size legend
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Continuous = require('./continuous');

src/component/legend/slider.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of slider
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const { Group, DomUtil } = require('@antv/g');

src/component/plot.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of canvas plot
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const { Group } = require('@antv/g');

src/component/tooltip/index.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The class of tooltip
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const Global = require('../../global');

src/coord/base.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the base class of Coordinate
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const MatrixUtil = require('@antv/g').MatrixUtil;

src/coord/cartesian.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the class of Cartesian Coordinate
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/coord/helix.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the class of Helix Coordinate
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/coord/index.js

 /**
- * @fileOverview the coordinate of G2
+ * @fileOverview the entry of coordinate
  * @author [e-mail]
@@ -4,0 +4,0 @@ */

src/coord/polar.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the class of Polar Coordinate
+ * @author sima.zhang
+ */
 const Util = require('../util');
@@ -2,0 +6,0 @@ const Base = require('./base');

src/facet/base.js

@@ -243,6 +243,6 @@ /**
         const value = cond.value;
-        const values = cond.values;
+        // const values = cond.values;
         let tmp = true;
         if (!isNil(value) && field) {
-          tmp = obj[field] === value || obj[field] === values.indexOf(value);
+          tmp = obj[field] === value;
         }
@@ -249,0 +249,0 @@ filtered = filtered && tmp;

src/geom/label/geom-labels.js

@@ -154,9 +154,50 @@ const { Group } = require('@antv/g');
   /**
-   * 绘制连接到
-   * @param {Array} items 文本项
-   * @param {Object} labelLine 连接文本的线的配置项
+   * drawing lines to labels
+   * @param  {Array} items labels
+   * @param  {Object} labelLine configuration for label lines
    */
-  drawLines() { /* items,labelLine */
+  drawLines(items, labelLine) {
+    const self = this;
+    const offset = self.getDefaultOffset();
+    if (offset > 0) {
+      Util.each(items, function(point) {
+        self.lineToLabel(point, labelLine);
+      });
+    }
   }
 
+  // 连接线
+  lineToLabel(label, labelLine) {
+    const self = this;
+    const coord = self.get('coord');
+    const start = {
+      x: label.x - label._offset.x,
+      y: label.y - label._offset.y
+    };
+    const inner = {
+      x: (start.x + label.x) / 2,
+      y: (start.y + label.y) / 2
+    };
+    let lineGroup = self.get('lineGroup');
+    // var lineShape;
+    if (!lineGroup) {
+      lineGroup = self.addGroup({
+        elCls: 'x-line-group'
+      });
+      self.set('lineGroup', lineGroup);
+    }
+    const lineShape = lineGroup.addShape('path', {
+      attrs: Util.mix({
+        path: [ 'M' + start.x, start.y + ' Q' + inner.x, inner.y + ' ' + label.x, label.y ].join(','),
+        fill: null,
+        stroke: label.color
+      }, labelLine)
+    });
+    // label 对应线的动画关闭
+    lineShape.name = 'labelLine';
+    // generate labelLine id according to label id
+    lineShape._id = label._id && label._id.replace('glabel', 'glabelline');
+    lineShape.set('coord', coord);
+  }
+
   /**
@@ -172,2 +213,3 @@ * @protected
     const self = this;
+    const coord = self.get('coord');
 
@@ -179,2 +221,3 @@ function getDimValue(value, idx) {
             value = value[value.length - 1];
+            // value = value[0];
           } else {
@@ -189,2 +232,3 @@ value = avg(value);
     }
+
     const labelPoint = {
@@ -196,2 +240,23 @@ x: getDimValue(point.x, index),
 
+    // get nearest point of the shape as the label line start point
+    if (point && point.nextPoints && (point.shape === 'funnel' || point.shape === 'pyramid')) {
+      let maxX = -Infinity;
+      point.nextPoints.forEach(p => {
+        p = coord.convert(p);
+        if (p.x > maxX) {
+          maxX = p.x;
+        }
+      });
+      labelPoint.x = (labelPoint.x + maxX) / 2;
+    }
+    // sharp edge of the pyramid
+    if (point.shape === 'pyramid' && !point.nextPoints && point.points) {
+      point.points.forEach(p => {
+        p = coord.convert(p);
+        if (point.x.indexOf(p.x) === -1) {
+          labelPoint.x = (labelPoint.x + p.x) / 2;
+        }
+      });
+    }
+
     const offsetPoint = self.getLabelOffset(labelPoint, index, labels.length);
@@ -201,2 +266,4 @@ self.transLabelPoint(labelPoint);
     labelPoint.y += offsetPoint.y;
+    labelPoint.color = point.color;
+    labelPoint._offset = offsetPoint;
     return labelPoint;
@@ -203,0 +270,0 @@ }

src/geom/label/pie-labels.js

@@ -181,17 +181,2 @@ const Util = require('../../util');
 
-  /**
-   * drawing lines to labels
-   * @param  {Array} items labels
-   * @param  {Object} labelLine configuration for label lines
-   */
-  drawLines(items, labelLine) {
-    const self = this;
-    const offset = self.getDefaultOffset();
-    if (offset > 0) {
-      Util.each(items, function(point) {
-        self.lineToLabel(point, labelLine);
-      });
-    }
-  }
-
   // 连接线
@@ -198,0 +183,0 @@ lineToLabel(label, labelLine) {

src/geom/mixin/active.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the interaction when geom was actived
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@ const FIELD_ORIGIN = '_origin';

src/geom/mixin/select.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview the interaction when geom was selected
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -2,0 +6,0 @@

src/geom/mixin/tooltip.js

@@ -0,1 +1,5 @@
+/**
+ * @fileOverview The tooltip handler
+ * @author sima.zhang
+ */
 const Util = require('../../util');
@@ -94,4 +98,7 @@ const { defaultColor } = require('../../global');
 
-  _getTipTitleScale() {
+  _getTipTitleScale(titleField) {
     const self = this;
+    if (titleField) {
+      return self._getScale(titleField);
+    }
     const position = self.getAttr('position');
@@ -286,7 +293,8 @@ const fields = position.getFields();
    * @param  {Object} origin 点的原始信息
+   * @param  {String} titleField 标题的字段
    * @return {String} 提示信息的标题
    */
-  getTipTitle(origin) {
+  getTipTitle(origin, titleField) {
     let tipTitle = '';
-    const titleScale = this._getTipTitleScale();
+    const titleScale = this._getTipTitleScale(titleField);
 
@@ -352,9 +360,9 @@ if (titleScale) {
    * @param  {Object} point 原始的数据记录
-   * @param  {Object} cfg tooltipTitle 配置信息
+   * @param  {String} titleField tooltipTitle 配置信息
    * @return {Array}  一条或者多条记录
    */
-  getTipItems(point) {
+  getTipItems(point, titleField) {
     const self = this;
     const origin = point[FIELD_ORIGIN];
-    const tipTitle = self.getTipTitle(origin);
+    const tipTitle = self.getTipTitle(origin, titleField);
     const tooltipCfg = self.get('tooltipCfg');
@@ -361,0 +369,0 @@ const items = [];

src/geom/shape/area.js

@@ -64,28 +64,23 @@ /**
 
-function _markerFn(x, y, r, ctx) {
-  ctx.moveTo(x - r, y + r);
-  ctx.lineTo(x - r, y - r);
-  ctx.lineTo(x, y);
-  ctx.lineTo(x + r, y - r);
-  ctx.lineTo(x + r, y + r);
-  ctx.closePath();
-}
-
-function _smoothMarkerFn(x, y, r, ctx) {
-  ctx.moveTo(x - r, y + r);
-  ctx.lineTo(x - r, y);
-  ctx.arcTo(x - r / 2, y - r / 2, x, y, r);
-  ctx.arcTo(x + r / 2, y + r / 2, x + r, y, r);
-  ctx.lineTo(x + r, y + r);
-  ctx.closePath();
-}
-
 // get marker cfg
-function _getMarkerCfg(cfg, smooth, hollow) {
-  const areaCfg = hollow ? getLineAttrs(cfg) : getFillAttrs(cfg);
-
-  return Util.mix({
-    symbol: smooth ? _smoothMarkerFn : _markerFn,
-    radius: Global.markerRadius
-  }, areaCfg);
+function _getMarkerCfg(cfg) {
+  return {
+    symbol(x, y, r, ctx) {
+      ctx.save();
+      ctx.lineWidth = 1;
+      ctx.strokeStyle = ctx.fillStyle;
+      ctx.moveTo(x - 5, y - 4);
+      ctx.lineTo(x + 5, y - 4);
+      ctx.stroke();
+      ctx.restore();
+      ctx.moveTo(x - 5, y - 4);
+      ctx.lineTo(x + 5, y - 4);
+      ctx.lineTo(x + 5, y + 4);
+      ctx.lineTo(x - 5, y + 4);
+      ctx.closePath();
+    },
+    radius: 5,
+    fill: cfg.color,
+    fillOpacity: 0.3
+  };
 }
@@ -185,3 +180,3 @@
   getMarkerCfg(cfg) {
-    return _getMarkerCfg(cfg, false, false);
+    return _getMarkerCfg(cfg);
   }
@@ -203,3 +198,3 @@ });
   getMarkerCfg(cfg) {
-    return _getMarkerCfg(cfg, true, false);
+    return _getMarkerCfg(cfg);
   }
@@ -221,3 +216,3 @@ });
   getMarkerCfg(cfg) {
-    return _getMarkerCfg(cfg, false, true);
+    return _getMarkerCfg(cfg);
   }
@@ -240,3 +235,3 @@ });
   getMarkerCfg(cfg) {
-    return _getMarkerCfg(cfg, true, true);
+    return _getMarkerCfg(cfg);
   }
@@ -243,0 +238,0 @@ });

src/geom/shape/line.js

@@ -13,8 +13,8 @@ /**
 const Global = require('../../global');
-const DOT_ARR = [ 2, 1 ];
-const DASH_ARR = [ 10, 5 ];
+const DOT_ARR = [ 1, 1 ];
+const DASH_ARR = [ 2, 1 ];
 
 function getAttrs(cfg) {
   const defaultCfg = Global.shape.line;
-  const shapeCfg = Util.merge({}, defaultCfg, {
+  const shapeCfg = Util.mix({}, defaultCfg, {
     stroke: cfg.color,
@@ -28,2 +28,14 @@ lineWidth: cfg.size,
 
+function getMarkerAttrs(cfg) {
+  const defaultCfg = Global.shape.line;
+  const shapeCfg = Util.mix({}, defaultCfg, {
+    stroke: cfg.color,
+    lineWidth: 1,
+    strokeOpacity: cfg.opacity,
+    opacity: cfg.opacity,
+    radius: 5
+  }, cfg.style);
+  return shapeCfg;
+}
+
 // 获取带有上下区间的 path
@@ -108,4 +120,5 @@ function getRangePath(points, smooth, isInCircle, isStack) {
   ctx.moveTo(x - r, y);
-  ctx.arcTo(x - r / 2, y - r / 2, x, y, r);
-  ctx.arcTo(x + r / 2, y + r / 2, x + r, y, r);
+  ctx.arcTo(x - r / 2, y - r / 2, x, y, r / 2);
+  ctx.lineTo(x, y);
+  ctx.arcTo(x + r / 2, y + r / 2, x + r, y - r / 2, r / 2);
 }
@@ -115,5 +128,4 @@ // get marker cfg
   return Util.mix({
-    symbol: smooth ? _smoothMarkerFn : _markerFn,
-    radius: Global.markerRadius
-  }, getAttrs(cfg));
+    symbol: smooth ? _smoothMarkerFn : _markerFn
+  }, getMarkerAttrs(cfg));
 }
@@ -123,5 +135,4 @@
   return Util.mix({
-    symbol: fn,
-    radius: 5
-  }, getAttrs(cfg));
+    symbol: fn
+  }, getMarkerAttrs(cfg));
 }
@@ -193,3 +204,3 @@
 
-// 点线
+// 点线 ···
 Shape.registerShape('line', 'dot', {
@@ -213,3 +224,3 @@ draw(cfg, container) {
 
-// 断线 - - - -
+// 断线 - - -
 Shape.registerShape('line', 'dash', {
@@ -229,2 +240,3 @@ draw(cfg, container) {
     tmp.lineDash = DASH_ARR;
+    tmp.radius = 4.5;
     return tmp;
@@ -269,6 +281,6 @@ }
     return _getInterMarkerCfg(cfg, function(x, y, r, ctx) {
-      ctx.moveTo(x - r, y - r);
-      ctx.lineTo(x, y - r);
-      ctx.lineTo(x, y);
-      ctx.lineTo(x + r, y);
+      ctx.moveTo(x - r - 1, y - 3);
+      ctx.lineTo(x, y - 3);
+      ctx.lineTo(x, y + 3);
+      ctx.lineTo(x + r + 1, y + 3);
     });
@@ -297,6 +309,6 @@ }
     return _getInterMarkerCfg(cfg, function(x, y, r, ctx) {
-      ctx.moveTo(x - r, y);
-      ctx.lineTo(x, y);
-      ctx.lineTo(x, y - r);
-      ctx.lineTo(x + r, y - r);
+      ctx.moveTo(x - r - 1, y + 3);
+      ctx.lineTo(x, y + 3);
+      ctx.lineTo(x, y - 3);
+      ctx.lineTo(x + r + 1, y - 3);
     });
@@ -330,8 +342,8 @@ }
     return _getInterMarkerCfg(cfg, function(x, y, r, ctx) {
-      ctx.moveTo(x - r * 3 / 2, y);
-      ctx.lineTo(x - r / 2, y);
-      ctx.lineTo(x - r / 2, y - r / 2);
-      ctx.lineTo(x + r / 2, y - r / 2);
-      ctx.lineTo(x + r / 2, y);
-      ctx.lineTo(x + r * 3 / 2, y);
+      ctx.moveTo(x - r - 2, y + 2);
+      ctx.lineTo(x - r + 2, y + 2);
+      ctx.lineTo(x - r + 2, y - 2);
+      ctx.lineTo(x - r + 7, y - 2);
+      ctx.lineTo(x - r + 7, y + 2);
+      ctx.lineTo(x + r + 1, y + 2);
     });
@@ -338,0 +350,0 @@ }

src/geom/shape/point.js

@@ -20,3 +20,3 @@ /**
   hexagon(x, y, r, ctx) {
-    const diffX = r / 2 * SQRT_3;
+    const diffX = (r / 2) * SQRT_3;
     ctx.moveTo(x, y - r);
@@ -31,6 +31,7 @@ ctx.lineTo(x + diffX, y - r / 2);
   bowtie(x, y, r, ctx) {
-    ctx.moveTo(x - r, y - r);
-    ctx.lineTo(x + r, y + r);
-    ctx.lineTo(x + r, y - r);
-    ctx.lineTo(x - r, y + r);
+    const diffY = r - 2;
+    ctx.moveTo(x - r, y - diffY);
+    ctx.lineTo(x + r, y + diffY);
+    ctx.lineTo(x + r, y - diffY);
+    ctx.lineTo(x - r, y + diffY);
     ctx.closePath();
@@ -37,0 +38,0 @@ },

src/geom/shape/schema.js

@@ -192,10 +192,2 @@ /**
 
-// 获取图形的marker
-function getMarkerCfg(cfg, fn) {
-  return Util.mix({
-    symbol: fn,
-    radius: Global.markerRadius
-  }, getAttrs(cfg));
-}
-
 const Schema = Shape.registerFactory('schema', {
@@ -240,22 +232,27 @@ defaultShapeType: '',
   getMarkerCfg(cfg) {
-    return getMarkerCfg(cfg, function(x, y, r, ctx) {
-      const yValues = [ y - r, y - r / 2, y, y + r / 2, y + r ];
-      const points = getBoxPoints(x, yValues, 1.2 * r);
-      ctx.moveTo(points[0].x, points[0].y);
-      ctx.lineTo(points[1].x, points[1].y);
-      ctx.moveTo(points[2].x, points[2].y);
-      ctx.lineTo(points[3].x, points[3].y);
-      ctx.moveTo(points[4].x, points[4].y);
-      ctx.lineTo(points[5].x, points[5].y);
-      ctx.lineTo(points[6].x, points[6].y);
-      ctx.lineTo(points[7].x, points[7].y);
-      ctx.lineTo(points[4].x, points[4].y);
-      ctx.closePath();
-      ctx.moveTo(points[8].x, points[8].y);
-      ctx.lineTo(points[9].x, points[9].y);
-      ctx.moveTo(points[10].x, points[10].y);
-      ctx.lineTo(points[11].x, points[11].y);
-      ctx.moveTo(points[12].x, points[12].y);
-      ctx.lineTo(points[13].x, points[13].y);
-    });
+    return {
+      symbol(x, y, r, ctx) {
+        const yValues = [ y - 6, y - 4, y, y + 4, y + 6 ];
+        const points = getBoxPoints(x, yValues, r);
+        ctx.moveTo(points[0].x + 1, points[0].y);
+        ctx.lineTo(points[1].x - 1, points[1].y);
+        ctx.moveTo(points[2].x, points[2].y);
+        ctx.lineTo(points[3].x, points[3].y);
+        ctx.moveTo(points[4].x, points[4].y);
+        ctx.lineTo(points[5].x, points[5].y);
+        ctx.lineTo(points[6].x, points[6].y);
+        ctx.lineTo(points[7].x, points[7].y);
+        ctx.lineTo(points[4].x, points[4].y);
+        ctx.closePath();
+        ctx.moveTo(points[8].x, points[8].y);
+        ctx.lineTo(points[9].x, points[9].y);
+        ctx.moveTo(points[10].x + 1, points[10].y);
+        ctx.lineTo(points[11].x - 1, points[11].y);
+        ctx.moveTo(points[12].x, points[12].y);
+        ctx.lineTo(points[13].x, points[13].y);
+      },
+      radius: 7,
+      lineWidth: 1,
+      stroke: cfg.color
+    };
   }
@@ -280,19 +277,21 @@ });
   getMarkerCfg(cfg) {
-    const tmp = getMarkerCfg(cfg, function(x, y, r, ctx) {
-      y = [ y + 1.5 * r, y + r / 2, y - r / 2, y - 1.5 * r ];
-      const points = getCandlePoints(x, y, r);
-      ctx.moveTo(points[0].x, points[0].y);
-      ctx.lineTo(points[1].x, points[1].y);
-      ctx.moveTo(points[2].x, points[2].y);
-      ctx.lineTo(points[3].x, points[3].y);
-      ctx.lineTo(points[4].x, points[4].y);
-      ctx.lineTo(points[5].x, points[5].y);
-      ctx.closePath();
-      ctx.moveTo(points[6].x, points[6].y);
-      ctx.lineTo(points[7].x, points[7].y);
-    });
-    tmp.fill = cfg.color;
-    tmp.fillOpacity = cfg.opacity;
-    tmp.radius = 5;
-    return tmp;
+    return {
+      symbol(x, y, r, ctx) {
+        y = [ y + 7, y + 3, y - 3, y - 7 ];
+        const points = getCandlePoints(x, y, r);
+        ctx.moveTo(points[0].x, points[0].y);
+        ctx.lineTo(points[1].x, points[1].y);
+        ctx.moveTo(points[2].x, points[2].y);
+        ctx.lineTo(points[3].x, points[3].y);
+        ctx.lineTo(points[4].x, points[4].y);
+        ctx.lineTo(points[5].x, points[5].y);
+        ctx.closePath();
+        ctx.moveTo(points[6].x, points[6].y);
+        ctx.lineTo(points[7].x, points[7].y);
+      },
+      lineWidth: 1,
+      stroke: cfg.color,
+      fill: cfg.color,
+      radius: 4
+    };
   }
@@ -299,0 +298,0 @@ });

src/global.js

@@ -10,3 +10,3 @@ /**
 const Default = {
-  version: '3.0.0-rc3',
+  version: '3.0.0-rc5.3',
   trackable: true,
@@ -13,0 +13,0 @@ animate: true,

src/theme/dark.js

 /**
- * @fileOverview G2 3.0 深色主题
+ * @fileOverview G2 3.0 dark theme
+ * @author sima.zhang
  */
@@ -4,0 +5,0 @@ const Util = require('../util');

src/theme/default.js

 /**
- * @fileOverview G2 3.0 最新主题
+ * @fileOverview G2 3.0 default theme
+ * @author sima.zhang
  */
@@ -436,3 +437,3 @@ const DEFAULT_COLOR = '#1890FF';
       stroke: DEFAULT_COLOR,
-      lineWidth: 1,
+      lineWidth: 2,
       fill: null
@@ -439,0 +440,0 @@ }

src/theme/index.js

@@ -1,2 +0,5 @@
-
+/**
+ * @fileOverview Theme entry
+ * @author sima.zhang
+ */
 const Theme = {
@@ -3,0 +6,0 @@ default: require('./default'),

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Lines of code

64658

increased by2.62%

Worsened metrics

Total package byte prevSize

18715907

decreased by-0.22%

Number of package files

296

decreased by-1.99%

Number of medium supply chain risk alerts

2

increased by100%

No dependency changes