mapbox图层显示多行文本

最新推荐文章于 2024-07-23 02:48:15 发布

abcdTracy

最新推荐文章于 2024-07-23 02:48:15 发布

阅读量3k

点赞数 2

分类专栏：地图 mapbox

本文链接：https://blog.csdn.net/abcdTracy/article/details/106279787

版权

本文介绍如何在Mapbox图层中使用layout属性的text-field展示多行文本，通过示例代码展示了具体实现方式，并附有显示效果的截图。

摘要由CSDN通过智能技术生成

1、图层中显示多行文本图层的layout属性中的text-field，代码如下：

// 地图加载
map.on('load',
function() {

    var data = {
        "geometry": {
            "type": "Point",
            "coordinates": [105.73242187500001, 33.423948439285304]
        },
        "type": "Feature",
        "properties": {
            "col1": "学史可以看成败、鉴得失、知兴替；",
            "col2": "学诗可以情飞扬、志高昂、人灵秀；",
            "col3": "学伦理可以知廉耻、懂荣辱、辨是非。",
        }
    }

    map.addSource('test_source', {
        type: "geojson",
        data: data
    });

    map.addLayer({
        "id": 'test_layer',
        "type": "symbol",
        "minzoom": 0,
        "maxzoom": 22,
        "source": 'test_source',
        "layout": {
            "text-field": ["format&