Bing地图 - 动画图块层 - 不透明度

时间:2017-01-26 22:17:09

标签: bing-maps

在bing maps v8中,如何在AnimatedTileLayer上设置不透明度?我在下面设置的不透明度值(0.2)不起作用。

    var tileSources = [];
        for (var i = 0; i < timeStamps.length; i++) {
            var path = 'https://api.weather.com/v3/TileServer/tile/radarFcst?fts={fts}&ts={ts}&xyz={x}:{y}:{zoom}&apiKey={apiKey}';
            path = path.replace('{apiKey}', weatherApiKey);
            path = path.replace('{fts}', timeStamps[i]);
            path = path.replace('{ts}', tsNow);
            var tileSource = new Microsoft.Maps.TileSource({
                uriConstructor: path
            });
            tileSources.push(tileSource);
        }

        EmptyOverlay.prototype = new Microsoft.Maps.CustomOverlay();
        function EmptyOverlay() {
        }
        EmptyOverlay.prototype.onAdd = function () {
           var container = document.createElement('div');
            this.setHtmlElement(container);
        };
        var overlay = new EmptyOverlay();
        vm.map.layers.insert(overlay);
        var animatedLayer = new Microsoft.Maps.AnimatedTileLayer({
            mercator: tileSources,
            frameRate: 500,
            opacity: 0.2,
            loadingScreen: overlay
        });
        vm.map.layers.insert(animatedLayer);

1 个答案:

答案 0 :(得分:1)

AnimatedTileLayer没有不透明度选项:https://msdn.microsoft.com/en-us/library/mt772207.aspx我会将其添加为功能请求。

如果你需要这种正确的方法,可以使用hack来做到这一点:

var opacity = 0.2;

//Add an event handler that fires for each frame of the animation.
Microsoft.Maps.Events.addHandler(animatedLayer, 'onFrameLoaded', function (e) {
    //Check the opacity of the root html element used by the animated tile layer if it is not set to the current opacity.
    if (animatedLayer._htmlElement && animatedLayer._htmlElement.style.opacity !== opacity) {
        animatedLayer._htmlElement.style.opacity = opacity;
    }
});

请注意,这是一个黑客攻击,并且不受官方支持,因此它可以随时中断,不建议在生产应用中使用。