deck.gl
deck.gl copied to clipboard
[Bug] Text border not visible
Description
Hello, I am having issues drawing borders to my text in the GeoJsonLayer with pointType="circle+text". They never appear and I don't know if I'm missing something or is it a bug.
pointType: 'circle+text',
getText: (f: Feature) => "Test", // Display feature name
getTextColor: (f: Feature) => [255, 255, 255, 255],
getTextAnchor: 'start',
getTextAlignmentBaseline: 'bottom',
getTextPixelOffset: [12, 0],
textSizeUnits: 'meters',
getTextSize: 12,
textSizeMinPixels: 12,
textSizeMaxPixels: 20,
// textOutlineColor: [0, 0, 0, 255],
// textOutlineWidth: 3,
getTextBorderColor: [0, 0, 0, 255],
getTextBorderWidth: 3,
This are the text-properties in my GeoJsonLayer. I tried both the border and outline properties but with no luck. The text displays fine but it has no border.
I am using openlayers for the base.
Flavors
- [ ] Script tag
- [ ] React
- [ ] Python/Jupyter notebook
- [ ] MapboxOverlay
- [ ] GoogleMapsOverlay
- [ ] CARTO
- [ ] ArcGIS
Expected Behavior
The text should have borders of the provided color and width.
Steps to Reproduce
Create a GeoJsonLayer with pointType='color+circle'. Add above text properties.
Environment
- Framework version:
- ol: "^10.4.0",
- @deck.gl/core: "^9.1.4",
- @deck.gl/layers: "^9.1.4",
- Browser: Chrome 133.0.6943.128 (Official Build) (arm64)
- OS: Mac OS 15.2
Logs
No response
textBackground must be set to true for background borders to render, see getBorderColor.
Thanks. I actually noticed that I wanted the text outline effect, not border - which I managed to get working by setting SDF to true:
...
textOutlineColor: [0, 0, 0, 255],
textOutlineWidth: 10,
textFontSettings: {
sdf: true,
},
...
However, now I get this two small little lines under the text. Increasing the buffer value in the textFontSettings resolves this issue but I am not sure if that is the right solution?