muerwre/orchidmap-front
1
0
Fork 0
mirror of https://github.com/muerwre/orchidmap-front.git synced 2025-04-25 11:06:40 +07:00
Code Issues Projects Releases Packages Wiki Activity Actions

changed user location marker

Browse source
This commit is contained in:
muerwre 2018-08-27 17:43:31 +07:00
parent d39ec1588c
commit 16d04bd6bb
3 changed files with 10 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/UserLocation.jsx
View file

@ -16,7 +16,6 @@ export class UserLocation extends React.Component {
this.mark = null; this.mark = null;
this.map = props.editor.map.map; this.map = props.editor.map.map;
this.location = []; this.location = [];
// this.mark.addTo(props.editor.map.map);
} }
componentDidMount() { componentDidMount() {
@ -39,7 +38,6 @@ export class UserLocation extends React.Component {
if (this.location && this.location.length === 2) { if (this.location && this.location.length === 2) {
this.panMapTo(this.location[0], this.location[1]); this.panMapTo(this.location[0], this.location[1]);
} else { } else {
console.log('hoho');
this.getUserLocation(this.panMapTo); this.getUserLocation(this.panMapTo);
} }
@ -64,6 +62,6 @@ export class UserLocation extends React.Component {
render() { render() {
return ( return (
<div className="locate-geo-button" onClick={this.centerMapOnLocation} /> <div className="locate-geo-button" onClick={this.centerMapOnLocation} />
) );
} }
} }

15
src/containers/App.jsx
View file

@ -4,7 +4,6 @@ import { Editor } from '$modules/Editor';
import { EditorPanel } from '$components/panels/EditorPanel'; import { EditorPanel } from '$components/panels/EditorPanel';
import { Fills } from '$components/Fills'; import { Fills } from '$components/Fills';
import { DEFAULT_LOGO } from '$constants/logos'; import { DEFAULT_LOGO } from '$constants/logos';
import { getUserLocation } from '$utils/geolocation';
import { UserLocation } from '$components/UserLocation'; import { UserLocation } from '$components/UserLocation';
export class App extends React.Component { export class App extends React.Component {
@ -38,20 +37,6 @@ export class App extends React.Component {
setLogo = logo => { setLogo = logo => {
this.setState({ logo }); this.setState({ logo });
}; };
//
// locateByGeo = () => {
// getUserLocation(this.setMapCenterByGeo);
// };
//
// setMapCenterByGeo = position => {
// if (!position || !position.coords || !position.coords.latitude || !position.coords.longitude) return;
//
// const { latitude, longitude } = position.coords;
//
// console.log('panning to', { latitude, longitude });
//
// this.editor.map.map.panTo([latitude, longitude]);
// };
editor = new Editor({ editor = new Editor({
container: 'map', container: 'map',

30
src/styles/map.less
View file

@ -73,36 +73,24 @@
} }
.location-marker { .location-marker {
width: 40px; width: 0;
height: 40px; height: 0;
margin-left: -20px; margin-left: -20px;
margin-top: -20px; margin-top: -20px;
outline: none; outline: none;
z-index: 10001; z-index: 10001;
&:after {
content: ' ';
display: block;
width: 16px;
height: 16px;
border-radius: 8px;
box-shadow: 0 0 0 2px @location_line;
position: absolute;
left: 12px;
top: 12px;
}
&:before { &:before {
content: ' '; content: ' ';
display: block; display: block;
width: 3px; width: 8px;
height: 3px; height: 8px;
border-radius: 5px; border-radius: 8px;
box-shadow: 0 0 0 2px @location_line; box-shadow: 0 0 0 4px @blue_secondary;
background: @location_line;
position: absolute; position: absolute;
left: 19px; left: 16px;
top: 19px; top: 16px;
background: @blue_primary;
} }
} }