@@ -64725,6 +64725,7 @@ external_ol_default.a.supermap.Util = core_Util_Util;
64725
64725
64726
64726
64727
64727
external_ol_default.a.supermap = external_ol_default.a.supermap || {};
64728
+ var padding = 8, doublePadding = padding*2;
64728
64729
64729
64730
/**
64730
64731
* @class ol.supermap.StyleUtils
@@ -65362,22 +65363,215 @@ class StyleUtils_StyleUtils {
65362
65363
lineDash: this.dashStyle(style, 1)
65363
65364
});
65364
65365
olStyle.setStroke(newStroke);
65365
- } else {
65366
+ } else if(type === 'POLYGON' ||
65367
+ type === 'MULTIPOLYGON'){
65366
65368
newFill = new external_ol_default.a.style.Fill({
65367
65369
color: fillColorArray
65368
65370
});
65369
65371
newStroke = new external_ol_default.a.style.Stroke({
65370
65372
width: strokeWidth || ZERO,
65371
65373
color: strokeColorArray,
65372
65374
lineCap: lineCap || 'round',
65373
- lineDash: this.dashStyle(style, 1)
65375
+ lineDash:this.dashStyle(style, 1)
65374
65376
});
65375
65377
olStyle.setFill(newFill);
65376
65378
olStyle.setStroke(newStroke);
65379
+ } else {
65380
+ let result = this.getCanvas(style);
65381
+ newImage = new external_ol_default.a.style.Icon({
65382
+ img: result.canvas,
65383
+ imgSize:[result.width,result.height],
65384
+ scale: 1,
65385
+ anchor : [0.5, 0.5]
65386
+ });
65387
+ olStyle.setImage(newImage);
65377
65388
}
65378
65389
return olStyle;
65379
65390
}
65380
65391
65392
+ /**
65393
+ * 获取文字标注对应的canvas
65394
+ * @param style
65395
+ * @returns {{canvas: *, width: number, height: number}}
65396
+ */
65397
+ static getCanvas(style) {
65398
+ let canvas;
65399
+ if(style.canvas) {
65400
+ if(document.querySelector("#"+style.canvas)) {
65401
+ canvas = document.getElemntById(style.canvas);
65402
+ } else {
65403
+ canvas = this.createCanvas(style);
65404
+ }
65405
+ } else {
65406
+ //不存在canvas,当前feature
65407
+ canvas = this.createCanvas(style);
65408
+ style.canvas = canvas.id;
65409
+ }
65410
+ canvas.style.display = "none";
65411
+ var ctx = canvas.getContext("2d");
65412
+ //行高
65413
+ let lineHeight = Number(style.font.replace(/[^0-9]/ig,""));
65414
+ let textArray = style.text.split('\r\n');
65415
+ let lenght = textArray.length;
65416
+ //在改变canvas大小后再绘制。否则会被清除
65417
+ ctx.font = style.font;
65418
+ let size = this.drawRect(ctx, style, textArray, lineHeight, canvas);
65419
+ this.positionY = padding;
65420
+ if(lenght > 1) {
65421
+ textArray.forEach(function (text, i) {
65422
+ if(i !== 0) {
65423
+ this.positionY = this.positionY + lineHeight;
65424
+ }
65425
+ this.canvasTextAutoLine(text,style,ctx,lineHeight, size.width);
65426
+ }, this);
65427
+ } else {
65428
+ this.canvasTextAutoLine(textArray[0],style,ctx,lineHeight, size.width);
65429
+ }
65430
+ return {
65431
+ canvas: canvas,
65432
+ width: size.width,
65433
+ height: size.height
65434
+ };
65435
+ }
65436
+ /**
65437
+ * 创建当前feature对应的canvas
65438
+ * @param style {object}
65439
+ * @returns {HTMLElement}
65440
+ */
65441
+ static createCanvas(style) {
65442
+ let div = document.createElement('div');
65443
+ document.body.appendChild(div);
65444
+ let canvas = document.createElement('canvas');
65445
+ canvas.id = style.canvas ? style.canvas : 'textCanvas' + core_Util_Util.newGuid(8);
65446
+ div.appendChild(canvas);
65447
+ return canvas;
65448
+ }
65449
+ /**
65450
+ * 绘制矩形边框背景
65451
+ * @param ctx
65452
+ * @param style
65453
+ * @param textArray
65454
+ * @param lineHeight
65455
+ * @param canvas
65456
+ * @returns {{width: number, height: number}}
65457
+ */
65458
+ static drawRect(ctx, style, textArray, lineHeight, canvas) {
65459
+ let backgroundFill = style.backgroundFill, maxWidth = style.maxWidth - doublePadding;
65460
+ let width, height = 0, lineCount=0, lineWidths = [];
65461
+ //100的宽度,去掉左右两边3padding
65462
+ textArray.forEach(function (arrText) {
65463
+ let line='', isOverMax;
65464
+ lineCount++;
65465
+ for (var n = 0; n < arrText.length; n++) {
65466
+ let textLine = line + arrText[n];
65467
+ let metrics = ctx.measureText(textLine);
65468
+ let textWidth = metrics.width;
65469
+ if ((textWidth > maxWidth && n > 0) || arrText[n] === '\n') {
65470
+ line = arrText[n];
65471
+ lineCount++;
65472
+ //有换行,记录当前换行的width
65473
+ isOverMax = true;
65474
+ } else {
65475
+ line = textLine;
65476
+ width = textWidth;
65477
+ }
65478
+ }
65479
+ if(isOverMax) {
65480
+ lineWidths.push(maxWidth);
65481
+ } else {
65482
+ lineWidths.push(width);
65483
+ }
65484
+ }, this);
65485
+ width = this.getCanvasWidth(lineWidths, maxWidth);
65486
+ height = lineCount * lineHeight;
65487
+ height += doublePadding;
65488
+ canvas.width = width;
65489
+ canvas.height = height;
65490
+ ctx.fillStyle = backgroundFill;
65491
+ ctx.fillRect(0,0,width,height);
65492
+ return {
65493
+ width: width,
65494
+ height: height
65495
+ }
65496
+ }
65497
+ /**
65498
+ * 获取自适应的宽度(如果没有超过最大宽度,就用文字的宽度)
65499
+ * @param lineWidths
65500
+ * @param maxWidth
65501
+ * @returns {number}
65502
+ */
65503
+ static getCanvasWidth(lineWidths, maxWidth) {
65504
+ let width = 0;
65505
+ for(let i=0; i< lineWidths.length; i++) {
65506
+ let lineW = lineWidths[i];
65507
+ if(lineW >= maxWidth) {
65508
+ //有任何一行超过最大高度,就用最大高度
65509
+ return maxWidth + doublePadding;
65510
+ } else if(lineW > width) {
65511
+ //自己换行,就要比较每行的最大宽度
65512
+ width = lineW;
65513
+ }
65514
+ }
65515
+ return width + doublePadding;
65516
+ }
65517
+ /**
65518
+ * 绘制文字,解决换行问题
65519
+ * @param text
65520
+ * @param style
65521
+ * @param ctx
65522
+ * @param lineHeight
65523
+ */
65524
+ static canvasTextAutoLine(text,style,ctx,lineHeight, canvasWidth) {
65525
+ // 字符分隔为数组
65526
+ ctx.font = style.font;
65527
+ let textAlign = style.textAlign;
65528
+ let x = this.getPositionX(textAlign, canvasWidth);
65529
+ let arrText = text.split('');
65530
+ let line = '', fillColor = style.fillColor;
65531
+ //每一行限制的高度
65532
+ let maxWidth= style.maxWidth - doublePadding;
65533
+ for (var n = 0; n < arrText.length; n++) {
65534
+ let testLine = line + arrText[n];
65535
+ let metrics = ctx.measureText(testLine);
65536
+ let testWidth = metrics.width;
65537
+ if ((testWidth > maxWidth && n > 0) || arrText[n] === '\n') {
65538
+ ctx.fillStyle = fillColor;
65539
+ ctx.textAlign=textAlign;
65540
+ ctx.textBaseline="top";
65541
+ ctx.fillText(line, x, this.positionY);
65542
+ line = arrText[n];
65543
+ this.positionY += lineHeight;
65544
+ } else {
65545
+ line = testLine;
65546
+ }
65547
+ }
65548
+ ctx.fillStyle = fillColor;
65549
+ ctx.textAlign=textAlign;
65550
+ ctx.textBaseline="top";
65551
+ ctx.fillText(line, x, this.positionY);
65552
+ }
65553
+ /**
65554
+ * 得到绘制的起点位置,根据align不同,位置也不同
65555
+ * @param textAlign
65556
+ * @returns {number}
65557
+ */
65558
+ static getPositionX(textAlign, canvasWidth) {
65559
+ let x;
65560
+ let width = canvasWidth - doublePadding; //减去padding
65561
+ switch (textAlign) {
65562
+ case 'center':
65563
+ x = width / 2;
65564
+ break;
65565
+ case 'right':
65566
+ x = width;
65567
+ break;
65568
+ default:
65569
+ x = 8;
65570
+ break;
65571
+ }
65572
+ return x;
65573
+ }
65574
+
65381
65575
/**
65382
65576
* @function ol.supermap.StyleUtils.hexToRgb
65383
65577
* @description 将16进制的颜色,转换成rgb格式
@@ -66877,6 +67071,7 @@ const transformTools = new external_ol_default.a.format.GeoJSON();
66877
67071
* @param {function} [options.errorCallback] - 加载地图失败。
66878
67072
* @param {string} [options.credentialKey] - 凭证密钥。
66879
67073
* @param {string} [options.credentialValue] - 凭证值。
67074
+ * @param {boolean} [options.excludePortalProxyUrl] - server传递过来的url是否带有代理
66880
67075
* @param {function} [options.mapSetting.mapClickCallback] - 地图被点击的回调函数
66881
67076
* @extends {ol.Observable}
66882
67077
*/
@@ -66892,6 +67087,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
66892
67087
this.credentialKey = options.credentialKey;
66893
67088
this.credentialValue = options.credentialValue;
66894
67089
this.target = options.target || "map";
67090
+ this.excludePortalProxyUrl = options.excludePortalProxyUrl || false;
66895
67091
}
66896
67092
this.createMap(options.mapSetting);
66897
67093
this.createWebmap();
@@ -66935,13 +67131,23 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
66935
67131
* @description 创建webmap
66936
67132
*/
66937
67133
createWebmap() {
66938
- // let appUrl = this.mapUrl;
66939
67134
let mapUrl = core_Util_Util.getRootUrl(this.mapUrl) + 'web/maps/' + this.mapId + '/map';
66940
67135
if (this.credentialValue) {
66941
67136
mapUrl += ('.json?' + this.credentialKey + '=' + this.credentialValue);
66942
- // appUrl += ('.json?' + this.credentialKey + '=' + this.credentialValue);
67137
+
67138
+ }
67139
+ let filter = 'getUrlResource.json?url=';
67140
+ if(this.excludePortalProxyUrl && this.mapUrl.indexOf(filter) > -1) {
67141
+ //大屏需求,或者有加上代理的
67142
+ let urlArray = this.mapUrl.split(filter);
67143
+ if(urlArray.length > 1) {
67144
+ let url = urlArray[1];
67145
+ mapUrl = urlArray[0] + filter + core_Util_Util.getRootUrl(url) + 'web/maps/' + this.mapId + '/map.json';
67146
+ }
66943
67147
}
66944
67148
//todo 请求用户以及更新时间和地图标签等参数,暂时不需要
67149
+ // let appUrl = this.mapUrl;
67150
+ // appUrl += ('.json?' + this.credentialKey + '=' + this.credentialValue);
66945
67151
// this.getAppInfo(appUrl);
66946
67152
this.getMapInfo(mapUrl);
66947
67153
}
@@ -66976,7 +67182,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
66976
67182
that.addLayers(mapInfo);
66977
67183
}
66978
67184
}).catch(function (error) {
66979
- that.errorCallback && that.errorCallback(error, 'getMapFaild');
67185
+ that.errorCallback && that.errorCallback(error, 'getMapFaild', that.map );
66980
67186
});
66981
67187
}
66982
67188
/**
@@ -66989,7 +67195,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
66989
67195
this.createView(mapInfo);
66990
67196
let layer = this.createBaseLayer(mapInfo);
66991
67197
this.map.addLayer(layer);
66992
- if (mapInfo.baseLayer && mapInfo.baseLayer.lableLayerVisible ) {
67198
+ if (mapInfo.baseLayer && mapInfo.baseLayer.labelLayerVisible ) {
66993
67199
let layerInfo = mapInfo.baseLayer;
66994
67200
//存在天地图路网
66995
67201
let labelLayer = new external_ol_default.a.layer.Tile({
@@ -67089,16 +67295,26 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67089
67295
default:
67090
67296
break;
67091
67297
}
67092
- let layer = new external_ol_default.a.layer.Tile({
67298
+ var layer = new external_ol_default.a.layer.Tile({
67093
67299
source: source,
67094
67300
zIndex: layerInfo.zIndex || 0,
67095
67301
visible: layerInfo.visible
67096
67302
});
67303
+ var layerId = core_Util_Util.newGuid(8);
67097
67304
if (layerInfo.name) {
67098
67305
layer.setProperties({
67099
- name: layerInfo.name
67306
+ name: layerInfo.name,
67307
+ layerId: layerId
67100
67308
});
67101
67309
}
67310
+ if(!mapInfo.baseLayer) {
67311
+ //不是底图
67312
+ layer.setVisible(layerInfo.visible);
67313
+ layerInfo.opacity && layer.setOpacity(layerInfo.opacity);
67314
+ }
67315
+ //否则没有ID,对不上号
67316
+ layerInfo.layer = layer;
67317
+ layerInfo.layerId = layerId;
67102
67318
return layer;
67103
67319
}
67104
67320
/**
@@ -67296,7 +67512,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67296
67512
callback(layerInfo);
67297
67513
}
67298
67514
}).catch(function (error) {
67299
- that.errorCallback && that.errorCallback(error, 'getWmtsFaild')
67515
+ that.errorCallback && that.errorCallback(error, 'getWmtsFaild', that.map )
67300
67516
});
67301
67517
}
67302
67518
@@ -67447,6 +67663,13 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67447
67663
}).then(function (response) {
67448
67664
return response.json()
67449
67665
}).then(function (data) {
67666
+ if(!data.succeed === false) {
67667
+ //请求失败
67668
+ layerAdded++;
67669
+ that.sendMapToUser(layerAdded, len);
67670
+ that.errorCallback && that.errorCallback(data.error, 'getLayerFaild', that.map);
67671
+ return;
67672
+ }
67450
67673
if (data && data.type) {
67451
67674
if (data.type === "JSON" || data.type === "GEOJSON") {
67452
67675
data.content = JSON.parse(data.content);
@@ -67461,7 +67684,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67461
67684
}).catch(function (error) {
67462
67685
layerAdded++;
67463
67686
that.sendMapToUser(layerAdded, len);
67464
- that.errorCallback && that.errorCallback(error, 'getLayerFaild');
67687
+ that.errorCallback && that.errorCallback(error, 'getLayerFaild', that.map );
67465
67688
})
67466
67689
} else if (layer.layerType === 'SUPERMAP_REST' || layer.layerType === "TILE" ||
67467
67690
layer.layerType === "WMS" || layer.layerType === "WMTS") {
@@ -67496,7 +67719,7 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67496
67719
}, function (err) {
67497
67720
layerAdded++;
67498
67721
that.sendMapToUser(layerAdded, len);
67499
- that.errorCallback && that.errorCallback(err, 'getFeatureFaild')
67722
+ that.errorCallback && that.errorCallback(err, 'getFeatureFaild', that.map )
67500
67723
});
67501
67724
} else if (layer.dataSource.type === "REST_MAP" && layer.dataSource.url) {
67502
67725
core_Util_Util.queryFeatureBySQL(layer.dataSource.url, layer.dataSource.layerName, 'smid=1', null, null, function (result) {
@@ -67515,10 +67738,13 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67515
67738
that.addLayer(layer, features);
67516
67739
layerAdded++;
67517
67740
that.sendMapToUser(layerAdded, len);
67741
+ },function (e) {
67742
+ layerAdded++;
67743
+ that.errorCallback && that.errorCallback(e, 'getFeatureFaild', that.map);
67518
67744
});
67519
67745
}
67520
67746
}, function (e) {
67521
- that.errorCallback && that.errorCallback(e, 'getFeatureFaild');
67747
+ that.errorCallback && that.errorCallback(e, 'getFeatureFaild', that.map );
67522
67748
})
67523
67749
}
67524
67750
}, this);
@@ -67766,12 +67992,18 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67766
67992
} else if (layerInfo.layerType === "MARKER") {
67767
67993
layer = this.createMarkerLayer(layerInfo, features)
67768
67994
}
67995
+ let layerId = core_Util_Util.newGuid(8);
67769
67996
if (layer && layerInfo.name) {
67770
67997
layer.setProperties({
67771
- name: layerInfo.name
67998
+ name: layerInfo.name,
67999
+ layerId: layerId
67772
68000
});
67773
68001
}
67774
68002
layer && this.map.addLayer(layer);
68003
+ layerInfo.layer = layer;
68004
+ layerInfo.opacity && layer.setOpacity(layerInfo.opacity);
68005
+ layer.setVisible(layerInfo.visible);
68006
+ layerInfo.layerId = layerId;
67775
68007
if (layerInfo.labelStyle && layerInfo.labelStyle.labelField) {
67776
68008
//存在标签专题图
67777
68009
this.addLabelLayer(layerInfo, features);
@@ -67838,7 +68070,6 @@ class WebMap_WebMap extends external_ol_default.a.Observable {
67838
68070
isHighLight: false,
67839
68071
onClick: function () {}
67840
68072
});
67841
- source.refresh();
67842
68073
return new external_ol_default.a.layer.Image({
67843
68074
source: source
67844
68075
});
0 commit comments