123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596 |
- <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>
|