|
|
@@ -153,7 +153,7 @@
|
|
|
pointStyle: {
|
|
|
width: 6,
|
|
|
height: 6,
|
|
|
- fillStyle:'rgba(0, 236, 252, 0.38)'
|
|
|
+ fillStyle:'rgba(0, 236, 252, 0.9)'
|
|
|
},
|
|
|
//鼠标hover时的title信息
|
|
|
hoverTitleStyle: {
|
|
|
@@ -202,23 +202,43 @@
|
|
|
|
|
|
labelCtx.save();
|
|
|
|
|
|
- labelCtx.font = 15 * pixelRatio + 'px 微软雅黑';
|
|
|
-
|
|
|
- var text = feature.properties.name ;//+ '\n' + dataItems.length;
|
|
|
-
|
|
|
+ labelCtx.font = 12 * pixelRatio + 'px 微软雅黑';
|
|
|
+
|
|
|
+ var name = feature.properties.name;
|
|
|
+ if(feature.properties.level == "province") {
|
|
|
+ if(name == "黑龙江省" || name == "内蒙古自治区"){
|
|
|
+ name = name.substring(0,3)
|
|
|
+ } else {
|
|
|
+ name = name.substring(0,2)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ var text = name;//feature.properties.name ;//+ '\n' + dataItems.length;
|
|
|
var textMetrics = labelCtx.measureText(text);
|
|
|
-
|
|
|
var halfTxtWidth = textMetrics.width / 2;
|
|
|
|
|
|
- labelCtx.beginPath();
|
|
|
+ var num = dataItems.length;
|
|
|
+ var numMetrics = labelCtx.measureText(num);
|
|
|
+ var halfNumWidth = numMetrics.width / 2;
|
|
|
+
|
|
|
// labelCtx.fillStyle = 'rgba(3 , 94 , 255 , 0.5)';//'#3366cc';
|
|
|
+
|
|
|
+ labelCtx.beginPath();
|
|
|
labelCtx.fillStyle = 'rgba(12 , 239 , 231 , 0.8)';//'#3366cc';
|
|
|
+
|
|
|
//绘制一个蓝色背景
|
|
|
- labelCtx.strokeStyle= "rgba(12 , 239 , 231 , 0.5)"
|
|
|
- labelCtx.fillStyle = 'rgba(12 , 239 , 231 , 0.5)';
|
|
|
- labelCtx.arc(centerX , centerY,
|
|
|
- (textMetrics.width + 6 * pixelRatio) / 2,
|
|
|
- 0*Math.PI,2*Math.PI,false);
|
|
|
+ labelCtx.strokeStyle= "rgba(12 , 239 , 231 , 0.8)"
|
|
|
+ labelCtx.fillStyle = 'rgba(12 , 239 , 231 , 0.8)';
|
|
|
+
|
|
|
+ var radius = 0;
|
|
|
+ if(textMetrics.width > numMetrics.width) {
|
|
|
+ radius = (textMetrics.width + 6 * pixelRatio) / 2;
|
|
|
+ } else {
|
|
|
+ radius = (numMetrics.width + 6 * pixelRatio) / 2;
|
|
|
+ }
|
|
|
+
|
|
|
+ labelCtx.arc(centerX , centerY, radius + 6,
|
|
|
+ 0*Math.PI, 2*Math.PI, false);
|
|
|
+
|
|
|
labelCtx.closePath();
|
|
|
labelCtx.fill();
|
|
|
// labelCtx.fillRect(centerX - halfTxtWidth - 3 * pixelRatio,
|
|
|
@@ -229,8 +249,10 @@
|
|
|
labelCtx.fillStyle = '#ffffff';
|
|
|
labelCtx.textBaseline = 'middle';
|
|
|
//labelCtx.stroke();
|
|
|
- labelCtx.fillText(text, centerX - halfTxtWidth, centerY);
|
|
|
- labelCtx.fillText(dataItems.length , centerX - 4, centerY + 15);
|
|
|
+
|
|
|
+ labelCtx.fillText(text, centerX - halfTxtWidth, centerY - 5);
|
|
|
+ labelCtx.fillText(num , centerX - halfNumWidth, centerY + 12);
|
|
|
+
|
|
|
labelCtx.stroke();
|
|
|
labelCtx.restore();
|
|
|
//}
|
