UX revamp for the listings map - #646
Open
noahbaxter wants to merge 23 commits into
Open
Conversation
Clustering kicked in while the map still had room to draw every pin, so a normal neighbourhood view was bubbles rather than listings and finding one meant zooming past where you wanted to be.
…photo Ordered by what a renter rules a listing out on: the photo, the address, the four figures, then the qualifying facts. The old popup printed every field it knew about, so a column of "Unknown" buried the handful that were filled in. About one listing in eight arrives with no photo. Those opened with an empty gap that read as a broken image, so the slot shows the street instead.
Seventeen filter sections in boxed accordions left almost no room for the map they filter. Flat list, hairlines instead of boxes, and the accent kept for interactive state.
Identical dots make you open a popup to learn the one number you compare listings on first. The pin carries the price and its colour places it in the range, so a whole neighbourhood reads without a click.
A map alone is not scannable: comparing ten listings meant opening ten popups and remembering them. The panel reads the rendered markers rather than the Leaflet map object, which dash-leaflet never exposes, so the list and the pins cannot disagree about what is in view.
These carried open-ended endpoints meaning "no limit", which is a real answer for rent but not for square footage, where the top of the data is the top.
…e map The link opened the same pano already embedded above it. Searching the address lands on the place with directions and satellite instead. The layers control sat permanently expanded over the top-left corner. It stays mounted, with its callbacks, but off the map.
The count reported everything that passed the filters, including listings nowhere near the screen, so it never matched what you could see.
The map reopened on the whole of LA County every time, discarding the pan and zoom someone had just spent time on. Rent and For sale keep separate positions because they are separate searches. Stored in localStorage.
Dash puts `transition: all` on the handle carrier and the filled range, so both trailed the pointer during a drag, and it rings a handle that still holds focus after a click. Neither is a state these sliders should show. Also drops the listed-date range picker for the preset buttons above it. It was the only control here nobody used at more than one setting.
Two number fields say nothing about where the listings actually are, so people picked a range and found it empty. The graph shows the shape of the market behind the handles, with the excluded shoulders dimmed.
An absolute ramp paints an expensive neighbourhood one colour and a cheap one another, repeating what the address already said. Ranking against what is on screen answers "cheap for what I am looking at" instead.
Small button rows had grown three shapes for the same job. Two builders now, and the shape carries the meaning: a joined strip picks one, separate pills pick any. Pets and rent control become chips because both are really three-way questions with a large unknown bucket, which a dropdown cannot express.
Leaflet pans the map when a popup does not fit, which takes the listings you were comparing off screen. The popup finds the room itself instead. Opening a clustered listing used to fly the map to it, costing the same view.
The tokens were defined for dark only, so light mode ran on whatever fallback each rule happened to hardcode. That is how one control came out amber in one theme and teal in the other.
The pins were too small to read a price on at a glance, and nothing said which row the open popup belonged to.
Leaflet hardcodes the attribution white with dark text, which at night is a lit strip in the corner of a dark map. Esri's terms want the credit kept, so it takes the theme rather than being switched off.
A popup covers the pins the listing is being compared against, and with the column up there is already a panel the width of a popup on screen. Same renderer either way, so the two cannot drift.
The caption cost a row of height on the one listing in eight with no photo, and a pano is visibly a street without being told so. The embed takes no parameter to hide its controls, footer or navigation arrows and cannot be styled across origins, so the frame is overhung past all four edges and clipped back to the tile.
Which listing is open is a fact about the session, not about which panel is up, so collapsing the column hands it to a popup on its pin and reopening takes it back. The row link needs listing_url on the map payload, about 250 KB gzipped. That is what lets a row know it has no page to link to, which one in eight does not. The MLS lookup URL is a guess and the popup already labels it as one.
noahbaxter
marked this pull request as ready for review
September 6, 2026 21:15
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Hey there,
Came across this project a few days ago, super useful dataset but found it a bit frustrating to use so I took the liberty of revamping the UI/UX to feel more modern and snappy, reminiscent of sites like Zillow. Mobile could still use some TLC in a future pass but it gets the same improvements (minus the list view).
General
Map
Filters
List
Lmk if you have any questions or concerns.