需要帮助以特定坐标叠加图像(OpenStreetMap,OpenLayers)

时间:2019-04-19 10:46:41

标签: javascript openlayers openstreetmap

我需要帮助在opentreetmap地图上的特定坐标处叠加图像。

我有此代码:

lyr1 = new OpenLayers.Layer.Image("Image Overlay",
            "https://www.greenique.de/wp-content/uploads/2016/03/test.png",
            new OpenLayers.Bounds(15.419198532265034, 47.07662635844666, 15.421042606244283, 47.07661959417825),
            new OpenLayers.Size(0, 0),
            {
                projection: new OpenLayers.Projection("EPSG:900913"),
                displayProjection: new OpenLayers.Projection("EPSG:4326"),
                isBaseLayer: false,
                visibility: true,
                displayInLayerSwitcher: true
            }
        ); 

然后添加:

map.addLayer(lyr1);

但是图像未显示在地图上的任何位置。 我可以选中/取消选中图层。

我在做什么错了?

1 个答案:

答案 0 :(得分:0)

您需要将边界转换为openstreetmap投影并提供正确的图像尺寸

lyr1 = new OpenLayers.Layer.Image("Image Overlay",
            "https://www.greenique.de/wp-content/uploads/2016/03/test.png",
            new OpenLayers.Bounds(15.419198532265034, 47.07662635844666, 15.421042606244283, 47.07661959417825).transform(
                new OpenLayers.Projection("EPSG:4326"),
                new OpenLayers.Projection("EPSG:900913")
            ),
            new OpenLayers.Size(2000, 1500),
            {
                isBaseLayer: false,
                visibility: true,
                displayInLayerSwitcher: true
            }
        );