Skip to content

feat: Add non-linear piecewise focus range to VisConfig sliders#3465

Open
igorDykhta wants to merge 2 commits into
masterfrom
igr/adaptive-slider
Open

feat: Add non-linear piecewise focus range to VisConfig sliders#3465
igorDykhta wants to merge 2 commits into
masterfrom
igr/adaptive-slider

Conversation

@igorDykhta
Copy link
Copy Markdown
Collaborator

Adds focusRange and focusWeight options to VisConfigNumber sliders, allowing a configurable sub-range to occupy a disproportionately larger portion of the slider's physical width for finer control. Applied to heatmap intensity (0–1 range gets 60% of slider space out of the full 0–20 range). The slider splits into up to three zones (before, focus, after) with proportional width distribution.

Example: The heatmap intensity slider has a range of 0 to 20, but in practice, most useful adjustments happen between 0 and 1. With a linear slider, that entire 0–1 sweet spot occupies only 5% of the slider's pixel width — just a few pixels — making precise adjustments nearly impossible. This change lets the 0–1 range take up 40% of the slider, so users can fine-tune intensity without fighting the UI.

Signed-off-by: Ihor Dykhta <ihordykhta@Ihors-MacBook-Pro.local>
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR introduces optional non-linear (piecewise-linear) scaling for numeric VisConfig sliders so a “focus” sub-range can occupy a larger fraction of the slider’s physical width, improving fine-grained control (applied to heatmap intensity).

Changes:

  • Added slider-scale-utils (value↔position mapping + createSliderScale) and exported it from @kepler.gl/utils.
  • Plumbed an optional scaleConfig through VisConfigSliderRangeSliderSlider to render/drag using the non-linear mapping.
  • Added focusRange/focusWeight to VisConfigNumber and configured heatmap intensity to focus on [0.001, 1].

Reviewed changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 4 comments.

Show a summary per file
File Description
test/node/utils/slider-scale-utils-test.js Adds unit tests for piecewise slider scale mapping and edge cases.
test/node/utils/index.js Registers the new slider-scale utils test suite.
src/utils/src/slider-scale-utils.ts Implements piecewise value↔position mapping and scale config creation.
src/utils/src/index.ts Re-exports the new slider scale utilities from @kepler.gl/utils.
src/types/layers.d.ts Extends VisConfigNumber with optional focusRange/focusWeight.
src/layers/src/heatmap-layer/heatmap-layer.ts Applies focused slider scaling to heatmap intensity vis config.
src/components/src/side-panel/layer-panel/vis-config-slider.tsx Generates and forwards scaleConfig from vis config settings.
src/components/src/common/slider/slider.tsx Updates slider rendering/dragging to support optional non-linear scale config.
src/components/src/common/range-slider.tsx Passes scaleConfig down into Slider.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/utils/src/slider-scale-utils.ts Outdated
Comment thread src/utils/src/slider-scale-utils.ts Outdated
Comment thread src/utils/src/slider-scale-utils.ts Outdated
Comment thread src/layers/src/heatmap-layer/heatmap-layer.ts
Signed-off-by: Ihor Dykhta <ihordykhta@Ihors-MacBook-Pro.local>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants