在具有不同图标样式的Openlayers中使用Fontawesome



我想在地图上使用不同的Fontawesome图标样式。到目前为止,这不是问题。但就我而言,图标:"map-marker-alt"只有一个 unicode 用于 4 种不同的样式 (https://fontawesome.com/icons/map-marker-alt?style=regular(。所以我唯一可以访问的样式是常规样式。是否可以引用另一种样式,例如纯色样式?

const markerStyle = new Style({
text: new Text({
text: 'uf3c5',
scale: 1.5,
textBaseline: 'bottom',
font: 'normal 16px "Font Awesome 5 Pro"',
fill: new Fill({ color: '#2196F3' }),
stroke: new Stroke({ color: 'black', width: 1 })
})
});

根据 https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use,字体字体粗细用于指定要使用的图标样式。对于常规样式,要使用的权重为 400,因此您的代码需要更改为:

const markerStyle = new Style({
text: new Text({
text: 'uf3c5',
scale: 1.5,
textBaseline: 'bottom',
font: '400 16px "Font Awesome 5 Pro"',
fill: new Fill({ color: '#2196F3' }),
stroke: new Stroke({ color: 'black', width: 1 })
})
});

相关内容

  • 没有找到相关文章

最新更新