ADD: added tracklist and automated update
This commit is contained in:
@@ -4,36 +4,45 @@ import React, { Component } from "react";
|
||||
import { MapContainer, TileLayer,Marker, Popup } from 'react-leaflet'
|
||||
import { friend,Hostile, iconShip,createIcon } from "./icon";
|
||||
import "./OpenSeaMap.scss"
|
||||
import { sendMsg } from '../api';
|
||||
|
||||
|
||||
// import icon from 'leaflet/dist/images/marker-icon.png';
|
||||
class OpenSeaMap extends Component {
|
||||
|
||||
componentDidMount() {
|
||||
// setInterval(() => this.setState({ time: Date.now()}), 1000)
|
||||
setInterval(() => this.props.parentCallback(), 3000)
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
handleClick(e)
|
||||
{
|
||||
// console.log(e.target)
|
||||
console.log("hello world");
|
||||
}
|
||||
|
||||
makeIcon(index, entity)
|
||||
{
|
||||
var icon;
|
||||
// switch (entity.Side)
|
||||
// {
|
||||
// case "Friend":
|
||||
// icon = friend;
|
||||
// break;
|
||||
// case "Hostile":
|
||||
// icon = Hostile;
|
||||
// break;
|
||||
// default:
|
||||
|
||||
// break;
|
||||
// }
|
||||
icon = createIcon(entity.Type,entity.Side)
|
||||
return (
|
||||
<Marker name={"test"} key={index} icon={icon} position={entity.position} >
|
||||
<Popup>
|
||||
<Marker name={entity.Name} key={index} icon={icon} position={entity.position}
|
||||
|
||||
eventHandlers={{
|
||||
click: (e) => {
|
||||
console.log(e.target.options.name); // will print 'FooBar' in console
|
||||
},
|
||||
}} >
|
||||
|
||||
{/* <Popup>
|
||||
Omu-Aran the Head Post of Igbomina land,
|
||||
is a town in the Nigerian state of Kwara.
|
||||
It originated from Ife and currently the local
|
||||
government headquarters of Irepodun local government.
|
||||
</Popup>
|
||||
</Popup> */}
|
||||
</Marker>
|
||||
|
||||
);
|
||||
@@ -45,7 +54,7 @@ class OpenSeaMap extends Component {
|
||||
// ));
|
||||
|
||||
return (
|
||||
<div className='container' >
|
||||
<div className='map' >
|
||||
<MapContainer MapContainer center={[51.505, -0.09]} zoom={13} scrollWheelZoom={true}>
|
||||
<TileLayer
|
||||
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
|
||||
@@ -54,14 +63,6 @@ class OpenSeaMap extends Component {
|
||||
{/* {positions} */}
|
||||
{this.props.Entities.map((pos, index) => (
|
||||
this.makeIcon(index,pos)
|
||||
// <Marker name={"test"} key={index} icon={friend} position={pos.position} >
|
||||
// <Popup>
|
||||
// Omu-Aran the Head Post of Igbomina land,
|
||||
// is a town in the Nigerian state of Kwara.
|
||||
// It originated from Ife and currently the local
|
||||
// government headquarters of Irepodun local government.
|
||||
// </Popup>
|
||||
// </Marker>
|
||||
))}
|
||||
</MapContainer>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user