@naivemap/mapbox-gl-echarts-layer/dist/js/index.js

Integrate the Lines graph and Scatter (bubble) chart of Apache ECharts.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var echarts_1 = require("echarts");
var COORDINATE_SYSTEM_NAME = 'mapboxgl-echarts';
var CoordinateSystem = /** @class */ (function () {
    function CoordinateSystem(id, map) {
        this.dimensions = ['x', 'y'];
        this._mapOffset = [0, 0];
        this.id = id;
        this._map = map;
    }
    CoordinateSystem.prototype.create = function (ecModel) {
        var _this = this;
        ecModel.eachSeries(function (seriesModel) {
            if (seriesModel.get('coordinateSystem') === _this.id) {
                seriesModel.coordinateSystem = new CoordinateSystem(_this.id, _this._map);
            }
        });
    };
    CoordinateSystem.prototype.dataToPoint = function (data) {
        var px = this._map.project(data);
        var mapOffset = this._mapOffset;
        return [px.x - mapOffset[0], px.y - mapOffset[1]];
    };
    CoordinateSystem.prototype.pointToData = function (pt) {
        var mapOffset = this._mapOffset;
        var data = this._map.unproject([pt[0] + mapOffset[0], pt[1] + mapOffset[1]]);
        return [data.lng, data.lat];
    };
    return CoordinateSystem;
}());
var EChartsLayer = /** @class */ (function () {
    function EChartsLayer(id, ecOption) {
        this.id = id;
        this.type = 'custom';
        this.renderingMode = '2d';
        this._coordSystemName = COORDINATE_SYSTEM_NAME + '-' + Math.random().toString(16).substring(2);
        this._ecOption = ecOption;
    }
    EChartsLayer.prototype.onAdd = function (map) {
        this._map = map;
        this._createLayerContainer();
        if (!(0, echarts_1.getCoordinateSystemDimensions)(this._coordSystemName)) {
            var coordinateSystem = new CoordinateSystem(this._coordSystemName, this._map);
            (0, echarts_1.registerCoordinateSystem)(this._coordSystemName, coordinateSystem);
        }
    };
    EChartsLayer.prototype.onRemove = function () {
        var _a;
        (_a = this._ec) === null || _a === void 0 ? void 0 : _a.dispose();
        this._removeLayerContainer();
    };
    EChartsLayer.prototype.setOption = function (option) {
        var _a;
        (_a = this._ec) === null || _a === void 0 ? void 0 : _a.setOption(option);
    };
    EChartsLayer.prototype.render = function () {
        if (!this._container) {
            this._createLayerContainer();
        }
        if (!this._ec) {
            this._ec = (0, echarts_1.init)(this._container);
            this._prepareECharts();
            this._ec.setOption(this._ecOption);
        }
        else {
            if (this._map.isMoving()) {
                this._ec.clear();
            }
            else {
                this._ec.resize({
                    width: this._map.getCanvas().width,
                    height: this._map.getCanvas().height,
                });
                this._ec.setOption(this._ecOption);
            }
        }
    };
    EChartsLayer.prototype._prepareECharts = function () {
        var series = this._ecOption.series;
        if (series) {
            for (var i = series.length - 1; i >= 0; i--) {
                // change coordinateSystem to mapboxgl-echarts
                series[i]['coordinateSystem'] = this._coordSystemName;
                // disable update animations
                // series[i]['animation'] = false
            }
        }
    };
    EChartsLayer.prototype._createLayerContainer = function () {
        var mapContainer = this._map.getCanvasContainer();
        this._container = document.createElement('div');
        this._container.style.width = this._map.getCanvas().style.width;
        this._container.style.height = this._map.getCanvas().style.height;
        mapContainer.appendChild(this._container);
    };
    EChartsLayer.prototype._removeLayerContainer = function () {
        var _a;
        if (this._container) {
            (_a = this._container.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(this._container);
        }
    };
    return EChartsLayer;
}());
exports.default = EChartsLayer;