|
|
@@ -0,0 +1,96 @@
|
|
|
+<template>
|
|
|
+ <div id="allmap" style="height: 100%;width: 100%"></div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+
|
|
|
+var data = [];
|
|
|
+
|
|
|
+var citys = [
|
|
|
+ '北京',
|
|
|
+ '天津',
|
|
|
+ '上海',
|
|
|
+ '重庆',
|
|
|
+ '石家庄',
|
|
|
+ '太原',
|
|
|
+ '呼和浩特',
|
|
|
+ '哈尔滨',
|
|
|
+ '长春',
|
|
|
+ '沈阳',
|
|
|
+ '济南',
|
|
|
+ '南京',
|
|
|
+ '合肥',
|
|
|
+ '杭州',
|
|
|
+ '南昌',
|
|
|
+ '福州',
|
|
|
+ '郑州',
|
|
|
+ '武汉',
|
|
|
+ '长沙',
|
|
|
+ '广州',
|
|
|
+ '南宁',
|
|
|
+ '西安',
|
|
|
+ '银川',
|
|
|
+ '兰州',
|
|
|
+ '西宁',
|
|
|
+ '乌鲁木齐',
|
|
|
+ '成都',
|
|
|
+ '贵阳',
|
|
|
+ '昆明',
|
|
|
+ '拉萨',
|
|
|
+ '海口',
|
|
|
+];
|
|
|
+var randomCount = citys.length;
|
|
|
+
|
|
|
+// 构造数据
|
|
|
+while (randomCount--) {
|
|
|
+ var cityName = citys[randomCount];
|
|
|
+ data.push({
|
|
|
+ geometry: {
|
|
|
+ type: 'Point',
|
|
|
+ coordinates: [116.404, 39.915],
|
|
|
+ },
|
|
|
+ properties: {
|
|
|
+ text: cityName + '\n' + 116.404 + '，' + 39.915,
|
|
|
+ // textColor: '#fff',
|
|
|
+ // borderColor: ['#0f0', '#f00', '#00f'][randomCount % 3],
|
|
|
+ // backgroundColor: ['#0f0', '#f00', '#00f'][randomCount % 3],
|
|
|
+ },
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ var map = new BMapGL.Map("allmap"); // 创建Map实例
|
|
|
+ map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 5); // 初始化地图,设置中心点坐标和地图级别
|
|
|
+ map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
|
|
|
+
|
|
|
+
|
|
|
+})
|
|
|
+
|
|
|
+// var view = new mapvgl.View({
|
|
|
+// map: map,
|
|
|
+// });
|
|
|
+//
|
|
|
+// var layer = new mapvgl.LabelLayer({
|
|
|
+// textAlign: 'center',
|
|
|
+// textColor: '#fc0',
|
|
|
+// borderColor: '#666',
|
|
|
+// backgroundColor: '#666',
|
|
|
+// // pickedTextColor: '#fff',
|
|
|
+// // pickedBorderColor: '#666',
|
|
|
+// // pickedBackgroundColor: '#666',
|
|
|
+// padding: [2, 5],
|
|
|
+// borderRadius: 5,
|
|
|
+// fontSize: 12,
|
|
|
+// lineHeight: 16,
|
|
|
+// collides: true, // 是否开启碰撞检测, 数量较多时建议打开
|
|
|
+// enablePicked: true,
|
|
|
+// autoSelect: true,
|
|
|
+// onClick: e => {
|
|
|
+// // 点击事件
|
|
|
+// console.log('click', e);
|
|
|
+// },
|
|
|
+// });
|
|
|
+// view.addLayer(layer);
|
|
|
+// layer.setData(data);
|
|
|
+
|
|
|
+</script>
|
