|
|
|
@ -5,6 +5,37 @@ import { useActiveTypes } from "../stores/useActiveTypes";
|
|
|
|
import { useGridSize } from "../stores/useGridSize";
|
|
|
|
import { useGridSize } from "../stores/useGridSize";
|
|
|
|
import { useMemo } from "react";
|
|
|
|
import { useMemo } from "react";
|
|
|
|
import { useRateExpression } from "./useRateExpression";
|
|
|
|
import { useRateExpression } from "./useRateExpression";
|
|
|
|
|
|
|
|
import { useModel } from "../stores/useModel";
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const usePointSizeScale = () => {
|
|
|
|
|
|
|
|
const rate = useRateExpression();
|
|
|
|
|
|
|
|
const { model } = useModel();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (model === "ml") {
|
|
|
|
|
|
|
|
return ["interpolate", ["linear"], rate, 0, 0, 10, 5, 50, 20];
|
|
|
|
|
|
|
|
// return [
|
|
|
|
|
|
|
|
// "interpolate",
|
|
|
|
|
|
|
|
// ["linear"],
|
|
|
|
|
|
|
|
// rate,
|
|
|
|
|
|
|
|
// 0,
|
|
|
|
|
|
|
|
// 0,
|
|
|
|
|
|
|
|
// 10,
|
|
|
|
|
|
|
|
// 3,
|
|
|
|
|
|
|
|
// 20,
|
|
|
|
|
|
|
|
// 4,
|
|
|
|
|
|
|
|
// 30,
|
|
|
|
|
|
|
|
// 5,
|
|
|
|
|
|
|
|
// 40,
|
|
|
|
|
|
|
|
// 6,
|
|
|
|
|
|
|
|
// 80,
|
|
|
|
|
|
|
|
// 9,
|
|
|
|
|
|
|
|
// 100,
|
|
|
|
|
|
|
|
// 15,
|
|
|
|
|
|
|
|
// ];
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return ["interpolate", ["linear"], rate, 0, 0, 10, 5, 50, 20];
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
export const Points = ({ rate: rateRange }) => {
|
|
|
|
export const Points = ({ rate: rateRange }) => {
|
|
|
|
const { gridSize } = useGridSize();
|
|
|
|
const { gridSize } = useGridSize();
|
|
|
|
@ -12,6 +43,7 @@ export const Points = ({ rate: rateRange }) => {
|
|
|
|
const { activeTypes } = useActiveTypes();
|
|
|
|
const { activeTypes } = useActiveTypes();
|
|
|
|
|
|
|
|
|
|
|
|
const rate = useRateExpression();
|
|
|
|
const rate = useRateExpression();
|
|
|
|
|
|
|
|
const sizeScale = usePointSizeScale();
|
|
|
|
|
|
|
|
|
|
|
|
const filter = useMemo(() => {
|
|
|
|
const filter = useMemo(() => {
|
|
|
|
let result = [
|
|
|
|
let result = [
|
|
|
|
@ -34,7 +66,7 @@ export const Points = ({ rate: rateRange }) => {
|
|
|
|
|
|
|
|
|
|
|
|
const paintConfig = {
|
|
|
|
const paintConfig = {
|
|
|
|
...pointLayer.paint,
|
|
|
|
...pointLayer.paint,
|
|
|
|
"circle-radius": ["interpolate", ["linear"], rate, 0, 0, 10, 5, 50, 20],
|
|
|
|
"circle-radius": sizeScale,
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
|