New answers tagged

1

The answer to my own question is that the local firewall settings prevented me from downloading the tiles from OSM. The way how to solve it was to set proxy (from within R > link). The con of this solution is that the viewer still doesn`t deliver tiles as the proxy settings at the moment do not apply to RStudio Viewer. Although, the leaflet output appears ...


0

A1: You're receiving an instance of L.LatLng. If you want those coordinates as an array, then just: var arr = [ latlng.lng, latlng.lat ]; Need an array containing just one element, which is an array of the two coordinates? Easy: var arr = [[ latlng.lng, latlng.lat ]]; A2: That indeed fires onLocationFound as fast as the browser's geolocation logic ...


2

You have most probably inverted the Lat and Lng values in either Leaflet or PostGIS. Let's have: Point1: Lat: -12.99835864475412 / Lng: -38.506194949150085 Point2: Lat: -12.999215865191118 / Lng: -38.50590527057648 Point3: Lat: -38.506194949150085 / Lng: -12.99835864475412 (inverted from Point1) Point4: Lat: -38.50590527057648 / Lng: -12.999215865191118 ...


2

The reason the Haversine equation is used for the 4326 calculation is that this is a geographic coordinate system. That means that the coordinates are still on a sphere, they are not mathematically transformed to a flat surface. A projected coordinate system would have this equation or some similar construct already "built-in", so to speak. The Web Mercator ...


0

So the issue I think is that your creating a new info window each time you hover over a feature hovers[layer] = 1; var infowindow = new cdb.vis.Vis.addInfowindow(map, markerLayer.getSubLayer(layer), ['cartodb_id']); $('#map').append(infowindow.render().el); if(_.any(hovers)) { ...


0

Haversine distance formula calculates on a sphere, which is going to be a closer calculation than a straight line distance calculation that does not take into consideration the curvature of the Earth. This Math SE Q&A may give you some additional insight. From link: The Haversine formula gives the "as-the-crow-flies" distance, i.e., the great ...


1

No. Leaflet does not implement fancy reprojection. You will have better luck if you manually reproject your data from EPSG:4326 into EPSG:3857, and then use the EPSG:3857 coordinates into a Leaflet map with CRS.Simple. My tool of choice for reprojections is ogr2ogr, although you can do it in javascript only by using proj4js.


2

The GeoJSON is valid and renders fine, see http://playground-leaflet.rhcloud.com/kogi/edit?html,output. However, the use of jquery to fetch it is not. Make sure the request is returning JSON (hint: use dataType: 'json' in your jquery ajax call), and do not stringify the result Ion the contrary, run JSON.parse() if all you've got is a string). If you ...


1

Yes, you can use layer.bringToFront() and layer.bringToBack() methods of leaflet. See the docs here.


0

I ran into a similar issue today-- I needed to load each tile into a separate canvas element, then operate on each to pixel of each tile to transform the image. Using L.tileLayer.canvas and this example from John Gravois I was able to grab each tile, access the pixels, and then invert the colors (inversion code from this Mozilla Developer Network help ...


0

I ran into a similar issue today-- I needed to load each tile into a separate canvas element, then operate on each to pixel of each tile to transform the image. Using L.tileLayer.canvas and this example from John Gravois I was able to grab each tile, access the pixels, and then invert the colors (inversion code from this Mozilla Developer Network help ...


0

If you're willing to use TileMill and MBTiles, you can do this pretty easily using CartoCSS to style the original Tiff, and output an MBTiles file. #dem { raster-opacity:1; raster-scaling:lanczos; raster-colorizer-default-mode: linear; raster-colorizer-default-color: transparent; raster-colorizer-stops: stop(0,#aaf) stop(100, #afa); } ...


0

Current versions of leaflet do not add a L.Control.Layers to the map by default. I suggest you check if you're using a recent version, and check if you are manually adding a layers control somewhere.


1

See https://github.com/bbecquet/Leaflet.RotatedMarker. Alternatively, use a L.DivIcon and apply CSS transforms to its contents.


2

All controls in Leaflet should inherit the removeFrom method, so to remove your existing layerscontrol, you can use: map.layerscontrol.removeFrom(map);


0

There is no native leaflet solution. One other way is use https://github.com/erictheise/rrose Nice Demo: http://jsfiddle.net/asleepwalker/6m81vtad/


0

I haven't got any solutions for accessing KMZ files via a My Maps MSID/MID in Leaflet. However, in general, to load a KMZ file in Leaflet, you can use JSZip (along with the getBinaryContent method of JSZipUtils) to extract the KML, then Leaflet Omnivore to parse the result. JSZip will produce an object containing all the files in an archive, and you can ...


1

wheelPxPerZoomLevel: 150 is the option that it seems to be affecting the mouse wheel zoom "speed". // @option wheelPxPerZoomLevel: Number = 50 // How many scroll pixels (as reported by [L.DomEvent.getWheelDelta](#domevent-getwheeldelta)) // mean a change of one full zoom level. Smaller values will make wheel-zooming // faster (and vice versa). ...


0

There appears to be an option that is not directly listed on the website documentation but the source has JsDoc lines for it... this.options.zoomDelta is where you want to set the amount the zoom is changed by. this is your current Map object. https://github.com/Leaflet/Leaflet/blob/6e8ac319931da744810bef81fffbfc4adbf3a39a/src/map/Map.js#L94 ...


6

There is a hasLayer method provided by Leaflet. It's a Boolean that returns true if already on the map. See: http://leafletjs.com/reference.html#map-haslayer


0

set view won't actually PAN the map to the point but will jump to it. panTo is what you want to use instead. Works just like setView but will pan to the place (if possible/not too far away, I think) instead of jumping


2

You can work with layer.bringToFront(), bringToBack() or setZIndex() to reorder your layers. If you want one layer to always be below all others you can listen for the layer's add event and then bring it to the back (and bring the other to the front the same way): var C300mVar1 = new L.geoJson(C300mVar1, { onEachFeature: function(feature, layer) { ...


1

WMS cannot handle properties of the features displayed in a bbox (it can only fetch properties of a feature given a point, read the docs for WMS's getFeatureInfo). What you might want to do is using a different approach, like doing a WFS request to geoserver, which will return the geometries and properties of all features inside a bounding box.


1

The legend does not depend on the existence of any particular layer. The part that you are missing here is a getColor function. Copying the one from the tutorial in question: function getColor(d) { return d > 1000 ? '#800026' : d > 500 ? '#BD0026' : d > 200 ? '#E31A1C' : d > 100 ? '#FC4E2A' : d ...


2

To change the vehicle type, you would use: control.getRouter().options.urlParameters.vehicle = 'foot'; However, the router does not automatically recalculate the route when you change the parameters, so to get the foot directions to show up, you will need to request it again: control.route();


1

While it isn't baked into leaflet, there is: https://github.com/robertleeplummerjr/Leaflet.glify which is based off of http://bl.ocks.org/Sumbera/c6fed35c377a46ff74c3 The demo loads 86,000 points and all the polygons behind them in about 0.06 seconds. If you position the map away from the the points and then pull them back into view you'll see what I mean. ...


2

Use two nested loops: for (var i = minLat; i <= maxLat; i+=0.03) { for (var j = minLng; j <= maxLng; j+=0.03) { arr.push([i,j]); } } Also, with a fixed distance between each coordinate pair. keep in mind that the earth is not a flat surface, so a difference of 0.03 degrees of longitude is not the same over different latitudes.


2

As ghybs suggests in the comment above, you may find the LeafletSlider plugin useful. It has some idiosyncrasies that make it unsuitable for some uses, but if all you need to do is step through consecutive years, it should suit your purposes fine. If you pass it a L.layerGroup object with the layers you want to use, it will place a JQueryUI slider control on ...


2

The L.geoJson() constructor is actually just a convenient tool to convert GeoJSON data into Leaflet vector / path object(s) (like L.polyline, L.polygon, etc.). It also attaches the extra information that may be contained in the GeoJSON data into the created Leaflet objects (in layer.feature.properties for example). Therefore, if the GPS track that you ...


2

Instead of creating a convex hull over a set of points with the same attributes, create a Voronoi tesselation of all points, then merge the Voronoi polygons of those points with the same attributes. There are lots of ways to process the information you may have, and what I just said is one idea on how to do it. Voronoi + merge might create multipolygons, ...


1

According to the answer here, Leaflet doesn't "remember" what and whether a layer was filtered, so you need to reinitialise the layer when your filter changes. Something like this... You'll need to store your data somewhere, and you'll need to call the function from your init function with the default value. (BTW if you're going to have more than two ...


2

This is perfectly explained in the Leaflet API reference for map options.


0

above answer is correct, but getFeatureInfoUrl function creates only the WFS request of crs EPSG:4326. uses this modified function, because this way WFS request is created based on used crs, regardless of whether it is 4326 or 3857: getFeatureInfoUrl: function (latlng) { // Construct a GetFeatureInfo request URL given a point var point = ...


0

Your code contains: &CQL_FILTER=user_id=1 And I will guess that the two =s are messing up the URL. In Leaflet WMS tilelayers, any extra options which are not defined will be passed to the WMS server as parameters in each request URL, so: var layer = L.tileLayer.wms( 'http://my_wms_adress:8080/geoserver/my_location/wms', { ...


2

The Leaflet way: L.map('map', {attributionControl: false, etc...}) A simple $('.leaflet-control-attribution').hide() or non jQuery document.getElementsByClassName( 'leaflet-control-attribution' )[0].style.display = 'none';. Vladimir himself says it's OK to remove it: https://groups.google.com/d/msg/leaflet-js/fA6M7fbchOs/JTNVhqdc7JcJ, but it seems like ...


1

Scale dependent rules need to be applied via min/max scale denominators. https://github.com/mapnik/mapnik/wiki/MinScaleDenominator Converting mapnik scales to map scales requires a conversion. The table below is a good start http://wiki.openstreetmap.org/wiki/MinScaleDenominator My example ended up working with something like below <Rule> ...


1

I know this question is really old now, but if anyone get the same problem as he got, maybe this could be helpful ! Your piece of code seems to be good in theory. As I used arcGIS/Leaflet in exactly the same way. But yea, problem could come from missing spatial reference (or maybe incorrect format (image/png or image/jpeg). For the spatial reference, here ...


1

As per @IvanSanchez' suggestion I'm going g to have web-ready 8-bit rasters with accompanying json metadata files. The metadata files have max and min values from the original 32-bit rasters which we use to interpolate the 0-255 values from the 8bit rasters so we can explore the values in real time.


1

You do realize that your tutorial for "featureOver" makes you superimpose a new layer / feature above your track. Therefore, the latter can no longer be clicked on. You could either implement your "featureClick" listener on the added layer / feature as well, so that it opens your sidebar. Or you could rather change the display properties of the ...


3

You can initialize your Borne geoJson layer without any data but with a styling function specified in the options: var Borne = new L.GeoJSON(false, { style: function (feature) { return {color: feature.properties.color}; } }); This style will be applied to any data you add later with addData.


0

You can use the show() (the sublayer you have clicked on) or hide() (the rest of the sublayers) methods as explained in this tutorial.


1

You can set the line color based on the length value with: layer.setStyle({ color: 'red' }); And you can use a function to determine that color based on then length of the line var determineColor = function(length) { if (length > 4000) { return 'red'; } else if (length > 2500) { return 'orange'; } else if (length > 1500) { ...



Top 50 recent answers are included