openlayer2添加图片到地图不成功

代码如下,在vue中使用的

 initMap() {
      var map, layer, lableLayer; //complex object of type LMap.Map
      var that = this
      //Initialise the 'map' object
      function init() {

        map = new LMap.Map("map", {
          //            maxExtent : new LMap.Bounds(99.22783,31.11247,99.31504,30.93840),
          numZoomLevels: 19,
          //            maxResolution : 156543.0339,
          //            units : 'm',
          projection: "EPSG:4326",
          displayProjection: new LMap.Projection("EPSG:4326")
        });
        layer = new LMap.Layer.TMS("Name",
          config.mapUrl + "/data/9000/", {
            'type': 'png',
            'isBaseLayer': true,
            'getURL': get_my_url
          });
        lableLayer = new LMap.Layer.TMS("lableLayer",
          config.mapUrl + "/data/9001/", {
            'type': 'png',
            'isBaseLayer': false,
            'getURL': get_my_url
          });
        map.addLayer(lableLayer);
        map.addLayer(layer);
        var markerLayer = new LMap.Layer.Vector('iconMarker', { //添加marker
          styleMap: new LMap.StyleMap({
            default: new LMap.Style({
                          externalGraphic: '${src}',
                          cursor: 'pointer',
                          graphicWidth: 30,
                          graphicHeight: 30,
                          graphicYOffset: -16,
                          title: ''
            })
          })
        })
       map.addLayer(markerLayer)
 for(var i = 0; i < 10000; i++){
     var lon = 113.998 + (Math.random()/100-0.005);
     var lat = 33.011 + (Math.random()/100-0.005);
     var markerFeature = new LMap.Feature.Vector(
             new LMap.Geometry.Point( lon, lat),
             {
                 gid:i,
                 title:'标注点' + i,
                 src:that.mark_img
             }
     );
     markerLayer.addFeatures(markerFeature);
 }
        console.log(map,"iconMarkerLayer")
        //        map.addControl(new LMap.Control.Scale());
        map.addControl(new LMap.Control.MousePosition());
        //        map.addControl(new LMap.Control.LayerSwitcher());

        var lonLat = new LMap.LonLat(99.28501, 31.02467);
        lonLat.transform(map.displayProjection, map.getProjectionObject());
        map.setCenter(lonLat, 13);
      }

      function get_my_url(bounds) {
        var res = this.map.getResolution();
        console.log("res=" + res);
        var x = Math.round((bounds.left - this.maxExtent.left) /
          (res * this.tileSize.w));
        // console.log("x=" + x);
        var y = Math.round((this.maxExtent.top - bounds.top) /
          (res * this.tileSize.h));
        // console.log("y this.maxExtent.top =" + this.maxExtent.top);
        // console.log("y bounds.top =" + bounds.top);
        // console.log("y this.tileSize.h =" + this.tileSize.h);
        // console.log("y res * this.tileSize.h =" + res * this.tileSize.h);
        var z = this.map.getZoom();

        var path = "" + z + "/" + x + "/" + y + "." + this.type;
        var url = this.url;
        if (url instanceof Array) {
          url = this.selectUrl(path, url);
        }
        console.log(url + path, 456456456);
        //        console.log(url+path)
        return url + path;

      }
      init()
    },

 

参考GPT和自己的思路:

根据你提供的代码和问题,我看到你在创建markerLayer时使用了一个变量that.mark_img,但没有看到你定义这个变量的代码。这可能是导致添加图片不成功的原因之一。

另外,你可以检查图片路径是否正确,并且确保图片能够访问。如果图片路径不正确或图片无法访问,那么添加图片到地图也会不成功。

最后,建议你检查控制台输出,查看是否有任何错误或警告信息。这些信息可以帮助你更好地理解问题所在,并找到解决方法。