"icon-image": ["get","user_icon"],"icon-size": ["get","user_iconSize"],"text-field": ["get","user_text"],"text-size":16, }, paint: { "text-color":"#D20C0C","text-halo-width":2,"text-halo-color":"#fff", }, }, { id:"points-are-blue", // 非激活状态的点。两...
map.setLayoutProperty('country-label','text-field', ['get','name_zh']); map.setLayoutProperty('state-label','text-field', ['get','name_zh']); map.setLayoutProperty('settlement-label','text-field', ['get','name_zh']); }); 方法2:使用自定义样式 如果有自己的带有中文标签的样式文件,...
"text-field": ["get", "point_count_abbreviated"], "text-offset": [0.5, -0.1], "text-size": 20, "icon-ignore-placement": true, }, paint: { "text-color": "#F0F0F0", "text-halo-width": 0.5, "text-halo-color": "#F0F0F0", }, }); // 添加点击事件 map...
"text-justify": "auto", "icon-image": ["concat", ["get", "icon"], "-15"] } }); text-field 作用是填充label的值。 可以通过n 来对字符串主动换行,如"text-field": "文字\n填充", 也可以通过访问source属性来给地图上的坐标点批量增加文字,即"text-field": ["get", "description"] symbol...
{"icon-image":"bus-11","text-field":["to-string",["get","STOP_NAME"]],"text-font":[//"Alegreya SC Bold","Arial Unicode MS Regular"],"text-size":12,"text-justify":"left","text-anchor":"left","text-offset":[1,0]},"paint":{"text-color":"hsl(0, 27%, 55%)"}},{"...
map.addLayer({"id":"points","type":"symbol","source":"points","layout":{"icon-image":"{icon}-15","text-field":"{name}","text-font":["Open Sans Semibold","Arial Unicode MS Bold"],"text-offset":[0,0.6],"text-anchor":"top","text-allow-overlap":true,"icon-allow-overlap":...
'text-allow-overlap': false, 'text-size': 14, 'text-rotate': 0, 'text-field': `{name}`, }, paint: { 'text-opacity': 1, 'text-color': '#ffffff', 'text-halo-blur': 0.1, 'text-halo-width': 0.1, 'text-halo-color': '#356caa', ...
'text-field': ['get', 'title'], //设置字体样式 'text-font': [ 'Arial Unicode MS Bold' ] } }); 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12. 13. 14. 15. 16. 17. 18. 19. 20. 21. 22. 23. 24. 25. 26.
'text-field': '{point_count}', 'text-font': ['Arial Unicode MS Bold'], 'text-size': 12 } }); //显示未聚合的点图层 map.addLayer({ id: 'unclustered-point', type: 'circle', source: 'poidata', filter: ['!', ['has', 'point_count']], ...
在图层的布局中,我们使用"text-field"属性来获取"title"属性的值作为文本内容。我们还可以设置其他文本样式,如字体、大小、偏移量和锚点。 设置多行文本样式: 为了在多行文本中使用换行符,我们在"description"属性中使用了"\n"来分隔每一行的文本。 运行代码: ...