1

所以我目前正在处理 Deck.gl 和 React,我需要加载一个 geojson 文件,该文件有一个名为“floors”的附加属性或类似的东西,它告诉建筑物有多少层。

有什么方法可以将交替的地板水平挤出一点点,使它看起来像这个图像中的一些建筑物的地板边缘(尽管它们中的大多数只是在顶部变薄)。我尝试搜索deck.gl,但没有这样的东西。我抬头发现 MapBox-gl-js 有一个叫做extrusion-base-height的东西,它可以让你在另一个之上添加多边形,但是没有水平挤压以使1层变薄然后恢复到原始大小这样的东西。每当新楼层开始时,这都会让步。

我已经搜索了 deck.gl 的文档,但在水平拉伸或在另一种意义上改变多边形区域/大小以便我可以在同一个位置绘制多个大小的多边形时找不到任何东西。

在此处输入图像描述

我正在尝试的另一张清晰图片

在此处输入图像描述

我想做的事情。

  1. 红色多边形是倾斜的。需要使它的方向与绿色的方向相同,同时减少它的面积。

  2. 移动绿色多边形顶部的红色多边形底座。

我正在使用的测试数据如下所示,

var offset = 0.00001;
    var data = [{
        polygon: [
                    [-77.014904,38.816248],
                    [-77.014842,38.816395],
                    [-77.015056,38.816449],
                    [-77.015117,38.816302],
                    [-77.014904,38.816248]                      
                ],
        height: 30
    },
    {
        polygon: [
                    [-77.014904 + offset ,38.816248],
                    [-77.014842 - offset, 38.816395 - offset],
                    [-77.015056 - offset, 38.816449 - offset],
                    [-77.015117 + offset, 38.816302],
                    [-77.014904 + offset, 38.816248]
                ],          
        height: 40
    }

    ];

编辑:-我认为正确的方法是将经度/纬度转换为笛卡尔坐标,将向量获取到多边形的 4 个角,将向量平移到中心移动偏移量,然后再转换回来。但这仅适用于四边形/矩形多边形,对于由多个四边形组成的建筑物,我需要另一种方式。

4

1 回答 1

1

如果我理解正确,您的问题归结为:给定一个多边形(建筑物下部的足迹),生成一个稍微小一点的相同多边形版本,并在其中居中。

幸运的是,使用 Turf 的transformScale方法真的很容易。

所以你的步骤将是:

  1. 将您的多边形数据转换为 GeoJSON。(我假设你有一些机制要做,以便首先在 Mapbox-GL-JS 中显示它。)
  2. 使用生成较小的多边形turf.transformScale(base, 0.9)
  3. 添加新的多边形map.addSource
  4. 使用 显示新多边形map.addLayer,根据需要设置挤出基础高度等。
于 2019-07-26T02:30:20.773 回答