.q2w-filter

Filter

Filter panel controls for thematic subsets, attribute queries, and training-friendly map exploration.

Preview

Parcel filter

Cirebon Land Value

3 filters

1,248parcels

312selected

Rp 1.2Bmedian

Value thresholdRp 1B+

Usage

<div class="q2w-filter q2w-filter--floating">
  <div class="q2w-filter__head">
    <div>
      <div class="q2w-filter__title">Parcel filter</div>
      <div class="q2w-filter__sub">Cirebon Land Value</div>
    </div>
    <span class="q2w-filter__count">3 filters</span>
  </div>
  <div class="q2w-filter__summary">...</div>
  <div class="q2w-filter__segments">...</div>
  <div class="q2w-filter__range">...</div>
  <div class="q2w-filter__chips">...</div>
  <div class="q2w-filter__footer">...</div>
</div>

Behavior

The docs preview updates segment and chip state. In a real Leaflet app, bind those changes to layer visibility, feature filtering, or server-side query parameters.

← Draw Goto →