地图
蚕豆ya
这个作者很懒,什么都没留下…
展开
-
八、vue项目引入高德地图获取鼠标点击经纬度
如下图:代码如下:const AMap = window.AMap;//一定要引入AMapdata() { return { map: null, jd: "", wd: "", weizhi: "", }; },// 地图初始化 initMap() { this.map = new AMap.Map("map001", { center: [118.798039, 31.96875], //中心原创 2021-11-26 10:22:33 · 624 阅读 · 0 评论 -
七、vue项目使用高德地图自定义marker图标
效果如图主要代码data() { return { marker: "", markers: [ { position: [118.791545, 31.9624], id: 1, icon: require("../assets/xc/ren.png"), }, { position: [118.798832, 31.963916],原创 2021-11-26 09:40:12 · 1809 阅读 · 0 评论 -
六、vue 项目使用高德地图给多个点添加信息窗体
点每个点都会出来个信息窗体主要代码:styxc(){ let marker; //给多个点添加信息窗体 this.xc = [ [118.791545, 31.9624], [118.798832, 31.963916], [118.807671, 31.959403], [118.790131, 31.969258], ]; for (var i = 0; i <原创 2021-11-25 15:39:39 · 1323 阅读 · 0 评论 -
五、vue项目使用高德地图信息窗体
代码部分:<el-button type="primary" @click="openInfo">打开信息窗口</el-button><el-button type="primary" @click="closeInfo">关闭信息窗口</el-button>原创 2021-11-25 14:41:31 · 791 阅读 · 0 评论 -
四、vue 项目使用高德地图画面(多边形)
1、首先,我们要在在引入高德地图的文件里,在key后面加上&plugin=AMap.MouseTool<script src="https://webapi.amap.com/maps?v=2.0&key=你申请的key值&plugin=AMap.MouseTool"></script>如果没引入,就会报下面这个错2、然后我们找到官网相对应的实例:https://lbs.amap.com/demo/jsapi-v2/example/overlayer原创 2021-11-25 13:48:39 · 1412 阅读 · 0 评论 -
三、高德输入提示后查询 组合使用Autocomplete和PlaceSearch进行POI搜索
<template> <div> <el-input v-model="input" placeholder="请输入内容" id="tipinput" ></el-input> <div>经度:{{ info.la }} 维度:{{ info.wd }}</div> <div id=".原创 2021-11-19 14:20:02 · 1834 阅读 · 0 评论 -
二、点击地图获取经纬度
<div style="width:100px;height:50px">经纬度:{{this.input}}</div> <div id="container" class="container"></div>// 初始化地图页面 initMap() { // 地图初始化应该在地图容器div已经添加到DOM树之后 this.map = new AMap.Map('container', { ...原创 2021-11-18 10:20:11 · 647 阅读 · 0 评论 -
一、vue项目引入高德地图
1、在项目public下面的index.html里面引入高德地图<script src="https://webapi.amap.com/maps?v=2.0&key=你申请的key"></script>2、创个文件展示地图<template> <div> //这是展示地图的div <div id="container"></div> </div></template><sc原创 2021-11-17 18:23:09 · 123 阅读 · 0 评论 -
点击弹框,出现高德地图,点击地图获取点的坐标
//按钮<el-button @click="selectSite" type="primary">添加</el-button>//弹框<el-dialog :before-close="cancelCU2" :visible.sync="mapVisible" title="地图" width="50%" > <div class="titleBox">{{ t原创 2021-11-17 17:32:00 · 317 阅读 · 0 评论