comunes/todos-contra-el-fuego-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved firesmap

Browse source
This commit is contained in:
vjrj 2017-12-15 17:43:45 +01:00
parent 4c5aef6e4f
commit 56a7468ae3
7 changed files with 214 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

20
imports/ui/components/Maps/FireList.js
View file

@ -11,15 +11,17 @@ export default function FireList(props) {
const {
fires, scale, useMarkers, nasa
} = props;
const items = fires.map(({ _id, ...otherProps }) => {
if (useMarkers && scale) {
return (<FireIconMark key={_id} nasa={nasa} {...otherProps} />);
}
if (!nasa && !scale) {
return (<FirePixel key={_id} nasa={nasa} {...otherProps} />);
}
return (<FireCircleMark key={_id} nasa={nasa} {...otherProps} />);
});
const useMarks = useMarkers && scale;
const usePixel = !nasa || !scale;
/* console.log(`Using marks: ${useMarks}, using pixels: ${usePixel}`); */
let items;
if (useMarks) {
items = fires.map(({ _id, ...otherProps }) => (<FireIconMark key={_id} nasa={nasa} {...otherProps} />));
} else if (usePixel) {
items = fires.map(({ _id, ...otherProps }) => (<FirePixel key={_id} nasa={nasa} {...otherProps} />));
} else {
items = fires.map(({ _id, ...otherProps }) => (<FireCircleMark key={_id} nasa={nasa} {...otherProps} />));
}
return (<div style={{ display: 'none' }}>{items}</div>);
}

11
imports/ui/components/Maps/FirePixel.js
View file

@ -1,10 +1,19 @@
/* eslint-disable react/jsx-indent-props */
import React from 'react';
import { CircleMarker } from 'react-leaflet';
import PropTypes from 'prop-types';
/* Less acurate (1 pixel per fire) but faster */
const FirePixel = ({ lat, lon, nasa }) => (
<CircleMarker center={[lat, lon]} color={nasa ? 'red' : '#D35400'} stroke={false} fillOpacity="1" fill radius={2} />
<CircleMarker
center={[lat, lon]}
color={nasa ? 'red' : '#D35400'}
stroke={false}
fillOpacity="1"
fill
radius={nasa ? 1 : 2}
/>
);