vap-visual - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

_Common/Axises/index.js

@@ -56,4 +56,9 @@ "use strict";
             }
-            if (xAxis.mode == 'rotate' && (!_.isNumber(xAxis.labelRotate) || xAxis.labelRotate == 0)) {
-                xAxis.labelRotate = xAxis.labelRotate || 300;
+            if (xAxis.mode == 'rotate') {
+                if (_.has(xAxis, 'labelRotate')) {
+                    xAxis.labelRotate = [6, -3, 300];
+                }
+                else if (_.isNumber(xAxis.labelRotate)) {
+                    xAxis.labelRotate = [6, -3, xAxis.labelRotate];
+                }
             }
@@ -71,4 +76,9 @@ if (!xAxis.show) {
             }
-            if (yAxis.mode == 'rotate' && (!_.isNumber(yAxis.labelRotate) || yAxis.labelRotate == 0)) {
-                yAxis.labelRotate = yAxis.labelRotate || 330;
+            if (yAxis.mode == 'rotate') {
+                if (_.has(yAxis, 'labelRotate')) {
+                    yAxis.labelRotate = [6, -3, 330];
+                }
+                else if (_.isNumber(yAxis.labelRotate)) {
+                    yAxis.labelRotate = [6, -3, yAxis.labelRotate];
+                }
             }
@@ -75,0 +85,0 @@ if (!yAxis.show) {

_Common/Axises/XBandDrawer.js

@@ -15,2 +15,18 @@ "use strict";
 })();
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
@@ -95,6 +111,7 @@ exports.XBandDrawer = void 0;
         if (this.xAxis.mode == 'rotate') {
+            var _a = __read(this.xAxis.labelRotate, 3), dx = _a[0], dy = _a[1], rotate = _a[2];
             xAxis.selectAll("g.tick text")
-                .attr("dy", "-3")
-                // .attr("dx", (this.itemWidth - 12) / 2 - 2)
-                .attr("transform", "rotate(" + this.xAxis.labelRotate + ")");
+                .attr("dy", dy)
+                .attr("dx", dx)
+                .attr("transform", "rotate(" + rotate + ")");
         }
@@ -101,0 +118,0 @@ else if (this.xAxis.mode == 'inside') {

_Common/Axises/XDateDrawer.js

@@ -15,2 +15,18 @@ "use strict";
 })();
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
@@ -102,6 +118,7 @@ exports.XDateDrawer = void 0;
         if (this.xAxis.mode == 'rotate') {
+            var _a = __read(this.xAxis.labelRotate, 3), dx = _a[0], dy = _a[1], rotate = _a[2];
             xAxis.selectAll("g.tick text")
-                .attr("dy", "-3")
-                // .attr("dx", (this.itemWidth - 12) / 2 - 2)
-                .attr("transform", "rotate(" + this.xAxis.labelRotate + ")");
+                .attr("dy", dy)
+                .attr("dx", dx)
+                .attr("transform", "rotate(" + rotate + ")");
         }
