diff options
author | Anton Tananaev <anton.tananaev@gmail.com> | 2018-09-20 14:57:42 +1200 |
---|---|---|
committer | Anton Tananaev <anton.tananaev@gmail.com> | 2018-09-20 14:57:42 +1200 |
commit | cabb500189f027bc64d6b62bde9cf017efa4c0d4 (patch) | |
tree | 5b4ca61cddf5f2254a4229db657075f85dd9b840 /modern/src/MainMap.js | |
parent | 1461b376e41cf41cd9e49f6df200ba3f573fa127 (diff) | |
download | trackermap-web-cabb500189f027bc64d6b62bde9cf017efa4c0d4.tar.gz trackermap-web-cabb500189f027bc64d6b62bde9cf017efa4c0d4.tar.bz2 trackermap-web-cabb500189f027bc64d6b62bde9cf017efa4c0d4.zip |
Div icon as marker
Diffstat (limited to 'modern/src/MainMap.js')
-rw-r--r-- | modern/src/MainMap.js | 12 |
1 files changed, 7 insertions, 5 deletions
diff --git a/modern/src/MainMap.js b/modern/src/MainMap.js index 7655aee8..fab17777 100644 --- a/modern/src/MainMap.js +++ b/modern/src/MainMap.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import { Map, TileLayer, Marker, Popup } from 'react-leaflet'; import { connect } from 'react-redux' +import DivIcon from './leaflet/DivIcon'; const mapStateToProps = state => ({ positions: state.positions @@ -17,11 +18,12 @@ class MainMap extends Component { const position = [this.state.lat, this.state.lng] const markers = this.props.positions.map(position => - <Marker key={position.id.toString()} position={{ lat: position.latitude, lng: position.longitude }}> - <Popup> - A pretty CSS3 popup. <br /> Easily customizable. - </Popup> - </Marker> + <DivIcon position={{ lat: position.latitude, lng: position.longitude }} className="" iconSize={[38, 95]}> + <svg className="user-location" viewBox="0 0 120 120" version="1.1" + xmlns="http://www.w3.org/2000/svg"> + <text x="20" y="60" style={{fontSize: '48px'}}>TEST</text> + </svg> + </DivIcon> ); return ( |