mapbox

Double on click event with mapbox gl

戏子无情 提交于 2019-12-22 18:11:48
问题 I am redrawing layers on style.load event and removing the layers map.on('style.load', function() { loadByBounds(tempBounds) }); function loadByBounds(b) { if (map.getLayer("cluster-count")) { map.removeLayer("cluster-count"); } ... map.on('click', 'unclustered-point', function(e) { var popup = new mapboxgl.Popup() .setLngLat(e.features[0].geometry.coordinates) .setHTML(text) .addTo(map); })} But how to remove map.on('click') events? As when I click the point the Popup() displays 2 times. And

How to zoom on marker click event in Mapbox Leaflet?

非 Y 不嫁゛ 提交于 2019-12-22 17:46:18
问题 I want to zoom on a marker when it is clicked. I am using Mapbox and leaflet. I tried: marker.on('click', function(e){ map.setView([e.lat, e.lng], 12); }); But it gives me some kind of error: TypeError: t is null I even tried: marker.on('click', function(e){ map.fitBounds(marker.getBounds()); }); 回答1: To get the latitude and longitude of the event, you must use e.latlng: latlng reference. Use this: marker.on('click', function(e){ map.setView(e.latlng, 13); }); 回答2: Try marker.on('click',

how to customise cluster icon in mapbox-gl?

我与影子孤独终老i 提交于 2019-12-22 14:02:14
问题 I want to implement clustering in my map. I found example of simple clustering from Mapbox Cluster Example but My code is here, where marker ==> {marker-symbol} is from studio. but it is not working. Is it possible to achieve output of cluster? 回答1: Solved By following code var layers = [ [150], [20], [0] ]; layers.forEach(function(layer, i) { map.addLayer({ "id": "cluster-" + i, "source": "markers", "type": "symbol", "layout": { "text-field": "{point_count}", "text-font": [ "Arial Unicode MS

positioning a mapbox/leaflet map inside a container div

爷,独闯天下 提交于 2019-12-22 08:50:34
问题 I am working with Mapbox in a Ruby on Rails app. For the life of me, I cannot get the map to adhere to any simple CSS. The only CSS that allows the map to appear is giving it an absolute position with a top and bottom of 0. Altering anything other than the height and width causes the map to disappear. I want to have the map centered inside a container div. Here is the code: <div id="map-container"> <div id='map'> </div> </div> <script> L.mapbox.accessToken = 'pk

MapBox iOS different marker images?

我怕爱的太早我们不能终老 提交于 2019-12-22 08:17:24
问题 Is there a way to add an ID or something, that i am able to set custom marker images? I have multiple markers with numbers, and i need that every new marker has another image. For example: marker1 - marker_1_image marker2 - marker_2_image Atm i am only able to set 1 image (globaly) to all markers: func mapView(mapView: MGLMapView, imageForAnnotation annotation: MGLAnnotation) -> MGLAnnotationImage? { var annotationImage = mapView.dequeueReusableAnnotationImageWithIdentifier("place") if

Mapbox GL cluster zoom

余生颓废 提交于 2019-12-22 08:04:34
问题 I'm trying to show all the markers when the user click on a cluster. This is what I have done so far: map.on('click', function (e) { var cluster_features = map.queryRenderedFeatures(e.point, { layers: [ 'cluster-0', 'cluster-1', 'cluster-2' ] }); var cluster_feature = cluster_features[0]; if (cluster_feature && cluster_feature.properties.cluster) { map.jumpTo({ around: e.lngLat, zoom: map.getZoom() + 2 }); } }); This is adding 2 levels of zoom every time the user click on a marker. It works

How to find out map tile coordinates from latitude and longitude?

落花浮王杯 提交于 2019-12-22 04:43:24
问题 I'm using Mapbox vector tiles to gather specific data from a backend process. In the examples, they provide a link of a Manhattan tile: http://a.tiles.mapbox.com/v3/examples.map-zr0njcqy/14/4823/6160.png being the tile z / x / y coordinates 14 / 4823 / 6160 I know from navigating the map that the position of latitude 40.706119 and longitude -74.017554 is inside that tile. I also deduct from how map works that working with zoom 14 the entire map is composed from 16384 x 16384 tiles being 14/0

Check if marker is in view (map) - mapbox

爱⌒轻易说出口 提交于 2019-12-22 01:15:45
问题 I want to check if marker is on mapview or out of the map. I am putting marker of the map and not able to check if it on currentView or not. I have tried below code. this.map.getBounds().contains(e.layer.getLatLng()); but it is returning me true. map is returning its old lat lng i.e bounds (I think so) 回答1: map.getBounds().contains(myMarker.getLatLng()) map.getBounds(): Returns the LatLngBounds of the current map view. latLngBounds.contains(): Returns true if the rectangle contains the given

使用threebox整合mapbox gl和three js DEMO

南楼画角 提交于 2019-12-22 00:51:48
准备 three.js mapbox-gl.js mapbox-gl.css threebox.js DEMO <!doctype html> <head> <title>Threebox example</title> <script src="../dist/threebox.js" type="text/javascript"></script> <script src='mapbox-gl.js'></script> <link href='mapbox-gl.css' rel='stylesheet' /> <style> body, html { width: 100%; height: 100%; margin: 0; } #map { width: 100%; height: 100%; } </style> </head> <body> <div id='map' class='map'></div> <script> mapboxgl.accessToken = 'pk.eyJ1Ijoia3JvbmljayIsImEiOiJjaWxyZGZwcHQwOHRidWxrbnd0OTB0cDBzIn0.u2R3NY5PnevWH3cHRk6TWQ'; var map = new mapboxgl.Map({ container: 'map', style:

Is is possible to use Font Awesome icons in Mapbox Markers?

混江龙づ霸主 提交于 2019-12-21 21:13:12
问题 I'm using the Maki set of icons, but they are very limited and would like to be able to use Font Awesome icons. Is this possible? Here's the code I'm using to set up the marker icons. marker.setIcon(L.mapbox.marker.icon({ 'title': jobid, 'marker-color': '#e32f2f', 'marker-symbol': 'square' })); 回答1: If you've included the font awesome CSS on your page, you can use the L.DivIcon constructor to create custom icon. <style> /* * Unlike other icons, you can style `L.divIcon` instances with CSS. *