使用高德地图marker类中关于content图片路径问题

高德Marker 类中有关于icon 图片的使用，现有两种方式可以实现

一.使用import 导入

在组件中直接import svg from 'demo/run.svg'
然后再初始化Marker标记的时候

 let marker = new AMap.Marker({
      position: new AMap.LngLat(item.LONGITUDE, item.LATITUDE),
      title: item.ADDRESS,
      offset: new AMap.Pixel(-10, -10),
      icon: svg
    });

在icon导入svg就可以了，这是第一种方式，可以实现marker类标记图片

但是这种方式存在一个缺点即 图片在build后会以base64形式被打包到js文件中。不易于后期更换图片标记;

二.使用静态资源

--废话不多直接上代码

  let marker = new AMap.Marker({
          position: new AMap.LngLat(item.LONGITUDE, item.LATITUDE),
          title: item.ADDRESS,
          offset: new AMap.Pixel(-10, -10),
          icon: "static/img/running.svg"
        });

我们在项目static文件夹下新建一个img图片，然后将所有的静态资源都放入这个文件夹中，这样打包的时候，依旧能找到图片路径，并且图片是独立打包称文件夹。不过这种方式需要配置webpack才行， 方法 可以看我这篇文章;

总结

个人推荐方法二，这种方式更易于图片更换以及后期维护，而方法一如有更改必须每次打包项目才行;