Skip to content

Commit

Permalink
Item name to item_language
Browse files Browse the repository at this point in the history
  • Loading branch information
@autowp
autowp committed Mar 9, 2017
1 parent 3510ccb commit 6c8f593
Show file tree
Hide file tree
Showing 24 changed files with 2,674 additions and 190 deletions.
223 changes: 97 additions & 126 deletions assets/default/map/index.js
View file
@@ -1,9 +1,19 @@
var $ = require("jquery");
var ol = require("openlayers");
var markerSrc = require("img/map-marker-icon.png");
var popupMarkup = require('./popup.html');
var leaflet = require("leaflet");
require("leaflet/dist/leaflet.css");
var popupMarkup = require('./popup.html');
require("./index.less");

require('webgl-heatmap-leaflet/dist/webgl-heatmap');
require('imports?L=leaflet!webgl-heatmap-leaflet/dist/webgl-heatmap-leaflet');

delete leaflet.Icon.Default.prototype._getIconUrl;
leaflet.Icon.Default.mergeOptions({
iconRetinaUrl: require('leaflet/dist/images/marker-icon-2x.png'),
iconUrl: require('leaflet/dist/images/marker-icon.png'),
shadowUrl: require('leaflet/dist/images/marker-shadow.png'),
});

module.exports = {
init: function(options) {
this.currentPopup = null;
Expand All @@ -12,167 +22,128 @@ module.exports = {
this.xhrTimeout = null;

var self = this;

this.markers = [];

this.zoomStarted = false;

$('#google-map').each(function() {

self.map = new ol.Map({
target: this,
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
/*visible: true,
preload: Infinity,
source: new ol.source.BingMaps({
key: 'Aid2FAZU17lX3ZNTeW7Q-SuqQ3K8h2W6BLpgomM2mQB-lLAXWBakYm9bbjTlv4gX',
imagerySet: 'Road'
// use maxZoom 19 to see stretched tiles instead of the BingMaps
// "no photos at this zoom level" tiles
// maxZoom: 19
})*/
})
],
view: new ol.View({
center: ol.proj.fromLonLat([13.45, 52.48]),
zoom: 4,
//minZoom: 4
})
});

self.vectorLayer = new ol.layer.Vector();
self.map.addLayer(self.vectorLayer);
var defaultZoom = 4;

self.iconStyle = require('map/icon-style');
self.map = leaflet.map(this).setView([50, 20], defaultZoom);
self.map.on('zoom', function() {
//console.log('viewreset');
});

self.map.on('moveend', function() {
self.queueLoadData();
self.map.on('zoomstart', function() {
self.zoomStarted = true;
if (self.xhr) {
self.xhr.abort();
self.xhr = null;
}
});

self.map.on('zoomend', function() {
self.queueLoadData();
self.zoomStarted = false;
self.queueLoadData(self.map.getZoom());
self.heatmap.setSize(self.zoomToSize(self.map.getZoom()));
});

self.map.on("pointermove", function (evt) {
var hit = this.forEachFeatureAtPixel(evt.pixel, function (feature, layer) {
return true;
});
if (hit) {
this.getTarget().style.cursor = 'pointer';
} else {
this.getTarget().style.cursor = '';
}
self.map.on('moveend', function() {
self.queueLoadData(self.map.getZoom());
});

self.map.on("click", function(e) {
self.map.forEachFeatureAtPixel(e.pixel, function (feature, layer) {

self.closePopup();

var factory = feature.get('place');

var element = self.popupHtml(factory);
var point = ol.proj.fromLonLat([factory.location.lng, factory.location.lat]);

var popup = new ol.Overlay({
element: element
});
popup.setPosition(point);
self.map.addOverlay(popup);

self.currentPopup = popup;
});
leaflet.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>',
//maxZoom: 18
}).addTo(self.map);

self.heatmap = new leaflet.webGLHeatmap({
size: self.zoomToSize(defaultZoom),
opacity: 0.5,
alphaRange: 0.5
});
self.heatmap.addTo(self.map);

/*
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var latLng = new googlemaps.LatLng(position.coords.latitude, position.coords.longitude);
var geocoder = new googlemaps.Geocoder();
geocoder.geocode({'latLng': latLng}, function(results, status) {
if (status == googlemaps.GeocoderStatus.OK) {
var country = null;
$.each(results, function(i, address) {
$.each(address.address_components, function(j, component) {
$.each(component.types, function(k, type) {
if (type == 'country') {
country = component.long_name;
}
if (country) {
return false;
}
});
if (country) {
return false;
}
});
if (country) {
return false;
}
});
if (country) {
geocoder.geocode({'address': country}, function(results, status) {
$.each(results, function(i, address) {
self.map.fitBounds(address.geometry.viewport);
self.loadData();
return false;
});
});
}
}
});
});
}*/
self.queueLoadData(defaultZoom);
});
},
queueLoadData: function() {
zoomToSize: function(zoom) {
return 2000000 / zoom;
},
queueLoadData: function(zoom) {
if (this.xhrTimeout) {
clearTimeout(this.xhrTimeout);
this.xhrTimeout = null;
}
var self = this;
this.xhrTimeout = setTimeout(function() {
self.loadData();
}, 300);
if (! self.zoomStarted) {
self.loadData(zoom);
}
}, 100);
},
loadData: function() {
var extent = this.map.getView().calculateExtent(this.map.getSize());
extent = ol.proj.transformExtent(extent, 'EPSG:3857', 'EPSG:4326');
isHeatmap: function(zoom) {
return zoom < 6;
},
loadData: function(zoom) {
if (this.xhr) {
this.xhr.abort();
this.xhr = null;
}

var params = {
bounds: extent.join(',')
var params = {
bounds: this.map.getBounds().pad(0.1).toBBoxString(),
'points-only': this.isHeatmap(zoom) ? 1 : 0
};
var self = this;
$.getJSON('/map/data', params, function(data) {
self.renderData(data);
this.xhr = $.getJSON('/map/data', params, function(data) {
if (self.map.getZoom() == zoom) {
self.renderData(data, zoom);
}
});

self.closePopup();
},
renderData: function(data) {
renderData: function(data, zoom) {
var self = this;

var features = [];
$.map(this.markers, function(marker) {
marker.remove(null);
});
self.markers = [];

var points = [];

var isHeatmap = this.isHeatmap(zoom);

$.each(data, function(key, factory) {
if (factory.location) {
var point = ol.proj.fromLonLat([factory.location.lng, factory.location.lat]);

var iconFeature = new ol.Feature({
geometry: new ol.geom.Point(point),
place: factory
});

iconFeature.setStyle(self.iconStyle);
features.push(iconFeature);
if (isHeatmap) {
points.push([
factory.location.lat,
factory.location.lng,
1
]);
} else {
var marker = leaflet.marker([factory.location.lat, factory.location.lng]).addTo(self.map);

var element = self.popupHtml(factory);

marker.bindPopup(element);

self.markers.push(marker);
}
}
});

var vectorSource = new ol.source.Vector({
features: features
});

this.vectorLayer.setSource(vectorSource);
if (isHeatmap) {
this.heatmap.setData(points);
this.heatmap.addTo(this.map);
} else {
this.heatmap.remove();
}
},
popupHtml: function(factory) {

Expand Down

0 comments on commit 6c8f593

Please sign in to comment.