Skip to content

Commit 9f39ab9

Browse files
songyumengsongyumeng
committed
优化echarts实现，修复imagelayer显示在最下面的bug
1 parent 672d9d0 commit 9f39ab9

File tree

5 files changed

+74
-78
lines changed

5 files changed

+74
-78
lines changed

‎dist/iclient9-leaflet.js‎

Lines changed: 36 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -65623,7 +65623,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
6562365623
* @param echartsOptions - {Object} 图表参数
6562465624
* @param options - {Object} 可选图层参数。<br>
6562565625
* attribution - {string} 版权信息。<br>
65626-
* loadWhileAnimating - {boolean} 是否在移动时加载。
65626+
* loadWhileAnimating - {boolean} 是否在移动时实时绘制。默认为false。
6562765627
*/
6562865628
var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6562965629

@@ -65635,20 +65635,13 @@ var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6563565635

6563665636
options: {
6563765637
attribution: "© 2017 百度 ECharts with <span>© <a href='http://iclient.supermap.io/' target='_blank'>SuperMap iClient</a></span>",
65638-
loadWhileAnimating: true
65638+
loadWhileAnimating: false
6563965639
},
6564065640

6564165641
initialize: function initialize(echartsOptions, options) {
65642-
if (echartsOptions) {
65643-
echartsOptions.LeafletMap = {
65644-
roam: true
65645-
};
65646-
echartsOptions.animation = false;
65647-
}
65648-
this._echartsOptions = echartsOptions;
6564965642
_leaflet2["default"].Util.setOptions(this, options);
65643+
this.setOption(echartsOptions);
6565065644
},
65651-
6565265645
/**
6565365646
* @function L.supermap.echartsLayer.prototype.setOption
6565465647
* @description 设置图表地图参数
@@ -65657,15 +65650,17 @@ var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6565765650
* @param lazyUpdate - {string} 后台自动更新
6565865651
*/
6565965652
setOption: function setOption(echartsOptions, notMerge, lazyUpdate) {
65660-
if (echartsOptions) {
65661-
echartsOptions.LeafletMap = {
65662-
roam: true
65663-
};
65664-
}
65653+
var baseOption = echartsOptions.baseOption || echartsOptions;
65654+
baseOption.LeafletMap = baseOption.LeafletMap || {
65655+
roam: true
65656+
};
65657+
baseOption.animation = baseOption.animation === true;
6566565658
this._echartsOptions = echartsOptions;
65666-
this._ec.setOption(echartsOptions, notMerge, lazyUpdate);
65659+
this._ec && this._ec.setOption(echartsOptions, notMerge, lazyUpdate);
65660+
},
65661+
getEcharts: function getEcharts() {
65662+
return this._ec;
6566765663
},
65668-
6566965664
_disableEchartsContainer: function _disableEchartsContainer() {
6567065665
this._echartsContainer.style.visibility = "hidden";
6567165666
},
@@ -65688,7 +65683,7 @@ var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6568865683
map.on("zoomstart", function () {
6568965684
me._disableEchartsContainer();
6569065685
});
65691-
me.options.loadWhileAnimating && map.on("movestart", function () {
65686+
!me.options.loadWhileAnimating && map.on("movestart", function () {
6569265687
me._disableEchartsContainer();
6569365688
});
6569465689
_echarts2["default"].registerAction({
@@ -65733,14 +65728,13 @@ var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6573365728
var mapOffset = [offset.x || 0, offset.y || 0];
6573465729
viewportRoot.style.left = mapOffset[0] + 'px';
6573565730
viewportRoot.style.top = mapOffset[1] + 'px';
65736-
65737-
if (me.options.loadWhileAnimating) {
65738-
for (var item in ecLayers) {
65739-
if (!ecLayers.hasOwnProperty(item)) {
65740-
continue;
65741-
}
65742-
ecLayers[item] && clearContext(ecLayers[item].ctx);
65731+
for (var item in ecLayers) {
65732+
if (!ecLayers.hasOwnProperty(item)) {
65733+
continue;
6574365734
}
65735+
ecLayers[item] && clearContext(ecLayers[item].ctx);
65736+
}
65737+
if (!me.options.loadWhileAnimating) {
6574465738
me._enableEchartsContainer();
6574565739
}
6574665740

@@ -65814,11 +65808,11 @@ var EchartsLayer = exports.EchartsLayer = _leaflet2["default"].Layer.extend({
6581465808
* @class L.supermap.LeafletMapCoordSys
6581565809
* @private
6581665810
* @classdesc 地图坐标系统类
65817-
* @param LeafletMap - {L.map} 地图
65811+
* @param leafletMap - {L.map} 地图
6581865812
* @param api - {Object} 接口
6581965813
*/
65820-
function LeafletMapCoordSys(LeafletMap) {
65821-
this._LeafletMap = LeafletMap;
65814+
function LeafletMapCoordSys(leafletMap) {
65815+
this._LeafletMap = leafletMap;
6582265816
this.dimensions = ['lng', 'lat'];
6582365817
this._mapOffset = [0, 0];
6582465818
}
@@ -65906,20 +65900,23 @@ LeafletMapCoordSys.prototype.getRoamTransform = function () {
6590665900
};
6590765901
LeafletMapCoordSys.dimensions = LeafletMapCoordSys.prototype.dimensions;
6590865902

65909-
LeafletMapCoordSys.create = function (ecModel, api) {
65910-
var coordSys;
65903+
LeafletMapCoordSys.create = function (ecModel) {
65904+
var coordSys = void 0;
6591165905

65912-
ecModel.eachComponent('LeafletMap', function (LeafletMapModel) {
65913-
var leafletMap = _echarts2["default"].leafletMap;
65906+
ecModel.eachComponent('LeafletMap', function (leafletMapModel) {
6591465907
if (!coordSys) {
65915-
coordSys = new LeafletMapCoordSys(leafletMap, api);
65908+
coordSys = new LeafletMapCoordSys(_echarts2["default"].leafletMap);
6591665909
}
65917-
LeafletMapModel.coordinateSystem = coordSys || new LeafletMapCoordSys(_echarts2["default"].leafletMap);
65918-
LeafletMapModel.coordinateSystem.setMapOffset(LeafletMapModel.__mapOffset || [0, 0]);
65910+
leafletMapModel.coordinateSystem = coordSys;
65911+
leafletMapModel.coordinateSystem.setMapOffset(leafletMapModel.__mapOffset || [0, 0]);
6591965912
});
6592065913
ecModel.eachSeries(function (seriesModel) {
65921-
if (seriesModel.get('coordinateSystem') === 'leaflet') {
65922-
seriesModel.coordinateSystem = coordSys || new LeafletMapCoordSys(_echarts2["default"].leafletMap);
65914+
if (!seriesModel.get('coordinateSystem') || seriesModel.get('coordinateSystem') === 'leaflet') {
65915+
if (!coordSys) {
65916+
coordSys = new LeafletMapCoordSys(_echarts2["default"].leafletMap);
65917+
}
65918+
seriesModel.coordinateSystem = coordSys;
65919+
seriesModel.animation = seriesModel.animation === true;
6592365920
}
6592465921
});
6592565922
};
@@ -68070,7 +68067,8 @@ var ImageMapLayer = exports.ImageMapLayer = _leaflet.Layer.extend({
6807068067

6807168068
if (this.options.position === 'front') {
6807268069
this.bringToFront();
68073-
} else {
68070+
}
68071+
if (this.options.position === 'back') {
6807468072
this.bringToBack();
6807568073
}
6807668074

‎dist/iclient9-leaflet.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/include-leaflet.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
var excludes = (targetScript.getAttribute('exclude') || "").split(",");
3838
if (!inArray(excludes, 'leaflet')) {
3939
inputCSS("http://cdn.bootcss.com/leaflet/1.2.0/leaflet.css");
40-
inputScript("http://cdn.bootcss.com/leaflet/1.2.0/leaflet.js");
40+
inputScript("http://cdn.bootcss.com/leaflet/1.2.0/leaflet-src.js");
4141
}
4242
if (inArray(includes, 'mapv')) {
4343
inputScript("http://mapv.baidu.com/build/mapv.min.js");
@@ -61,7 +61,7 @@
6161
inputScript("http://cdn.bootcss.com/elasticsearch/13.0.1/elasticsearch.min.js");
6262
}
6363
if (!inArray(excludes, 'iclient9-leaflet')) {
64-
inputScript("../../dist/iclient9-leaflet.min.js");
64+
inputScript("../../dist/iclient9-leaflet.js");
6565
}
6666
if (inArray(includes, 'iclient9-leaflet-css')) {
6767
inputCSS("../../dist/iclient9-leaflet.min.css");

‎src/leaflet/mapping/ImageMapLayer.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -274,7 +274,8 @@ export var ImageMapLayer = Layer.extend({
274274

275275
if (this.options.position === 'front') {
276276
this.bringToFront();
277-
} else {
277+
}
278+
if (this.options.position === 'back') {
278279
this.bringToBack();
279280
}
280281

‎src/leaflet/overlay/EChartsLayer.js‎

Lines changed: 33 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import echarts from "echarts";
1010
* @param echartsOptions - {Object} 图表参数
1111
* @param options - {Object} 可选图层参数。<br>
1212
* attribution - {string} 版权信息。<br>
13-
* loadWhileAnimating - {boolean} 是否在移动时加载。
13+
* loadWhileAnimating - {boolean} 是否在移动时实时绘制。默认为false。
1414
*/
1515
export var EchartsLayer = L.Layer.extend({
1616

@@ -22,20 +22,13 @@ export var EchartsLayer = L.Layer.extend({
2222

2323
options: {
2424
attribution: "© 2017 百度 ECharts with <span>© <a href='http://iclient.supermap.io/' target='_blank'>SuperMap iClient</a></span>",
25-
loadWhileAnimating: true
25+
loadWhileAnimating: false
2626
},
2727

2828
initialize: function (echartsOptions, options) {
29-
if (echartsOptions) {
30-
echartsOptions.LeafletMap = {
31-
roam: true
32-
}
33-
echartsOptions.animation = false;
34-
}
35-
this._echartsOptions = echartsOptions;
3629
L.Util.setOptions(this, options);
30+
this.setOption(echartsOptions);
3731
},
38-
3932
/**
4033
* @function L.supermap.echartsLayer.prototype.setOption
4134
* @description 设置图表地图参数
@@ -44,15 +37,17 @@ export var EchartsLayer = L.Layer.extend({
4437
* @param lazyUpdate - {string} 后台自动更新
4538
*/
4639
setOption: function (echartsOptions, notMerge, lazyUpdate) {
47-
if (echartsOptions) {
48-
echartsOptions.LeafletMap = {
49-
roam: true
50-
}
40+
var baseOption = echartsOptions.baseOption || echartsOptions;
41+
baseOption.LeafletMap = baseOption.LeafletMap || {
42+
roam: true
5143
}
44+
baseOption.animation = baseOption.animation === true;
5245
this._echartsOptions = echartsOptions;
53-
this._ec.setOption(echartsOptions, notMerge, lazyUpdate);
46+
this._ec && this._ec.setOption(echartsOptions, notMerge, lazyUpdate);
47+
},
48+
getEcharts: function () {
49+
return this._ec;
5450
},
55-
5651
_disableEchartsContainer: function () {
5752
this._echartsContainer.style.visibility = "hidden";
5853
},
@@ -75,7 +70,7 @@ export var EchartsLayer = L.Layer.extend({
7570
map.on("zoomstart", function () {
7671
me._disableEchartsContainer();
7772
});
78-
me.options.loadWhileAnimating && map.on("movestart", function () {
73+
!me.options.loadWhileAnimating && map.on("movestart", function () {
7974
me._disableEchartsContainer();
8075
});
8176
echarts.registerAction({
@@ -122,14 +117,13 @@ export var EchartsLayer = L.Layer.extend({
122117
var mapOffset = [offset.x || 0, offset.y || 0];
123118
viewportRoot.style.left = mapOffset[0] + 'px';
124119
viewportRoot.style.top = mapOffset[1] + 'px';
125-
126-
if (me.options.loadWhileAnimating) {
127-
for (var item in ecLayers) {
128-
if (!ecLayers.hasOwnProperty(item)) {
129-
continue;
130-
}
131-
ecLayers[item] && clearContext(ecLayers[item].ctx);
120+
for (var item in ecLayers) {
121+
if (!ecLayers.hasOwnProperty(item)) {
122+
continue;
132123
}
124+
ecLayers[item] && clearContext(ecLayers[item].ctx);
125+
}
126+
if (!me.options.loadWhileAnimating) {
133127
me._enableEchartsContainer();
134128
}
135129

@@ -207,11 +201,11 @@ export var EchartsLayer = L.Layer.extend({
207201
* @class L.supermap.LeafletMapCoordSys
208202
* @private
209203
* @classdesc 地图坐标系统类
210-
* @param LeafletMap - {L.map} 地图
204+
* @param leafletMap - {L.map} 地图
211205
* @param api - {Object} 接口
212206
*/
213-
export function LeafletMapCoordSys(LeafletMap) {
214-
this._LeafletMap = LeafletMap;
207+
export function LeafletMapCoordSys(leafletMap) {
208+
this._LeafletMap = leafletMap;
215209
this.dimensions = ['lng', 'lat'];
216210
this._mapOffset = [0, 0];
217211
}
@@ -299,20 +293,23 @@ LeafletMapCoordSys.prototype.getRoamTransform = function () {
299293
};
300294
LeafletMapCoordSys.dimensions = LeafletMapCoordSys.prototype.dimensions;
301295

302-
LeafletMapCoordSys.create = function (ecModel, api) {
303-
var coordSys;
296+
LeafletMapCoordSys.create = function (ecModel) {
297+
let coordSys;
304298

305-
ecModel.eachComponent('LeafletMap', function (LeafletMapModel) {
306-
var leafletMap = echarts.leafletMap;
299+
ecModel.eachComponent('LeafletMap', function (leafletMapModel) {
307300
if (!coordSys) {
308-
coordSys = new LeafletMapCoordSys(leafletMap, api);
301+
coordSys = new LeafletMapCoordSys(echarts.leafletMap);
309302
}
310-
LeafletMapModel.coordinateSystem = coordSys || new LeafletMapCoordSys(echarts.leafletMap);
311-
LeafletMapModel.coordinateSystem.setMapOffset(LeafletMapModel.__mapOffset || [0, 0]);
303+
leafletMapModel.coordinateSystem = coordSys;
304+
leafletMapModel.coordinateSystem.setMapOffset(leafletMapModel.__mapOffset || [0, 0]);
312305
});
313306
ecModel.eachSeries(function (seriesModel) {
314-
if (seriesModel.get('coordinateSystem') === 'leaflet') {
315-
seriesModel.coordinateSystem = coordSys || new LeafletMapCoordSys(echarts.leafletMap);
307+
if (!seriesModel.get('coordinateSystem') || seriesModel.get('coordinateSystem') === 'leaflet') {
308+
if (!coordSys) {
309+
coordSys = new LeafletMapCoordSys(echarts.leafletMap);
310+
}
311+
seriesModel.coordinateSystem = coordSys;
312+
seriesModel.animation = seriesModel.animation === true;
316313
}
317314
})
318315
};

0 commit comments

Comments
 (0)