百度地图API在vue-cli中路径错误的问题
// 创建自定义图标
var fieldIcon = new BMap.Icon(
// "http://lbsyun.baidu.com/jsdemo/img/fox.gif", // 设置图片
"assets/img/map/icon_cd.png",
new BMap.Size(300, 157) // 设置覆盖物大小
);
当打开其他正常引用的图片时,发现图片路径都是vue-cli已经自动替换后的路径,所有的图片路径都会自动修改到 static/images 文件夹下

// 创建自定义图标
var fieldIcon = new BMap.Icon(
// "http://lbsyun.baidu.com/jsdemo/img/fox.gif",
// "assets/img/map/icon_cd.png",
"static/images/icon_cd.png", // 设置图片路径
new BMap.Size(300, 157) // 设置覆盖物大小
);
这里有一点需要注意,这里路径的最前面并不需要 "/" 来给它定义为绝对路径,现在,图标就可以正常显示了

百度地图API在vue-cli中路径错误的问题的更多相关文章
- 深入浅出百度地图API开发系列(1):前言
百度地图API目前在地图API领域越来越受到众多开发者的关注,许多应用都使用到了百度地图API服务,包括博主me,我自己使用做的是Javascript API,根据经验,我想整理出一份系列教程,如果能 ...
- 百度地图API详解之事件机制,function“闭包”解决for循环和监听器冲突的问题:
原文:百度地图API详解之事件机制,function"闭包"解决for循环和监听器冲突的问题: 百度地图API详解之事件机制 2011年07月26日 星期二 下午 04:06 和D ...
- vue中百度地图API的调用
1.使用百度地图api需要使用jsonp,来获取百度api的返回,因为vue不自带jsonp所以需要下载 安装jsonp npm i vue-jsonp -S 引入jsop import Vue fr ...
- vue项目使用百度地图API获取经纬度
一.首先在百度api注册获得ak密钥 二.进行引入 (1).第一种方式: 直接在vue中index.html中用script标签引入. //你的ak密钥需要替换真实的你的ak码 <script ...
- android菜鸟学习笔记30----Android使用百度地图API(一)准备工作及在应用中显示地图
1.准备工作: 百度地图API是免费开放的,但是需要申请API Key: 1)先注册一个百度开发者帐号 2)进入百度开放服务平台http://developer.baidu.com/ 3)进入LBS云 ...
- VUE之使用百度地图API
利用vue创建点餐系统,在点餐系统中需要知道商家地址信息,这时就需要借用百度地图API. 步骤一:申请百度地图密钥: 步骤二:在index.html中添加百度地图JavaScript API接口: & ...
- 如何在网页中调用百度地图api
我想在木有提供地图接口的年代,前端工程师门要么只写上企业的具体地址,要么就是用一张标有自己位置的地图图片.但是现在不一样啦!为了增强用户体验,谷歌,甚至百度都很开放了,你可以在他们的网站上找到地图接口 ...
- 在XAF(ASP.NET)中以ListEditor的形式调用百度地图API
因为项目需要,在系统中使用地图显示设备的地理位置.考虑过ArgGIS,Bing和Baidu地图.本来想用ArgGIS,看教程嫌麻烦.所以还是用Web地图吧.Bing的话还要申请个key,没心情.百度地 ...
- 利用百度地图API,在浏览器中找到自己的位置
首先你得有个百度地图的秘钥,http://lbsyun.baidu.com/apiconsole/key 剩下的就是编码了 这里面会用到一个javascript里的一个函数,getMyLocation ...
随机推荐
- mybatis最重要的mapper文件书写
1.MyBatis中在查询进行select映射的时候,返回类型可以用resultType,也可以用resultMap. 也只有在mapper的select标签中,才会指定resultMap属性的值,其 ...
- 【转】Linux软连接和硬链接
再次温习一下,操作的不多.虽然感觉都会!!!! 这次再次操作一遍!! 通过上面的测试发现,删除f1之后,软连接f3就无效了,硬链接f3则不受影响. ls -F可以看到文件的类型. 连接文件的作用? - ...
- Qt实现Windows远程控制
实现方式为server端+client. server端为一个进程.client为图形界面程序. client连接时设置server端的Ip地址,以及须要显示的长度和宽度(不能超过相应server端显 ...
- Linux系统编程_6_进程环境(C程序典型的存储空间)
1.八种结束Linux进程的方法: 五种正常终止方式: main函数返回: 调用exit: 调用_exit或_Exit 最后一个线程从其启动例程返回 最后一个线程调用pthread_exit 三种异常 ...
- 关注PHPthinking官网微信公众号——红包来袭
欢迎大家扫描关注PHPthinking官方微信订阅号,我们将给您定期发送质量博文.新闻趣事.站点公告等等,同一时候还有PHPthinking准备的每日微信红包(金额不等,已发出百元红包)等着你! 官网 ...
- 常用Lunix命令
计算机 1.硬件系统 输入单元.输出单元.算术逻辑单元.控制单元.记忆单元 中央处理单元:CPU(算术逻辑单元.控制单元) 电源.主板.CPU.内存(RAM).硬盘.(声卡.显卡.网卡)(集成在主板上 ...
- [办公自动化]如何将PPT转为PDF,免费
同事需要把PPT格式的文档转为PDF.她没有安装adobe acrobat,安装了微软office 2007. 这个其实可以通过安装微软官方插件来解决.无需额外费用. 所需软件为: 2007 Micr ...
- JavaScript基础 -- DOM
一.DOM全称 文档对象模型(Document Object Model) 二.DOM是什么 DOM可以说是制作动态页面的强有力工具.DOM不是JavaScript语言的一部分,而是内置在浏览器中的一 ...
- python js
js = 'var a=document.getElementsByClassName("user-data-right")[0];a.target="_self&quo ...
- ubuntu tftp【转】
本文转载自:http://www.cnblogs.com/wxl309729255/articles/2816594.html 配置eth0的 IP地址, 同时激活该设备. #ifconfig eth ...