Сложите вытянутые полигоны в 3D с помощью ArcGIS API для JavaScript - PullRequest
Новая
       101

Сложите вытянутые полигоны в 3D с помощью ArcGIS API для JavaScript

2 голосов
/ 16 января 2020

У меня есть геометрия многоугольника, и я визуализирую их в 3D, используя ExtrudeSymbol3DLayer, как описано в документации SDK и образец : 

var symbol = {
  type: "polygon-3d",  // autocasts as new PolygonSymbol3D()
  symbolLayers: [{
    type: "extrude",  // autocasts as new ExtrudeSymbol3DLayer()
    size: 5,  // 5 meters in height
    material: { color: "red" }
  }]
};

enter image description here

Есть ли способ укладывать эти трехмерные экструзии друг на друга? Например, если у меня есть геометрия для Нью-Йорка, я хочу выдавливать снизу примерно до 5 м в одном цвете и от 5 м до 10 м в одном цвете, et c et c. Вроде как создание гистограммы с накоплением, но более географически c. Любой вклад будет оценен!

1 Ответ

4 голосов
/ 18 января 2020

Это возможно, выдавливая геометрии и помещая их на определенную высоту, используя свойство elevationInfo на слое. В приведенном ниже примере предполагается, что у вас есть слой (например, FeatureLayer или GeoJSONLayer ) с геометрией многоугольника.

Для выдавливания скажите слою для рендеринга многоугольников с помощью ExtrudeSymbol3DLayer. В приведенном ниже фрагменте кода все полигоны будут иметь высоту 5 метров. 

layer.renderer = {
  type: "simple",
  symbol: {
    type: "polygon-3d",
    symbolLayers: [
      {
        type: "extrude",
        size: 5, // height in meters
        material: {
          color: "red"
        }
      }
    ]
  }
}

После этого вы можете заставить свои вытянутые полигоны летать, разместив их на определенной высоте relative-to-ground. В приведенном ниже примере будут отображаться все полигоны на высоте 10 метров над землей. 

layer.elevationInfo = {
  mode: "relative-to-ground",
  offset: 10,
  unit: "meters"
}

Полигоны еще не будут выглядеть сложенными, поскольку все они имеют одинаковый цвет, высоту и высоту над землей. В основном мы хотим иметь разные значения в приведенных выше фрагментах кода для каждого из полигонов.

В следующем примере кода это достигается путем добавления

  • и Arcade выражения для elevationInfo
  • a VisualVariable для выдавленной высоты многоугольника
  • a UniqueValueRenderer для использования другого цвета для каждого многоугольника

Все они зависят от атрибутов объекта многоугольника и поэтому могут быть настроены путем изменения значений атрибутов. 


// Make elevation offset depend on the attribute "elevation"
layer.elevationInfo = {
    mode: "relative-to-ground",
    featureExpressionInfo: {
      expression: "$feature.elevation"
    },
    unit: "meters"
  };

layer.renderer = {
  type: "unique-value",
  visualVariables: [
    // Make the extrusion height depend on the attribute "height"
    {
      type: "size",
      valueExpression: "$feature.height",
      valueUnit: "meters"
    }
  ],
  // Make the color depend on the attribute "usage"
  field: "usage",
  uniqueValueInfos: [
    {
      value: "office",
      symbol: {
        type: "polygon-3d",
        symbolLayers: [
          {
            type: "extrude",
            material: {
              color: "#D06152"
            }
          }
        ]
      }
     },
     ... // Add unique value info for each usage
  ]
};

Вот рабочий пример, показывающий несколько вытянутых многоугольников в Центральный парк, Нью-Йорк. https://codepen.io/arnofiva/pen/4071d4e79a3cb921f42d6a9e83f5b418?editors=1010

enter image description here

...