更改 Bing Maps V8 ajax 控件的内联 svg 的文本颜色

Question

在此处的示例中：https://blogs.bing.com/maps/May-2016-(1)/Pushpin-Clustering-in-Bing-Maps-V8。我想将显示群集图钉计数的白色更改为不同的颜色。尝试了下面的代码，但没有用。还有另一种方法可以改变它吗？

cluster.setOptions({
            icon: svgString,
            anchor: new Microsoft.Maps.Point(radius, radius),
            textOffset: new Microsoft.Maps.Point(0, radius - 8),
            color: Microsoft.Maps.Color.fromHex('#111111') 
        });

Answer 1

颜色图钉选项更改默认图钉的颜色。没有更改文本值颜色的选项，但由于您使用的是内联 SVG，因此在您的内联 SVG 中很容易做到这一点。您可以在 SVG 中包含“{color}”占位符，它将替换为您在图钉颜色选项中指定的颜色。这是一个例子：

var svg = '<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30"><circle cx="15" cy="15" r="13" style="stroke:orange;stroke-width:2;fill:yellow;"/><text x="10" y="20" style="fill:{color};">{text}</text></svg>';

var pushpin = new Microsoft.Maps.Pushpin(map.getCenter(), { 
    icon: svg.replace('{text}', 'hi'),
    anchor: new Microsoft.Maps.Point(15, 15),
    color: 'red'
    });

更改 Bing Maps V8 ajax 控件的内联 svg 的文本颜色

Changing text color for inline svg of Bing Maps V8 ajax control

bing-maps

bing-api