javascript - 如何将 base64 解码图像添加到 openlayer map ？

Question

这是我的版本。但它不起作用。显示 Canvas ，但不响应拖动和缩放。

               var layer = new ol.layer.Image({
                source: new ol.source.ImageCanvas({
                    canvasFunction: function(){
                        var canvas = document.createElement('canvas');
                        var context = canvas.getContext('2d');
                        var image = new Image();

                        canvas.setAttribute('width', attachment.width);
                        canvas.setAttribute('height', attachment.height);

                        image.onload = function(){
                            context.drawImage(image, 0, 0);
                        };

                        image.src = attachment.src;

                        return canvas;
                    },
                    projection: view.getProjection()
                })
            });

Answer 1

我找到答案了!只需使用 ol.source.ImageStatic 和 imageLoadFunction :

            var layer = new ol.layer.Image({
            source : new ol.source.ImageStatic({
                imageExtent : view.getProjection().getExtent(),
                size : [attachment.width, attachment.height],
                imageLoadFunction : function(image){
                    image.getImage().src = attachment.src;
                },
                projection : view.getProjection(),
                url : ''
            })
        });