diff --git a/source/UI/css/UI.css b/source/UI/css/UI.css index bf2de2e3..fcac9865 100644 --- a/source/UI/css/UI.css +++ b/source/UI/css/UI.css @@ -1800,7 +1800,6 @@ Maps .OxMap .OxLabel.OxMapControl.OxMapScale { right: 4px; bottom: 19px; - line-height: 1; } .OxMap .OxPlaceControl.OxPlaceFlag { diff --git a/source/UI/js/Map/Map.js b/source/UI/js/Map/Map.js index 5dc8da57..9e5dc936 100644 --- a/source/UI/js/Map/Map.js +++ b/source/UI/js/Map/Map.js @@ -719,6 +719,10 @@ Ox.Map = function(options, self) { - self.options.showZoombar * 16; } + function getMapType() { + return self.options.showLabels ? 'HYBRID' : 'SATELLITE' + } + function getMaxZoom(point, callback) { if (arguments.length == 1) { callback = point; @@ -941,8 +945,11 @@ Ox.Map = function(options, self) { self.center = mapBounds ? mapBounds.getCenter() : new maplibregl.LngLat(0, 0); self.zoom = self.minZoom; - - self.sateliteStyle = { + window.map = that.map = self.map = new maplibregl.Map({ + container: self.$map[0], + center: self.center, + style2: self.options.style, + style: { 'version': 8, 'sources': { 'raster-tiles': { @@ -956,7 +963,7 @@ Ox.Map = function(options, self) { 'tileSize': 256, 'attribution': 'FIXME', - }, + } }, 'layers': [ { @@ -966,13 +973,10 @@ Ox.Map = function(options, self) { 'roundZoom': true, 'minzoom': 0, 'maxzoom': 22 - }, + } ] - }; - window.map = that.map = self.map = new maplibregl.Map({ - container: self.$map[0], - center: self.center, - style: self.options.showLabels ? self.options.style : self.sateliteStyle, + }, + //mapTypeId: google.maps.MapTypeId[getMapType()], //noClear: true, //scrollwheel: !self.options.zoomOnlyWhenFocused, zoom: self.zoom @@ -1149,8 +1153,7 @@ Ox.Map = function(options, self) { } function pan(x, y) { - console.log(x, y, self.$map.width()) - self.map.panBy([x * self.$map.width() / 2, y * self.$map.height() / 2]); + self.map.panBy(x * self.$map.width() / 2, y * self.$map.height() / 2); }; function panToPlace() { @@ -1217,19 +1220,15 @@ Ox.Map = function(options, self) { } function getType(types, data) { // see https://developers.google.com/maps/documentation/javascript/geocoding#GeocodingAddressTypes - types.unshift(data.properties.addresstype) - console.log(types) - + types.push(data.properties.addresstype) var strings = { 'country': ['country'], 'region': [ 'administrative_area', 'colloquial_area', - 'state', 'county', 'region' - ], - 'city': [ - 'locality', 'city', 'town' + 'state', 'county' ], + 'city': ['locality', 'city'], 'borough': ['neighborhood', 'postal_code', 'sublocality', 'suburb', 'borough'], 'street': [ 'intersection', 'route', @@ -1490,7 +1489,7 @@ Ox.Map = function(options, self) { function toggleLabels() { self.options.showLabels = !self.options.showLabels; - self.map.setStyle(self.options.showLabels ? self.options.style : self.sateliteStyle) + self.map.setMapTypeId(google.maps.MapTypeId[getMapType()]); that.triggerEvent('togglelabels', { visible: self.options.showLabels });