Add colorfull building extrusions

apache · Oct 5, 2023 · 310c19d · 310c19d
1 parent 8860c7f
commit 310c19d
Show file tree

Hide file tree

Showing 4 changed files with 109 additions and 4 deletions.
diff --git a/.run/basemap-dev.run.xml b/.run/basemap-dev.run.xml
@@ -10,6 +10,11 @@
         <option name="ENABLED" value="true" />
       </pattern>
     </extension>
+    <extension name="software.aws.toolkits.jetbrains.core.execution.JavaAwsConnectionExtension">
+      <option name="credential" />
+      <option name="region" />
+      <option name="useCurrentConnection" value="false" />
+    </extension>
     <method v="2">
       <option name="Make" enabled="true" />
     </method>

diff --git a/basemap/layers/building/extrusion.js b/basemap/layers/building/extrusion.js
@@ -0,0 +1,64 @@
+/**
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements.  See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to you under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License.  You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+ **/
+import theme from "../../theme.js";
+
+export default {
+    id: 'building-extrusion',
+    type: 'fill-extrusion',
+    source: 'baremaps',
+    'source-layer': 'building',
+    filter: ['!=', ['get', 'building'], 'no'],
+    layout: {
+        visibility: 'visible',
+    },
+    minzoom: 16,
+    paint: {
+        "fill-extrusion-color": [
+            "case",
+            ["has", "building:colour"],
+            ["get", "building:colour"],
+            theme.buildingShapeFillColor,
+        ],
+        "fill-extrusion-base": [
+            'interpolate',
+            ['linear'],
+            ['zoom'],
+            16,
+            0,
+            17,
+            ['get', "extrusion:base"]
+        ],
+        "fill-extrusion-height": [
+            'interpolate',
+            ['linear'],
+            ['zoom'],
+            16,
+            0,
+            17,
+            ['get', "extrusion:height"]
+        ],
+        "fill-extrusion-opacity": [
+            'interpolate',
+            ['linear'],
+            ['zoom'],
+            16,
+            0,
+            17,
+            0.8
+        ]
+    },
+}
diff --git a/basemap/layers/building/tileset.js b/basemap/layers/building/tileset.js
@@ -21,14 +21,48 @@ export default {
         {
             minzoom: 13,
             maxzoom: 20,
-            sql:
-                "SELECT id, tags, geom FROM osm_ways WHERE tags ? 'building'",
+            sql: `
+                SELECT 
+                    id, 
+                    tags
+                        || jsonb_build_object('extrusion:base', (CASE
+                                                                     WHEN tags ? 'building:min_height'
+                                                                         THEN tags ->> 'building:min_height'
+                                                                     WHEN tags ->> 'building:min_level' ~ '^[0-9\\\\\\\\.]+$'
+                                                                         THEN tags ->> 'building:min_level'
+                                                                     ELSE '0' END)::real * 3)
+                        || jsonb_build_object('extrusion:height', (CASE
+                                                                   WHEN tags ? 'building:height'
+                                                                       THEN tags ->> 'building:height'
+                                                                   WHEN tags ->> 'building:levels' ~ '^[0-9\\\\\\\\.]+$'
+                                                                       THEN tags ->> 'building:levels'
+                                                                   ELSE '2' END)::real * 3),
+                    geom 
+                FROM osm_ways 
+                WHERE tags ? 'building'`,
         },
         {
             minzoom: 13,
             maxzoom: 20,
-            sql:
-                "SELECT id, tags, geom FROM osm_relations WHERE tags ? 'building'",
+            sql: `
+                SELECT 
+                    id, 
+                    tags 
+                        || jsonb_build_object('extrusion:base', (CASE
+                                                                      WHEN tags ? 'building:min_height'
+                                                                          THEN tags ->> 'building:min_height'
+                                                                      WHEN tags ->> 'building:min_level' ~ '^[0-9\\\\\\\\.]+$'
+                                                                          THEN tags ->> 'building:min_level'
+                                                                      ELSE '0' END)::real * 3)
+                        || jsonb_build_object('extrusion:height', (CASE
+                                                                   WHEN tags ? 'building:height'
+                                                                       THEN tags ->> 'building:height'
+                                                                   WHEN tags ->> 'building:levels' ~ '^[0-9\\\\\\\\.]+$'
+                                                                       THEN tags ->> 'building:levels'
+                                                                   ELSE '2' END)::real * 3),
+                    geom 
+                FROM osm_relations 
+                WHERE tags ? 'building'`,
         },
     ],
 }
diff --git a/basemap/style.js b/basemap/style.js
@@ -53,6 +53,7 @@ import highway_label from './layers/highway/highway_label.js';
 import ocean_overlay from './layers/ocean/overlay.js';
 import route_line from "./layers/route/style.js"
 import building_shape from "./layers/building/shape.js";
+import building_extrusion from "./layers/building/extrusion.js";
 import building_number from "./layers/building/number.js";
 import man_made_bridge from "./layers/man_made/bridge.js";
 import man_made_pier_line from "./layers/man_made/pier_line.js";
@@ -121,6 +122,7 @@ export default {
         natural_trunk,
         boundary_line,
         waterway_label,
+        building_extrusion,
         icon,
         point_label,
         country_label,