hook up query parameters form with rest query
This commit is contained in:
parent
3574df8ae0
commit
7c70da4bed
3 changed files with 19 additions and 17 deletions
|
|
@ -1,4 +1,4 @@
|
|||
// @ts-nocheck
|
||||
// // @ts-nocheck
|
||||
import crossfilter from "crossfilter2";
|
||||
import * as d3 from "d3";
|
||||
import mapboxgl from "mapbox-gl";
|
||||
|
|
@ -6,6 +6,7 @@ import 'mapbox-gl/dist/mapbox-gl.css'; // this hides the map for some reason
|
|||
import { useEffect, useRef } from "react";
|
||||
import { renderToString } from 'react-dom/server';
|
||||
import "../assets/Map.css";
|
||||
import { Metric, type ParameterValues } from "./Parameters";
|
||||
import { Button } from "./ui/button";
|
||||
import { ScrollArea } from "./ui/scroll-area";
|
||||
import { Separator } from "./ui/separator";
|
||||
|
|
@ -13,6 +14,7 @@ import { Separator } from "./ui/separator";
|
|||
export function Map(
|
||||
props: {
|
||||
listingData: any;
|
||||
queryParameters: ParameterValues | null;
|
||||
}
|
||||
) {
|
||||
const data = props.listingData;
|
||||
|
|
@ -33,8 +35,11 @@ export function Map(
|
|||
let heatmap = null;
|
||||
|
||||
// rivet
|
||||
var filter = { city: 'London', country: null, mode: 'qmprice' };
|
||||
var filter = { city: 'London', country: null, mode: Metric.qmprice };
|
||||
// filter['countries'] = Array.from(new Set(data.features.map(function (d) { return d['properties']['country'] })));
|
||||
if (props.queryParameters) {
|
||||
filter['mode'] = props.queryParameters.metric;
|
||||
}
|
||||
// rivets.bind(document.getElementById('overlay'), { filter: filter });
|
||||
const mapRef = useRef(mapboxgl.Map)
|
||||
const mapContainerRef = useRef('map-container')
|
||||
|
|
@ -85,7 +90,7 @@ export function Map(
|
|||
heatmap.setCellDensity(0.5); // small value == bigger hexagons
|
||||
heatmap.setPropertyName(filter.mode);
|
||||
|
||||
if (filter.mode === 'qmprice') {
|
||||
if (filter.mode === Metric.qmprice) {
|
||||
// if we visualize sqm based data, remove properties where we have no data
|
||||
qmDim.filter(function (d) { return d > 0; });
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue