图标功能的大小计算错误

Size of Icon feature is calculated wrong

我目前正在编写一个实现,用户可以在其中上传蓝图并将其放置在地图上。

问题是图标功能被注册为实际图像范围的子范围。

显示全图时一切正常:
https://s24.postimg.org/lj3xmgsj9/image.png

当我将地图向左移动时,一旦领主开始离开视野,图像就会消失:
https://s23.postimg.org/4p2tu0c5n/image.png

这是个问题,因为我的用户必须能够放大他们上传的蓝图的角落。

以下URL 显示了 OL2 的工作实现:
http://gis.ibbeck.de/ginfo/apps/OLExamples/OL27/examples/ExternalGraphicOverlay/ExternalGraphicOverlay.asp
这里一切都很好。

这是 OL3 中的错误还是我做错了什么?
切换到 OL2 不是一个选项,因为我们已经有很多 OL3 代码。

使用了以下代码:
(拖动、旋转、缩放已被删除以制作一个最小的工作示例)

    var map = new ol.Map({
        layers: [
            new ol.layer.Tile({
                source: new ol.source.OSM()
            }),
            new ol.layer.Vector({
                source: new ol.source.Vector({
                    features: [
                        new ol.Feature(new ol.geom.Point([1389519.3624186157, 7496787.364362017]))
                    ]
                }),
                style: new ol.style.Style({
                    image: new ol.style.Icon({
                        src: 'https://lumiere-a.akamaihd.net/v1/images/millennium-falcon-4_9c006047.jpeg',
                        scale: 0.75
                    })
                })
            })
        ],
        target: 'map',
        view: new ol.View({
            center: [1389519.3624186157, 7496787.364362017],
            zoom: 18
        })
    });
<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <script src="https://openlayers.org/en/v3.20.1/build/ol.js"></script>
</head>
<body>
<div id="map" class="map"></div>
</body>
</html>

如果您有更大的图标,则必须设置 renderBuffer 属性 或 ol.layer.Vector(默认值:100px),以便 OpenLayers 包含该功能,即使实际几何形状在视图范围之外。

new ol.layer.Vector({
    renderBuffer: 600,
    ...
})

https://jsfiddle.net/nptq3hjy/