Bing maps 如何在ajax中格式化文本或更改图钉内的字体大小

Bing maps 如何在ajax中格式化文本或更改图钉内的字体大小,bing-maps,pushpin,Bing Maps,Pushpin,我使用以下代码创建了图钉 var pin = new Microsoft.Maps.Pushpin(data._LatLong, { icon: 'images/pushpin.png', text: '1', typeName: 'pushpinStyle' }); 默认情况下,图钉图标中显示的文本从图标顶部向下5px。我已经更改了图钉图标的高度和宽度,但图钉内的文本格式没有改进。如何格式化图钉内的文本 我在谷歌上搜索了

我使用以下代码创建了图钉

var pin = new Microsoft.Maps.Pushpin(data._LatLong, {
        icon: 'images/pushpin.png',        
        text: '1',
        typeName: 'pushpinStyle'
    });
默认情况下,图钉图标中显示的文本从图标顶部向下5px。我已经更改了图钉图标的高度和宽度,但图钉内的文本格式没有改进。如何格式化图钉内的文本


我在谷歌上搜索了很多,但没有得到正确的回复。请提前感谢

您已经找到了为图钉指定typeName属性的正确途径。您可能已经知道,指定类型名为
pushpinStyle
将导致创建的图钉具有
pushpinStyle
类。如果您在地图上检查图钉生成的html,您将看到图钉文本由图钉
内绝对定位的子
重新生成。因此,合乎逻辑的做法是使用css进一步设置图钉文本的样式。例如,您可以执行以下操作:

.pushpinStyle div{
    color: black !important; /*Make Pushpin text black*/
    left: 5px !important;  /*Since Pushpin text is absolutely positioned, this will cause the text to be 5 pixels from the left instead of 0 pixels */
    text-shadow: 1px 0px white, -1px 0px white, 0px -1px white, 0px 1px white;  /*Give the text all around white text shadow so it looks nice on browsers that support it*/
    font: 12px arial,sans-serif; !important // override default fonts 
}

这将导致图钉文本
具有上述样式。当然,您可以添加自己的样式以适合您的应用程序。

我实际上正在使用图钉上的
htmlContent
选项:

var pin = new Microsoft.Maps.Pushpin(data._LatLong, {
    typeName: 'pushpinStyle',
    htmlContent: '<img src="images/pushpin.png" alt=""/>' +
                 '<span>'+resultNum.toString()+'</span>'
});
var pin=新的Microsoft.Maps.Pushpin(数据){
typeName:“pushpinStyle”,
htmlContent:'+
''+resultNum.toString()+''
});
这样你就不会有使用的肮脏!像@Bojin Li的解决方案中的重要样式。。。我注意到这在手机上造成了问题。每次我滚动地图时,我的自定义样式都会被删除,直到地图再次停止移动。这也是一个非常灵活的配置选项。你可以把任何你想要的html放在那里


API参考:

Hello@Bojin Li,我需要一个小帮助,默认情况下,Microsoft.Maps.pushpin属性中已经提供了图钉的字体属性。我想覆盖图钉中的字体属性。是否可以覆盖它。非常感谢,只需在更具体的范围内指定字体css。或者你可以用这个!重要的关键词。见我的最新答案Bojin Li:在你最近的编辑中有一些小的打字错误/语法错误。不过输入很好。