@@ -108,0 +125,0 @@ else if (this.xAxis.mode == 'inside') {

_Common/Axises/XFixNumberDrawer.js

@@ -122,6 +122,7 @@ "use strict";
         if (this.xAxis.mode == 'rotate') {
+            var _a = __read(this.xAxis.labelRotate, 3), dx = _a[0], dy = _a[1], rotate = _a[2];
             xAxis.selectAll("g.tick text")
-                .attr("dy", "-3")
-                // .attr("dx", (this.itemWidth - 12) / 2 - 2)
-                .attr("transform", "rotate(" + this.xAxis.labelRotate + ")");
+                .attr("dy", dy)
+                .attr("dx", dx)
+                .attr("transform", "rotate(" + rotate + ")");
         }
@@ -128,0 +129,0 @@ else if (this.xAxis.mode == 'inside') {

_Common/Axises/YNumberDrawer.js

@@ -114,6 +114,7 @@ "use strict";
         if (this.yAxis.mode == 'rotate') {
+            var _a = __read(this.yAxis.labelRotate, 3), dx = _a[0], dy = _a[1], rotate = _a[2];
             yAxis.selectAll("g.tick text")
-                .attr("dx", -3)
-                // .attr("dx", (this.itemWidth - 12) / 2 - 2)
-                .attr("transform", "rotate(" + this.yAxis.labelRotate + ")");
+                .attr("dy", dy)
+                .attr("dx", dx)
+                .attr("transform", "rotate(" + rotate + ")");
         }
@@ -120,0 +121,0 @@ else {

_Common/Axises/YPercentDrawer.js

@@ -15,2 +15,18 @@ "use strict";
 })();
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
@@ -101,6 +117,7 @@ exports.YPercentDrawer = void 0;
         if (this.yAxis.mode == 'rotate') {
+            var _a = __read(this.yAxis.labelRotate, 3), dx = _a[0], dy = _a[1], rotate = _a[2];
             yAxis.selectAll("g.tick text")
-                .attr("dx", -3)
-                // .attr("dx", (this.itemWidth - 12) / 2 - 2)
-                .attr("transform", "rotate(" + this.yAxis.labelRotate + ")");
+                .attr("dy", dy)
+                .attr("dx", dx)
+                .attr("transform", "rotate(" + rotate + ")");
         }
@@ -107,0 +124,0 @@ else {

_Common/Legends/Types/_Drawer.js

@@ -85,43 +85,36 @@ "use strict";
         this.duration = duration;
-        if (this.config.postion == 'b' || this.config.postion == 't') {
-            this.rows = this.config.cols;
-            this.cols = Math.ceil(this.data.length / this.rows);
-        }
-        else {
-            this.cols = this.config.cols;
-            this.rows = Math.ceil(this.data.length / this.cols);
-        }
+        this.cols = this.config.cols;
+        this.rows = Math.ceil(this.data.length / this.cols) || 1;
+        // this.rows = 2;
+        // console.log(this.data.length )
         this.init();
     }
-    LegendDrawer.prototype.init = function () {
-    };
+    LegendDrawer.prototype.init = function () { };
     LegendDrawer.prototype.resize = function (ui) {
         var _a;
-        var config = this.config;
+        // TO FIX :  Data Length not init, so rows = 1 , must to be dynamic
+        var _b = this, config = _b.config, rows = _b.rows, cols = _b.cols;
         var layout = Object.assign({ x: 0, y: 0, w: 0, h: 0 }, ui);
         var legend = Object.assign({}, layout);
+        legend.w = config.width * cols;
+        legend.h = config.height * rows;
         switch (this.config.postion) {
             case 'l':
-                legend.w = this.config.width;
-                layout.x = layout.x + config.width * config.cols - config.inner;
-                layout.w = layout.w - config.width * config.cols + config.inner;
+                layout.x = layout.x + legend.w - config.inner;
+                layout.w = layout.w - legend.w + config.inner;
                 break;
             case 'r':
-                legend.w = config.width;
-                legend.x = layout.x + layout.w - config.width * config.cols;
-                layout.w = layout.w - config.width * config.cols + config.inner;
+                // legend.w = config.width;
+                legend.x = layout.x + layout.w - legend.w;
+                layout.w = layout.w - legend.w + config.inner;
                 break;
             case 't':
-                legend.h = config.height * config.cols;
-                layout.y = config.height * config.cols - config.inner;
-                layout.h = layout.h - config.height * config.cols + config.inner;
+                layout.y = layout.y + legend.h - config.inner;
+                layout.h = layout.h - legend.h + config.inner;
                 break;
             case 'b':
-                legend.h = config.height * config.cols;
-                legend.y = layout.y + layout.h - config.height * config.cols - config.inner;
-                layout.h = layout.h - config.height * config.cols + config.inner;
+                legend.y = layout.y + layout.h - legend.h - config.inner;
+                layout.h = layout.h - legend.h + config.inner;
                 break;
             case 'lt':
-                legend.w = config.width * config.cols;
-                legend.h = config.height;
                 legend.x = layout.x + config.inner;
@@ -131,4 +124,2 @@ legend.y = layout.y;
             case 'lb':
-                legend.w = config.width * config.cols;
-                legend.h = config.height;
                 legend.x = layout.x + config.inner;
@@ -138,11 +129,7 @@ legend.y = layout.y + layout.h;
             case 'rt':
-                legend.w = config.width * config.cols;
-                legend.h = config.height;
-                legend.x = layout.x + layout.w - config.inner - config.width * config.cols;
+                legend.x = layout.x + layout.w - config.inner - legend.w;
                 legend.y = layout.y;
                 break;
             case 'rb':
-                legend.w = config.width * config.cols;
-                legend.h = config.height;
-                legend.x = layout.x + layout.w - config.inner - config.width * config.cols;
+                legend.x = layout.x + layout.w - config.inner - legend.w;
                 legend.y = layout.y + layout.h;
@@ -183,2 +170,4 @@ break;
     LegendDrawer.prototype.getEnd = function (i) {
+        // console.log(i)
+        // console.log(this.cols)
         //row - index
@@ -188,2 +177,3 @@ var ridx = Math.floor(i / this.cols);
         var cidx = i % this.cols;
+        // console.log(ridx, cidx)
         switch (this.config.postion) {
@@ -195,5 +185,5 @@ case 'l':
             case 't':
-                return (this.layout.w - this.cols * this.config.width) / 2 + cidx * this.config.width + "," + this.config.height * ridx;
+                return (this.layout.w - this.cols * this.config.width) / 2 + cidx * this.config.width + ", " + this.config.height * ridx;
             case 'b':
-                return (this.layout.w - this.cols * this.config.width) / 2 + cidx * this.config.width + "," + this.config.height * ridx;
+                return (this.layout.w - this.cols * this.config.width) / 2 + cidx * this.config.width + ", " + this.config.height * ridx;
             case 'lt':
@@ -200,0 +190,0 @@ return this.config.width * cidx + " ," + ridx * this.config.height + " ";

_Common/Legends/Types/LabelLegend.js

@@ -110,3 +110,4 @@ "use strict";
         var enter = legends
-            .enter().append('g')
+            .enter()
+            .append('g')
             .attr('class', function (d) { return '_legend_item _legend_item_enable _legend_item_' + d.idx; });
@@ -113,0 +114,0 @@ enter.attr('transform', function (d, i) { return "translate(" + _this.getStart(i) + " )"; })

_Common/Visual.d.ts

@@ -34,2 +34,3 @@ import * as d3 from 'd3';
     private _loaded;
+    private _resizePid;
     constructor(selector: string, conf: T);
@@ -36,0 +37,0 @@ private draw;

_Common/Visual.js

@@ -24,2 +24,3 @@ "use strict";
 var Legends_1 = require("./Legends");
+// alert(1);
 var default_1 = /** @class */ (function () {
@@ -74,2 +75,3 @@ function default_1(selector, conf) {
         this._loaded = false;
+        this._resizePid = 0;
         this.props = conf;
@@ -89,5 +91,13 @@ // Fix bug from constructor syntax delay
         window.addEventListener('resize', function () {
-            if (_this._needResize()) {
-                _this.draw();
-            }
+            console.log('set PID REIZE');
+            window.clearTimeout(_this._resizePid);
+            _this._resizePid = window.setTimeout(function () {
+                if (_this._needResize()) {
+                    _this.SVG.attr('width', _this.WIDTH).attr('height', _this.HEIGHT);
+                    _this.draw();
+                }
+                else {
+                    // console.log('no need resie')
+                }
+            }, 600);
         });
@@ -94,0 +104,0 @@ }

Bars/interface.d.ts

@@ -34,2 +34,6 @@ import { VisualOpts } from '../interface';
     /**
+     * 最小高度,默认为0
+    */
+    minHieght?: number;
+    /**
      * 是否在顶上显示数量，默认为FALSE
@@ -36,0 +40,0 @@ */

interface.d.ts

@@ -68,4 +68,7 @@ /**
      * 轴标量的描述，默认为空，一般只有Y轴才有描述，用来显示量，默认是300
+     *
+     * 1: 仅传number, 则为旋转角度，默认为300
+     * 2: 同时传3个number 代码 [x坐标偏移量, y坐标偏移量, 旋转角度] , 默认为 [6,-3,300]
     */
-    labelRotate?: number;
+    labelRotate?: number | [number, number, number];
     /**
@@ -72,0 +75,0 @@ * 轴宽度，默认为80，一般只有Y轴才有宽度，用来显示数字

package.json

 {
   "name": "vap-visual",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "vap-visual - A Visual FrameWork base on  d3 & lodash",
@@ -5,0 +5,0 @@ "main": "index.js",

Pies/Pie/index.js

@@ -71,10 +71,10 @@ "use strict";
     default_1.prototype.sort = function (arr) {
-        var _a, _b;
+        var _a;
         var _this = this;
         this.current = 0;
-        console.log(arr);
+        // console.log(arr) 
         if (arr.length == 0) {
             this.DATA_MODE = 0 /* NONE */;
-            console.log([(_a = {}, _a[this.props.labelField] = '无数据', _a[this.props.valueField] = 0, _a._count = 1, _a._idx = 0, _a)]);
-            return [(_b = {}, _b[this.props.labelField] = '无数据', _b[this.props.valueField] = 0, _b._count = 1, _b._idx = 0, _b)];
+            // console.log([{ [this.props.labelField]: '无数据', [this.props.valueField]: 0, _count: 1, _idx: 0 }]);
+            return [(_a = {}, _a[this.props.labelField] = '无数据', _a[this.props.valueField] = 0, _a._count = 1, _a._idx = 0, _a)];
         }
@@ -81,0 +81,0 @@ var sum = _.sumBy(arr, this.props.valueField);

topojson/CombineMap/_Bars.d.ts

@@ -1,1 +0,17 @@
-export {};
+import * as d3 from 'd3';
+import { CombineMapOpts } from '../interface';
+import GeoUtil from '../_GeoUtil';
+export default class {
+    private SVG;
+    private props;
+    private projection;
+    private GEO;
+    private itemWidth;
+    private maxHeight;
+    private minHeight;
+    private labelFormat;
+    private valueFormat;
+    constructor(conf: CombineMapOpts, svg: d3.Selection<any, any, any, any>, projection: any, geo: GeoUtil);
+    setData(arr: any): void;
+    resize(projection: any): void;
+}

topojson/CombineMap/_Bars.js

 "use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+var d3 = require("d3");
+var _ = require("lodash");
+var _Common_1 = require("../../_Common");
+var util_1 = require("../../util");
+var default_1 = /** @class */ (function () {
+    function default_1(conf, svg, projection, geo) {
+        this.SVG = null;
+        this.props = null;
+        this.projection = null;
+        this.GEO = null;
+        this.itemWidth = 12;
+        this.maxHeight = 64;
+        this.minHeight = 8;
+        this.labelFormat = function (v) { return v; };
+        this.valueFormat = function (v) { return v; };
+        this.SVG = svg;
+        this.GEO = geo;
+        this.props = conf;
+        this.projection = projection;
+        if (this.props.barConf.itemWidth) {
+            this.itemWidth = this.props.barConf.itemWidth;
+        }
+        if (this.props.barConf.minHeight) {
+            this.minHeight = this.props.barConf.minHeight;
+        }
+        if (this.props.barConf.maxHeight) {
+            this.maxHeight = this.props.barConf.maxHeight;
+        }
+        if (this.props.barConf.onClick) {
+            this.SVG.classed('bars-clickable', true);
+        }
+        if (this.props.barConf.labelFormat) {
+            this.labelFormat = this.props.barConf.labelFormat;
+        }
+        else if (this.props.labelFormat) {
+            this.labelFormat = this.props.labelFormat;
+        }
+        if (this.props.barConf.valueFormat) {
+            this.valueFormat = util_1.default.buildFormat(this.props.lineConf.valueFormat);
+        }
+        else if (this.props.valueFormat) {
+            this.valueFormat = util_1.default.buildFormat(this.props.valueFormat);
+        }
+    }
+    //添加一个区域到另外一个区域的线条组
+    default_1.prototype.setData = function (arr) {
+        var _this = this;
+        var _a = this.props.barConf, labelField = _a.labelField, valueField = _a.valueField, valueLabel = _a.valueLabel;
+        var data = _.filter(arr, function (item) { return _this.GEO.has(_this.labelFormat(item[labelField])); });
+        var _b = __read(util_1.default.extent(data, function (item) { return item[valueField]; }), 2), min = _b[0], max = _b[1];
+        // console.log(min, max)
+        var bars = this.SVG.selectAll('g.group-bars')
+            .data(data, function (item) { return item[labelField]; });
+        bars.exit().remove();
+        var enter = bars.enter().append('g').attr('class', 'group-bars');
+        enter.attr('transform', function (d, i) {
+            var source = _this.GEO.getPoint(_this.labelFormat(d[labelField]));
+            var pos = _this.projection(source);
+            return "translate(" + (pos[0] - _this.itemWidth / 2) + "," + pos[1] + ")";
+        });
+        var heightScale = d3.scaleLinear().domain([min / 2, max]).range([this.minHeight, this.maxHeight]);
+        enter.append('rect')
+            .attr('x', 0)
+            .attr('y', 0)
+            .attr('width', this.itemWidth)
+            .attr('height', 0)
+            .transition()
+            .duration(2222)
+            .attr('y', function (d) { return -heightScale(d[valueField]); })
+            .attr('height', function (d) { return heightScale(d[valueField]); });
+        enter.on('mouseover', function (d) {
+            _Common_1.ToolTip.show("<h2>" + _this.GEO.translate(_this.labelFormat(d[labelField])) + "</h2>\n                <p class=\"_item\"><span class=\"_label\">" + valueLabel + "</span> : <span class=\"_value\">" + _this.valueFormat(d[valueField]) + "</span> </p>");
+        });
+        enter.on('mouseout', function () { return _Common_1.ToolTip.hide(); });
+        if (this.props.barConf.onClick) {
+            enter.on('click', function (d) { return _this.props.barConf.onClick(d); });
+        }
+    };
+    default_1.prototype.resize = function (projection) {
+        this.projection = projection;
+        //     Config.GLOBAL_SVG.selectAll('g.v-group-line path').attr('d', function (d) {
+        //         var from = Config.GLOBAL_PROJECTION(Config.GLOBAL_BUILDER.getPoint(d.from));
+        //         var to = Config.GLOBAL_PROJECTION(Config.GLOBAL_BUILDER.getPoint(d.to));
+        //         var data = [
+        //             from, [from[0] + (to[0] - from[0]) / 4, from[1] + (to[1] - from[1]) / 2],
+        //             [from[0] + (to[0] - from[0]) * 3 / 4, to[1]],
+        //             to
+        //         ];
+        //         return line(data);
+        //     });
+    };
+    return default_1;
+}());
+exports.default = default_1;

topojson/CombineMap/_Lines.js

@@ -30,3 +30,3 @@ "use strict";
         }
-        if (this.props.lineConf.valueField) {
+        if (this.props.lineConf.valueFormat) {
             this.valueFormat = util_1.default.buildFormat(this.props.lineConf.valueFormat);
@@ -104,4 +104,4 @@ }
         enter.on('mouseout', function () { return _Common_1.ToolTip.hide(); });
-        if (this.props.onClick) {
-            enter.on('click', function (d) { return _this.props.onClick(d); });
+        if (this.props.lineConf.onClick) {
+            enter.on('click', function (d) { return _this.props.lineConf.onClick(d); });
         }
@@ -108,0 +108,0 @@ };

topojson/CombineMap/_Pies.js

@@ -1,1 +0,55 @@
-// 地图上面出现的饼图
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var util_1 = require("../../util");
+var default_1 = /** @class */ (function () {
+    function default_1(conf, svg, projection, geo) {
+        this.SVG = null;
+        this.props = null;
+        this.projection = null;
+        this.GEO = null;
+        this.radius = 24;
+        this.labelFormat = function (v) { return v; };
+        this.valueFormat = function (v) { return v; };
+        this.SVG = svg;
+        this.GEO = geo;
+        this.props = conf;
+        this.projection = projection;
+        if (this.props.pieConf.radius) {
+            this.radius = this.props.pieConf.radius;
+        }
+        if (this.props.pieConf.onClick) {
+            this.SVG.classed('pies-clickable', true);
+        }
+        if (this.props.pieConf.labelFormat) {
+            this.labelFormat = this.props.pieConf.labelFormat;
+        }
+        else if (this.props.labelFormat) {
+            this.labelFormat = this.props.labelFormat;
+        }
+        if (this.props.pieConf.valueFormat) {
+            this.valueFormat = util_1.default.buildFormat(this.props.lineConf.valueFormat);
+        }
+        else if (this.props.valueFormat) {
+            this.valueFormat = util_1.default.buildFormat(this.props.valueFormat);
+        }
+    }
+    //添加一个区域到另外一个区域的线条组
+    default_1.prototype.setData = function (arr) {
+        var _a = this.props.pieConf, labelField = _a.labelField, valueField = _a.valueField, valueLabel = _a.valueLabel;
+    };
+    default_1.prototype.resize = function (projection) {
+        this.projection = projection;
+        //     Config.GLOBAL_SVG.selectAll('g.v-group-line path').attr('d', function (d) {
+        //         var from = Config.GLOBAL_PROJECTION(Config.GLOBAL_BUILDER.getPoint(d.from));
+        //         var to = Config.GLOBAL_PROJECTION(Config.GLOBAL_BUILDER.getPoint(d.to));
+        //         var data = [
+        //             from, [from[0] + (to[0] - from[0]) / 4, from[1] + (to[1] - from[1]) / 2],
+        //             [from[0] + (to[0] - from[0]) * 3 / 4, to[1]],
+        //             to
+        //         ];
+        //         return line(data);
+        //     });
+    };
+    return default_1;
+}());
+exports.default = default_1;

topojson/CombineMap/index.d.ts

@@ -5,2 +5,4 @@ import SimpleMap from '../SimpleMap';
     private lines;
+    private bars;
+    private pies;
     init(): void;
@@ -10,4 +12,4 @@ __need_rebuild: string[];
     updateLine(): void;
+    updateBar(): void;
     updatePie(): void;
-    updateBar(): void;
 }

topojson/CombineMap/index.js

@@ -18,27 +18,13 @@ "use strict";
 var _Lines_1 = require("./_Lines");
+var _Bars_1 = require("./_Bars");
+var _Pies_1 = require("./_Pies");
 var SimpleMap_1 = require("../SimpleMap");
 var util_1 = require("../../util");
-// const validate = function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
-//     // 保存原来的方法
-//     let method = descriptor.value;
-//     // 重写原来的方法
-//     descriptor.value = function (newValue: string) {
-//       // 检查是否是空字符串
-//       if (!newValue) {
-//         throw Error('name is invalid')
-//       } else {
-//         // 否则调用原来的方法
-//         method.call(this, newValue)
-//       }
-//     }
-//   }
 var default_1 = /** @class */ (function (_super) {
     __extends(default_1, _super);
     function default_1() {
-        // private LINES: d3.Selection<any, any, any, any> = null;
-        // private PLOTS: d3.Selection<any, any, any, any> = null;
-        // private BARS: d3.Selection<any, any, any, any> = null;
-        // private PIES: d3.Selection<any, any, any, any> = null;
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.lines = null;
+        _this.bars = null;
+        _this.pies = null;
         _this.__need_rebuild = ['fillStyle', 'mapPath', 'showName', 'rotate'];
@@ -55,6 +41,15 @@ return _this;
         }
+        if (_.has(this.props, 'barConf')) {
+            var barContainer = this.EXT_BOTTOM.append('g').attr('class', 'bars');
+            this.bars = new _Bars_1.default(this.props, barContainer, this.projection, this.GEO);
+            this.updateBar();
+        }
+        if (_.has(this.props, 'pieConf')) {
+            var pieContainer = this.EXT_BOTTOM.append('g').attr('class', 'pies');
+            this.pies = new _Pies_1.default(this.props, pieContainer, this.projection, this.GEO);
+            this.updatePie();
+        }
     };
     default_1.prototype.setOption = function (conf) {
         var _this = this;
-        // console.log('statrt set')
         var needRebuid = false;
@@ -78,15 +73,14 @@ this.__need_rebuild.map(function (key) {
         }
-        // console.log('statrt set2')
         if (util_1.default.isEqArray(this.props.data, conf.data)) {
-            // console.log('statrt set5')
             this.props = _.extend(this.props, conf);
             this.update(this.sort(conf.data));
         }
-        // console.log('statrt set3')
         if (util_1.default.isEqArray(this.props.lineData, conf.lineData)) {
-            // console.log('statrt set4')
-            // console.log(conf.lineData)
             this.props = _.extend(this.props, conf);
             this.updateLine();
         }
+        if (util_1.default.isEqArray(this.props.barData, conf.barData)) {
+            this.props = _.extend(this.props, conf);
+            this.updateBar();
+        }
     };
@@ -98,14 +92,14 @@ default_1.prototype.updateLine = function () {
     };
+    default_1.prototype.updateBar = function () {
+        if (this.bars != null) {
+            this.bars.setData(this.props.barData);
+        }
+    };
     default_1.prototype.updatePie = function () {
-        // if (this.lines != null) {
-        // this.lines.setData(this.props.lineData)
-        // }
+        if (this.pies != null) {
+            this.pies.setData(this.props.pieData);
+        }
     };
-    default_1.prototype.updateBar = function () {
-        // if (this.lines != null) {
-        // this.lines.setData(this.props.lineData)
-        // }
-    };
     return default_1;
 }(SimpleMap_1.default));
 exports.default = default_1;

topojson/GeoVisual.d.ts

@@ -31,2 +31,3 @@ import * as d3 from 'd3';
     protected selectedItem: string;
+    private _resizePid;
     constructor(selector: string, conf: T);
@@ -33,0 +34,0 @@ protected pathToUrl(mapPath: string): string;

topojson/GeoVisual.js

@@ -60,3 +60,2 @@ "use strict";
 var storage = window.localStorage;
-var resizePid = 0;
 var default_1 = /** @class */ (function () {
@@ -95,2 +94,3 @@ function default_1(selector, conf) {
         this.selectedItem = null;
+        this._resizePid = 0;
         this.props = conf;
@@ -105,6 +105,6 @@ // Fix bug from constructor syntax delay
         window.addEventListener('resize', function () {
-            window.clearTimeout(resizePid);
-            resizePid = window.setTimeout(function () {
-                // console.log('xxx')
+            window.clearTimeout(_this._resizePid);
+            _this._resizePid = window.setTimeout(function () {
                 if (_this._needResize()) {
+                    _this.SVG.attr('width', _this.WIDTH).attr('height', _this.HEIGHT);
                     _this.setProjection();
@@ -246,3 +246,2 @@ _this.resize();
         var height = Math.floor(rootNode.offsetHeight);
-        // console.log(this.WIDTH, width, this.HEIGHT, height)
         if (force || this.WIDTH != width || this.HEIGHT != height) {
@@ -306,7 +305,3 @@ this.WIDTH = width;
         });
-        // console.log('Diff Result ', isDiff)
         if (!isDiff) {
-            // if (isDiffData) {
-            //     this.setData(conf.data)
-            // }
             return;
@@ -313,0 +308,0 @@ }

topojson/interface.d.ts

@@ -149,15 +149,132 @@ import { VALUE_FORMAT, Grid } from '../interface';
  * */
-export declare type MAP_LINE = {
+export declare type MAP_LINE_CONF = {
+    /**
+     * 源区域的字段
+    */
     sourceField: string;
+    /**
+     * 目标区域的字段
+    */
     targetField: string;
+    /**
+     * 转化为地名的方法
+     * 1. 如果不传，则为地图本身的 labelFormat
+     * 2. 如果地图本身也没有 labelFormat ,则为 value => value
+    */
     labelFormat?: (string: any) => string;
+    /**
+     * 取值的字段
+    */
     valueField: string;
+    /**
+     * 取值的字段描述
+    */
     valueLabel: string;
+    /**
+     * 取值的格式化方法
+    */
     valueFormat?: VALUE_FORMAT;
+    /**
+     * 点击
+    */
     onClick?: Function;
     tip?: (d: any) => string;
+    /**
+     * 速度
+    */
     speed?: number;
+    /**
+     * 线条类型，暂时支持 FLY
+    */
     lineType?: 'fly';
 };
 /**
+ * 地图上的柱状图
+ * */
+export declare type MAP_BAR_CONF = {
+    /**
+     * Label 地区字段
+    */
+    labelField: string;
+    /**
+     * 转化为地名的方法
+     * 1. 如果不传，则为地图本身的 labelFormat
+     * 2. 如果地图本身也没有 labelFormat ,则为 value => value
+    */
+    labelFormat?: (string: any) => string;
+    /**
+     * 取值的字段
+    */
+    valueField: string;
+    /**
+     * 取值的字段描述
+    */
+    valueLabel: string;
+    /**
+     * 取值的格式化方法
+    */
+    valueFormat?: VALUE_FORMAT;
+    /**
+     * 宽度，默认12
+    */
+    itemWidth?: number;
+    /**
+     * 最小高度，默认为8
+    */
+    minHeight?: number;
+    /**
+     * 最大高度，默认为80
+    */
+    maxHeight?: number;
+    /**
+     * 点击
+    */
+    onClick?: Function;
+    /**
+     * 提示
+    */
+    tip?: (d: any) => string;
+};
+/**
+ * 地图上的散点
+ * */
+declare type MAP_PIE_CONF = {
+    /**
+     * Label 地区字段
+    */
+    labelField: string;
+    /**
+     * 转化为地名的方法
+     * 1. 如果不传，则为地图本身的 labelFormat
+     * 2. 如果地图本身也没有 labelFormat ,则为 value => value
+    */
+    labelFormat?: (string: any) => string;
+    /**
+     * 取值的字段
+     * 说明：由于地图本身就很小了，所以这里最多只支持4项
+     * 超过4项，的，仅取前4项
+    */
+    valueField: string[];
+    /**
+     * Pie的半径，默认为24
+    */
+    radius?: number;
+    /**
+     * 取值的字段描述
+    */
+    valueLabel: string[];
+    /**
+     * 取值的格式化方法
+    */
+    valueFormat?: VALUE_FORMAT;
+    /**
+     * 提示
+    */
+    tip?: (d: any) => string;
+    /**
+     * 点击
+    */
+    onClick?: Function;
+};
+/**
  * 说明
@@ -173,3 +290,3 @@ * 1. 由于geojson格式是开放的，本地图仅支持普遍的标准，即在  properties 中，包括 {id,name} 属性的，如果包括 {cp} 属性，将使用cp ,不包括，将使用center 方法计算
     */
-    lineConf?: MAP_LINE;
+    lineConf?: MAP_LINE_CONF;
     /**
@@ -179,8 +296,21 @@ * 连线数据
     lineData?: any[];
+    /**
+     * 条形配置
+    */
+    barConf?: MAP_BAR_CONF;
+    /**
+     * 条形数据
+    */
+    barData?: any[];
+    /**
+     * PIE配置
+    */
+    pieConf?: MAP_PIE_CONF;
+    /**
+     * PIE数据
+    */
+    pieData?: [];
     plotConf?: [];
     plotData?: [];
-    pieConf?: [];
-    pieData?: [];
-    barConf?: [];
-    barData?: [];
 }
+export {};

topojson/SimpleMap/index.js

@@ -73,3 +73,2 @@ "use strict";
         this.ROOT.classed('_map_show_name', this.props.showName);
-        console.log(this.GEO.data().features);
         var areas = this.ROOT.selectAll('g._item').data(_.concat(this.GEO.data().features, this.props.extIcons));
@@ -76,0 +75,0 @@ this.GROUP = areas.enter()

util/data.js

@@ -49,2 +49,5 @@ "use strict";
     if (fix === void 0) { fix = true; }
+    if (data.length == 0) {
+        return [0, 1];
+    }
     var _a = __read(d3.extent(data, fn), 2), min = _a[0], max = _a[1];
@@ -51,0 +54,0 @@ min = (min === undefined ? 0 : min);

No alert changes

Improved metrics

Total package byte prevSize

403955

increased by3.77%

Number of package files

159

increased by3.92%

Lines of code

9930

increased by4.66%

No dependency changes