tanner/sensors
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Take API key, adjust ranges

Browse Source
This commit is contained in:
Tanner Collin 2024-07-15 19:39:22 +00:00
parent ba630b6fb9
commit 88dbba168c
2 changed files with 23 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
mapper/src/App.css
View File

@ -8,9 +8,8 @@ body {
.container { .container {
display: flex; display: flex;
flex-wrap: wrap; flex-direction: column;
justify-content: center; align-items: center;
margin-bottom: 3rem;
} }
.chart { .chart {

30
mapper/src/App.js
View File

@ -11,14 +11,13 @@ import 'leaflet/dist/leaflet.css';
let tzcache = {}; let tzcache = {};
const durations = [ const durations = [
{id: 0, len: 'Day', win: '10m', full: '10 min', delta: [1, 'days'], format: 'HH'}, {id: 0, len: 'Day', win: '1m', full: '1 min', delta: [1, 'days'], format: 'HH'},
{id: 1, len: 'Day', win: '1h', full: '1 hour', delta: [1, 'days'], format: 'HH'}, {id: 1, len: 'Week', win: '3m', full: '3 min', delta: [7, 'days'], format: 'HH'},
{id: 2, len: 'Week', win: '1h', full: '1 hour', delta: [7, 'days'], format: 'HH'}, {id: 2, len: 'Week', win: '10m', full: '10 min', delta: [7, 'days'], format: 'HH'},
{id: 3, len: 'Week', win: '1d', full: '1 day', delta: [7, 'days'], format: 'D'}, {id: 3, len: 'Month', win: '10m', full: '10 min', delta: [1, 'months'], format: 'D'},
{id: 4, len: 'Month', win: '1d', full: '1 day', delta: [1, 'months'], format: 'D'}, {id: 4, len: 'Month', win: '1h', full: '1 hour', delta: [1, 'months'], format: 'D'},
{id: 5, len: 'Month', win: '7d', full: '7 day', delta: [1, 'months'], format: 'D'}, {id: 5, len: 'Year', win: '2h', full: '2 hours', delta: [1, 'years'], format: 'M/D'},
{id: 6, len: 'Year', win: '1d', full: '1 day', delta: [1, 'years'], format: 'M/D'}, {id: 6, len: 'Year', win: '1d', full: '1 day', delta: [1, 'years'], format: 'M/D'},
{id: 7, len: 'Year', win: '30d', full: '30 day', delta: [1, 'years'], format: 'M'},
]; ];
const units = { const units = {
@ -69,6 +68,12 @@ function Owntracks({end, duration}) {
const coords = data.length ? data.map(({ lat, lon }) => [lat, lon]).filter(([lat, lon]) => lat !== null || lon !== null) : []; const coords = data.length ? data.map(({ lat, lon }) => [lat, lon]).filter(([lat, lon]) => lat !== null || lon !== null) : [];
const handleSubmit = (e) => {
e.preventDefault();
const api_key = e.target[0].value;
localStorage.setItem('api_key', api_key);
}
return ( return (
<> <>
{loading ? {loading ?
@ -78,12 +83,19 @@ function Owntracks({end, duration}) {
<MapContainer center={coords[coords.length-1]} zoom={13} scrollWheelZoom={true} style={{ width: '100%', height: 'calc(100vh - 2.5rem)' }}> <MapContainer center={coords[coords.length-1]} zoom={13} scrollWheelZoom={true} style={{ width: '100%', height: 'calc(100vh - 2.5rem)' }}>
<TileLayer <TileLayer
attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors' attribution='&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" url='https://maptiles.p.rapidapi.com/en/map/v1/{z}/{x}/{y}.png?rapidapi-key=4375b0b1d8msh0c9e7fa3efb9adfp1769dfjsnd603a0387fea'
/> />
<Polyline pathOptions={{color: 'blue'}} positions={coords} /> <Polyline pathOptions={{color: 'blue'}} positions={coords} />
</MapContainer> </MapContainer>
: :
<p>No coords</p> <>
<p>No data</p>
<form onSubmit={handleSubmit}>
<p>
<input placeholder='API key' />
</p>
</form>
</>
} }
</> </>
); );