Color relief support and hillshading improvements. (#1371)

## Launch Checklist

This adds support for `relief-color` property so that it will create an
elevation expression when the button is pressed.
It also adds support for `colorArray` and `numberArray` types so that
the user would be able to add the relevant information.

Before:
<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/250abd81-6176-4711-a1ee-d33d443932d7"
/>

<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/6a1bb268-66db-42a1-97fc-33e5a40863b6"
/>


After:
<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/8ebaa1ea-4ef9-4aed-abcd-3c8b0057ea76"
/>

<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/e0728c92-85f9-4b86-8635-8877cf257b2f"
/>


 - [x] Briefly describe the changes in this PR.
- [x] Include before/after visuals or gifs if this PR includes visual
changes.
 - [x] Write tests for all new functionality.
 - [x] Add an entry to `CHANGELOG.md` under the `## main` section.

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
This commit is contained in:
Harel M
2025-09-11 20:43:20 +03:00
committed by GitHub
parent d81316435b
commit 42e1273241
20 changed files with 258 additions and 53 deletions
+4 -3
View File
@@ -1,8 +1,8 @@
import React from 'react'
import type {CSSProperties} from 'react'
import { BsDiamond, BsDiamondFill, BsFonts } from 'react-icons/bs'
import { MdOutlineCircle, MdPriorityHigh } from 'react-icons/md'
import { BsDiamond, BsDiamondFill, BsFonts, BsSun } from 'react-icons/bs'
import { MdBubbleChart, MdOutlineCircle, MdPriorityHigh } from 'react-icons/md'
import { IoAnalyticsOutline } from 'react-icons/io5'
type IconLayerProps = {
@@ -16,7 +16,8 @@ const IconLayer: React.FC<IconLayerProps> = (props) => {
switch(props.type) {
case 'fill-extrusion': return <BsDiamondFill {...iconProps} />
case 'raster': return <BsDiamond {...iconProps} />
case 'hillshade': return <BsDiamond {...iconProps} />
case 'hillshade': return <BsSun {...iconProps} />
case 'color-relief': return <MdBubbleChart {...iconProps} />
case 'heatmap': return <BsDiamond {...iconProps} />
case 'fill': return <BsDiamond {...iconProps} />
case 'background': return <BsDiamondFill {...iconProps} />