这次的主要目的是在百度地图中引用自定义的覆盖物,路径是再asset/images/文件夹下,直接引用出错。需要先导入再引用。

在<script></script>代码中增加如下:

     import gisGreen from '../assets/images/GIS_Green2.png';
export default {……
methods:{
……,
handler ({BMap, map}) {
var point = new BMap.Point(120.66, 31.20);
map.centerAndZoom(point, 13);
var myIcon = new BMap.Icon(gisGreen, new BMap.Size(20, 32));
var marker = new BMap.Marker(point, {icon: myIcon}); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
},
}
}

解决vue中百度地图覆盖物引用本地图片问题的更多相关文章

  1. 解决Vue引入百度地图JSSDK:BMap is undefined 问题

    百度地图官网文档介绍使用JSSDK时,仅提供了2种引入方式: script引入 异步加载 解决跨域问题,实例调用百度地图 但vue项目中仅某一两个页面需要用到百度地图,所以不想在 index.html ...

  2. vue中百度地图API的调用

    1.使用百度地图api需要使用jsonp,来获取百度api的返回,因为vue不自带jsonp所以需要下载 安装jsonp npm i vue-jsonp -S 引入jsop import Vue fr ...

  3. 一文解决Vue中实现 Excel下载到本地以及上传Excel

    相信大家在项目中经常会遇到一些上传下载文件的相关功能,本文就Excel的相关功能进行简述: 咱直接看代码: <div class="import-main-content"& ...

  4. JSP中<img>标签引用本地图片

    问题描述: jsp页面中<img>标签如何读取本地文件夹中的图片. 问题起因: 由于上传图片至本地文件夹中,图片路径为: D:/upload/file/image/img.jpg 所以将这 ...

  5. Markdown引用本地图片语法

    Markdown引用本地图片语法 markdown引用图片标准方式如下: ![Alt text](/path/to/img.jpg) 测试markdown文本如下: # 测试相对路径图片 ![Alt ...

  6. vue使用百度地图

    1.在百度地图申请密钥:http://lbsyun.baidu.com/ 将 <script type="text/javascript" src="http:// ...

  7. 解决vue中BMap未定义问题

    原文链接: 点我 最近在项目中使用了百度地图来显示物流信息,实现方式有两种: 引用Vue Baidu Map引用BMap存在的问题:\color{red}{存在的问题:}存在的问题::使用BMap可以 ...

  8. android中百度地图定位的实现方法(仅适用于真机+WIFI联网环境)

    注意:此代码的环境是:真机(系统版本为Android4.2.2)+WIFI联网(才能实现最后的运行结果):使用虚拟机调试会出现各种问题. 第一步:下载SDK和申请Key 到百度的网站http://de ...

  9. 解决Fragment中使用地图,切换会闪一下黑屏的问题

    我用的是高德的3D地图,用2D地图无此问题. 从答案来看,大概是SurfactView与Fragment之间的问题.虽然我用的是高德,不过这方法估计对百度地图也有效. 解决方法是,在使用到地图的Act ...

随机推荐

  1. Git - Git本地仓库与GitHub远程仓库关联

    前言 Git本地仓库与GitHub仓库的关联逻辑如下 创建Key 在本地仓库下,新建Key文件夹,然后打开Key文件夹,单击鼠标右键,选择Git Bash Here. 输入命令:ssh-keygen ...

  2. IIFE,回调函数

    回调函数: 当函数A作为一个参数在函数B中被调用时,就称A为B的回调函数 IIFE:匿名函数自调用 (function(){})() 作用:防止污染全局命名空间 隐藏实现

  3. 用IIS进行部署,发布网页,运行DEMO

    因项目需要,正在学习如何部署IIS服务,并发布网站,发布以后,运行网页,具体步骤如下: 一.IIS的部署 在进行部署前,需要将一些必要的配置选好,如图: 打开选项,进行设置,将箭头部分进行勾选 在wi ...

  4. [logstash.outputs.elasticsearch] retrying failed action with response code: 403

    0x00 Event [2019-09-24T19:22:31,655][INFO ][logstash.outputs.elasticsearch] retrying failed action w ...

  5. 微信小程序开发——上传代码片段到git仓库

    微信开发者工具除了自带的git版本管理(本地服务)之外,还可以推送到在线git仓库中去,这样别人也可以通过git来拉取你的代码片段或小程序. 一.1.登录git 一.2.点击创建项目  一.3.填写项 ...

  6. Recover With Until Time fails With RMAN-20207 When Time Is Before Last RESETLOGS (Doc ID 159405.1)

    Recover With Until Time fails With RMAN-20207 When Time Is Before Last RESETLOGS (Doc ID 159405.1) A ...

  7. 初级模拟电路:3-2 BJT的工作原理

    回到目录 和前面介绍二极管的PN结的工作原理一样,BJT的量子级工作机制也非常复杂,一般教科书上为了帮助学习者能快速理解,也都是用一种简化模型的方法来介绍BJT的工作机理,一般只需大致了解即可.只要记 ...

  8. Linux别名工具alias的使用

    偶然发现Linux支持自定义命令 现在Linux环境上经常有多个python环境,但是python2马上要停止维护了,所以我想多使用python3,但是Linux上的python命令调用的是pytho ...

  9. Linux命令(自己工作常用)

    添加用户--root角色才有权限 useradd -d主目录 -m username useradd -d /home/hadoop2 -m hadoop2; 删除用户 userdel -f user ...

  10. crossover mac如何使用?crossover mac使用教程

    CrossOver Mac 破解版可以在 Mac 上运行成千上万的 Windows 程序,从办公软件.实用工具.游戏到设计软件.CrossOver 19 破解版可以让 Windows 程序和 Mac ...