使用腾讯地图，在地图上圈选标记半径范围
1、引入地图：
<!-- 引入腾讯地图 -->
<script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=YOUR_KEY&libraries=visualization,service"></script>2、具体实现如下：
export default {data() {return {map: '', //mapmarker: null, //地图标记circle: null, //地图范围的圆 }},methods: {init() { //初始化地图this.$nextTick(()=> {this.map = new TMap.Map("container", {center: new TMap.LatLng(39.984121, 116.307484), // 设置地图中心点zoom: 10, // 设置地图缩放级别});})},setMarker(lat,lng){ //地图标记if(this.marker){this.marker.setMap(null);}this.marker = new TMap.MultiMarker({map: this.map,styles: {marker: new TMap.MarkerStyle({"width": 35,"height": 35,"anchor": { x: 16, y: 32 },"src": "https://mapapi.qq.com/web/lbs/javascriptGL/demo/img/markerNew.png"})},geometries: [{id: "marker",position: new TMap.LatLng(lat, lng),styleId: "marker"}]});this.map.setCenter(new TMap.LatLng(lat, lng));},//半径输入intChange(e) {e.target.value = e.target.value? e.target.value.replace(/[^0-9]\d*/g, '') : '';if(e.target.value){this.search()}},search() { //实时获取地里位置标记地图var that = this; if(this.longitude && this.latitude){this.setMarker(this.latitude,this.longitude) //地图标记if(this.distance){ //根据半径圈选范围let distance = Number(this.distance)if (!Number.isFinite(distance)) {return}if(this.circle){this.circle.setMap(null);}this.circle = new TMap.MultiCircle({map: that.map,geometries: [{center: new TMap.LatLng(that.latitude, that.longitude), // 圆心坐标radius: distance, // 圆的半径，单位为米color: '#FF0000', // 圆的填充颜色borderColor: '#FF0000', // 圆的边框颜色borderWidth: 2, // 边框宽度borderOpacity: 0.8, // 边框透明度colorOpacity: 0.2 // 填充透明度}]});let zoom=that.getZoom(that.distance)this.map.setCenter(new TMap.LatLng(this.latitude, this.longitude));this.map.setZoom(zoom);}}},/*根据距离获取地图放大缩小的倍数*/getZoom(distance){let zoom=3;if(distance<1100000){zoom=4;}if(distance<600000){zoom=5;}if(distance<300000){zoom=6;}if(distance<100000){zoom=7;}if(distance<50000){zoom=8;}if(distance<20000){zoom=10;}if(distance<9000){zoom=11;}if(distance<5000){zoom=12;}if(distance<2000){zoom=13;}if(distance<1000){zoom=14;}if(distance<500){zoom=15;}if(distance<200){zoom=16;}if(distance<100){zoom=17;}if(distance<50){zoom=18;}return zoom},}，mounted() {this.$nextTick(() => {this.init();})}
}