Vue项目中OpenLayers中Style-Icon的图片路径写法
最近在开发中遇到了用openalyers在地图中上加载图片的需求,代码写好后图片一直没加载出来,控制台也不报错,一直找不到问题,后面将图片的地址变成网络图片就加载成功了,所以上网查了一下,opelayers中style-icon的图片路径写法,做一个笔记。
1.使用 require 方式加载图片
此时图片的路径为:“根目录 - src - assets”
let styles = {
icon: new Style({
image: new Icon({
anchor: [0.5, 1],
src: "require('../assets/icon.png')",
}),
}),
};
2.不使用 require 时,图片只能访问public目录下的
此时图片的路径为:“根目录 - public”
let styles = {
icon: new Style({
image: new Icon({
anchor: [0.5, 1],
src: "./icon.png",
}),
}),
};
2.不使用 require 时,图片只能访问public目录下的
此时图片的路径为:“根目录 - public”
let styles = {
icon: new Style({
image: new Icon({
anchor: [0.5, 1],
src: "./icon.png",
}),
}),
};
3.使用在线的图片地址
此时图片的路径为:“根目录 - public”
let styles = {
icon: new Style({
image: new Icon({
anchor: [0.5, 1],
src: "http:xxxx.com/xxx/icon.png,
}),
}),
};