mapbox-对数据筛选后渲染

最新推荐文章于 2024-08-16 09:07:30 发布

姜治宇

最新推荐文章于 2024-08-16 09:07:30 发布

阅读量291

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/github_38618068/article/details/130742435

版权

本文介绍如何使用Mapbox的addLayer功能结合filter选项，对杂乱无章的点线面数据进行筛选，实现红色点标记和黄色面标记的可视化效果。

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

有一堆杂七杂八的点线面数据，我们希望，点用红色的，面用黄色的，怎么办呢？
addLayer提供了filter选项，可以对source数据进行筛选。

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Add a 3D model</title>
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <link href="https://api.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.css" rel="stylesheet">
    <script src="https://api.mapbox.com/mapbox-gl-js/v2.14.1/mapbox-gl.js"></script>
    <style>
        body {
            margin: 0;
            padding: 0;
        }

        #map {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
        }
    </style>
</head>

<body>

    <div id="map"></div>
    <script>
        // TO MAKE THE MAP