diff --git a/examples/layer-browser/src/examples/core-layers.js b/examples/layer-browser/src/examples/core-layers.js index 53106bd6ff3..9f55fa7aadd 100644 --- a/examples/layer-browser/src/examples/core-layers.js +++ b/examples/layer-browser/src/examples/core-layers.js @@ -279,12 +279,22 @@ const ScatterplotLayerExample = { const ColumnLayerExample = { layer: ColumnLayer, + propTypes: { + radiusUnits: {type: 'compound', elements: ['radiusUnitsPixels']}, + radiusUnitsPixels: { + type: 'boolean', + onUpdate: (newValue, newSettings, change) => { + change('radiusUnits', newValue ? 'pixels' : 'meters'); + } + } + }, props: { id: 'columnLayer', data: dataSamples.worldGrid.data, extruded: true, pickable: true, radius: 100, + radiusUnits: 'meters', opacity: 1, getFillColor: d => [245, 166, d.value * 255, 255], getElevation: d => d.value * 5000 diff --git a/modules/layers/src/column-layer/column-layer-vertex.glsl.ts b/modules/layers/src/column-layer/column-layer-vertex.glsl.ts index fb81bd36b1e..69503867dd0 100644 --- a/modules/layers/src/column-layer/column-layer-vertex.glsl.ts +++ b/modules/layers/src/column-layer/column-layer-vertex.glsl.ts @@ -64,6 +64,8 @@ void main(void) { vec2 offset = (rotationMatrix * positions.xy * strokeOffsetRatio + column.offset) * dotRadius; if (column.radiusUnits == UNIT_METERS) { offset = project_size(offset); + } else if (column.radiusUnits == UNIT_PIXELS) { + offset = project_pixel_size(offset); } vec3 pos = vec3(offset, 0.); DECKGL_FILTER_SIZE(pos, geometry);