加载图片资源到地图中

地图上的所有使用的图标以及图片必须经过此加工厂到地图上才可使用，所有图片在staticUtil文件中引入抛出即可

/**
 * 地图上的所有使用的图标以及图片必须经过此加工厂到地图上才可使用
 * 所有图片在staticUtil文件中引入抛出即可
 */
import imageList from '../util/staticUtil';

export class ImageFactory {
  map;

  constructor(map) {
    this.map = map;
  }

  loadImageSuccess(callBack) {
    let promiseList = [];
    // 加载地图所需图片
    Object.keys(imageList).forEach((key) => {
      promiseList.push(this.addImage(imageList[key], key));
    });

    Promise.all(promiseList)
      .then(() => {
        callBack();
      })
      .catch((err) => {
        throw err;
      });
  }

  addImage(url, name) {
    return new Promise((resolve) => {
      this.map.loadImage(url, (err, images) => {
        if (err) throw err;
        // 添加自定义图标
        this.map.addImage(name, images);
        resolve(name);
      });
    });
  }
}

staticUtil.js 引入静态资源

import hospital from '/images/map/minemap/symbol-hospital-icon.png';
import school from '/images/map/minemap/symbol-school-icon.png';
import government from '/images/map/minemap/symbol-government-icon.png';
import station from '/images/map/minemap/symbol-station-icon.png';
import other from '/images/map/minemap/symbol-other-icon.png';
import scenicSpot from '/images/map/minemap/symbol-scenicSpot-icon.png';
import fence from '/images/map/minemap/symbol-fence-icon.png';
import wifi from '/images/map/minemap/symbol-wifi-icon.png';
import rfid from '/images/map/minemap/symbol-rfid-icon.png';
import vehicle from '/images/map/minemap/symbol-vehicle-icon.png';
import face from '/images/map/minemap/symbol-face-icon.png';
import video from '/images/map/minemap/symbol-video-icon.png';
import market from '/images/map/minemap/symbol-market-icon.png';
import ktv from '/images/map/minemap/symbol-ktv-icon.png';
import hotel from '/images/map/minemap/symbol-hotel-icon.png';
import pawn from '/images/map/minemap/symbol-pawn-icon.png';
import gym from '/images/map/minemap/symbol-gym-icon.png';
import swim from '/images/map/minemap/symbol-swim-icon.png';
import chessCards from '/images/map/minemap/symbol-chessCards-icon.png';
import warningPosition from '/images/map/minemap/warning-position.png';
import infoClose from '/images/map/minemap/info-close.png';
import infoTitle from '/images/map/minemap/info-title.png';
import infoBg from '/images/map/minemap/info-bg.png';
import infoPercent from '/images/map/minemap/info-percent.png';
import bluePoint from '/images/map/minemap/blue-point.png';
import blueBg from '/images/map/minemap/blue-bg.png';
import redPoint from '/images/map/minemap/red-point.png';
import redBg from '/images/map/minemap/red-bg.png';
import greenPoint from '/images/map/minemap/green-point.png';
import greenBg from '/images/map/minemap/green-bg.png';

export default {
  hospital,
  school,
  government,
  station,
  other,
  scenicSpot,
  fence,
  wifi,
  rfid,
  vehicle,
  face,
  video,
  market,
  ktv,
  hotel,
  pawn,
  gym,
  swim,
  chessCards,
  warningPosition,
  infoTitle,
  infoBg,
  infoClose,
  infoPercent,
  bluePoint,
  blueBg,
  redPoint,
  redBg,
  greenPoint,
  greenBg,
};