mapbox的Source

  • 问题情景:矢量图层层级4-8,地图缩放到9,矢量地图数据不显示了。如何保留上一层级数据在地图上呢?
  • 解决:添加Source时设置maxzoom或minzoom属性。如矢量图层层级4-8设置为:
map.on('load', function() {
            // 添加数据源
            map.addSource('aero_navdata', {
                "type": "vector",
                'tiles': [
                    'https://d116.foht.com/tileserver/resources/aero_navdata_2404/tiles/{z}/{x}/{y}?v=1713028420.2392&Key-Pair-Id=K3B6LIRZIHY0OC&Policy=eyJTdGF0'
                ],
                maxzoom: 8, //必须设置并且最大或最小需不得大于或小于矢量图层,否则地图层级超出矢量图层层级时,地图上不会显示。
                minzoom: 4,
            });


            map.addLayer({
                "id": "Airway Airspace - World",
                "layout": {},
                "metadata": {
                    "group": "TMA/TCA"
                },

                maxzoom: 22,
                minzoom: 4,
                "paint": {
                    "line-color": "hsla(206, 97%, 34%, 0.3)",
                    "line-offset": {
                        "base": 1,
                        "stops": [
                            [
                                0,
                                0
                            ],
                            [
                                22,
                                7.5
                            ]
                        ]
                    },
                    "line-opacity": {
                        "base": 1,
                        "stops": [
                            [
                                5,
                                0
                            ],
                            [
                                6,
                                1
                            ]
                        ]
                    },
                    "line-width": {
                        "base": 1,
                        "stops": [
                            [
                                6,
                                1.5
                            ],
                            [
                                9,
                                10
                            ]
                        ]
                    }
                },
                "source": "aero_navdata",
                "source-layer": "airspaces",
                "type": "line"
            })
            map.addLayer({

                "id": "TRSA",
                "layout": {
                    "symbol-placement": "line",
                    "symbol-spacing": {
                        "base": 1,
                        "stops": [
                            [
                                0,
                                600
                            ],
                            [
                                12,
                                1000
                            ]
                        ]
                    },
                    "text-field": "{ac}-{res}-{t}-{ll_raw}",
                    "text-font": [
                        "Open Sans Bold"
                    ],
                    "text-letter-spacing": 0.05,
                    "text-offset": [
                        0,
                        0.75
                    ],
                    "text-size": {
                        "base": 1,
                        "stops": [
                            [
                                8,
                                14
                            ],
                            [
                                12,
                                16
                            ]
                        ]
                    },

                    "line-cap": "round",
                    "line-join": "round",
                    "visibility": "visible",
                },
                "metadata": {
                    "group": "Airspace Labels - Controlled"
                },
                "minzoom": 8,
                "paint": {
                    "text-color": "#fff",
                    "text-halo-color": "#0362aa",
                    "text-halo-width": 2
                },
                "source": "aero_navdata",
                "source-layer": "airspaces",
                "type": "symbol"
            })


        });

后续使用补充Source 中属性。

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值