geojson's opacity property not working
- Dominant language
- TypeScript
- Stars
- 12k
- Forks
- 2k
- Avg merge
- 1d 5h
- Merged PRs (30d)
- 66
Description
I am using Kepler.gl for a react project. I have datasets with polygons, which I want to be transparent. I am passing the opacity property in the geoJson
```
{
type: "Feature",
geometry: {
type: "Polygon",
coordinates: [
[
[12.57638102369686, 55.68100585730289],
[12.575605804451902, 55.68048395158776],
[12.576431037841035, 55.680034919024024],
[12.577447992118934, 55.68072844882596],
[12.57638102369686, 55.68100585730289]
]
]
},
properties: {
lineColor: [130, 154, 227],
lineWidth: 0.05,
opacity: 0.2,
fillColor: [0, 0, 256],
},
id: uuid()
},
```
which then gets processed by the kepler's geojson processor
```
const datasets = []
dataSource.features.map((feature, index) =>
datasets.push({
info: {
label: `${index}`,
id: `${index}`
},
data: processGeojson(feature)
})
)
useEffect(() => {
dispatch(
addDataToMap({
datasets: datasets,
options: {
centerMap: true,
readOnly: false
},
config: config
})
)
}, [dataSource])
```
The other properties work (lineColor, lineWidth, etc.) It's only the opacity that does not seem to do anything.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start by tracing the feature through processGeojson and addDataToMap, then reproduce the polygon dataset with opacity set to 0.2. Inspect how the processed properties reach the map rendering path and verify that the polygon becomes visibly transparent while lineColor and lineWidth continue to work.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100