ztimson/map-alliance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases 1 Activity

Fixed drawing on mobile

Browse Source
This commit is contained in:
Zakary Timson
2019-08-24 11:26:30 -04:00
parent 5bfbb7c6f1
commit bc673ae6ab
3 changed files with 71 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/components/toolbar/toolbar.component.ts
View File

@@ -20,7 +20,7 @@ export class ToolbarComponent implements AfterViewInit {
@HostListener('window:resize', ['$event'])
ngAfterViewInit() {
setTimeout(() => this.maxMenuItems = Math.floor((document.getElementById('toolbar').offsetWidth - 200) / 75), 1);
setTimeout(() => this.maxMenuItems = Math.floor((document.getElementById('toolbar').offsetWidth - 100) / 75), 1);
}
clickWrapper(item: ToolbarItem, menu?: ToolbarItem[]) {

19
src/app/services/map.service.ts
View File

@@ -36,7 +36,7 @@ export class MapService {
map;
constructor(private elementId: string) {
this.map = L.map(elementId, {attributionControl: false, zoomControl: false}).setView({lat: 0, lng: 0}, 10);
this.map = L.map(elementId, {attributionControl: false, zoomControl: false, maxBoundsViscosity: 1}).setView({lat: 0, lng: 0}, 10);
this.map.on('click', (e) => this.click.next(e.latlng));
this.setMapLayer();
}
@@ -140,21 +140,20 @@ export class MapService {
}
startDrawing() {
this.map.dragging.disable();
this.drawListener = () => {
let poly = L.polyline([], {interactive: true, color: this.drawingColor, weight: this.drawingWeight}).addTo(this.map);
this.map.setMaxBounds(this.map.getBounds());
this.drawListener = e => {
let poly = L.polyline([e.latlng], {interactive: true, color: this.drawingColor, weight: this.drawingWeight}).addTo(this.map);
poly.on('click', () => { if(this.deleteMode) this.map.removeLayer(poly); });
let pushLine = e => poly.addLatLng(e.latlng);
this.map.on('mousemove', pushLine);
this.map.on('mouseup', () => this.map.off('mousemove', pushLine));
this.map.on('mousemove touchmove', pushLine);
this.map.on('mouseup touchend', () => this.map.off('mousemove touchmove', pushLine));
};
this.map.on('mousedown', this.drawListener);
this.map.on('mousedown touchstart', this.drawListener);
}
stopDrawing() {
this.map.dragging.enable();
this.map.off('mousedown', this.drawListener);
this.map.setMaxBounds(null);
this.map.off('mousedown touchstart', this.drawListener);
}
}