Tag Info

Hot answers tagged

8

There's a lot of subjectivity still in play, but I think a broad answer to your question is that it's getting easier every day to use GeoJSON directly in a leaflet map without tiling, and this is ultimately a good direction for interactive maps to be going. As such I tend to build maps using your third option above. That comes with a few caveats. You ...


4

Echoing Bill: it depends. I would say never/rarely do the second option. Keep your data and styling separate. The first and third options might be rephrased as "when should I use a service to render map features?" and "when should I use Leaflet to render map features in-browser?" For me, I try to do the third option whenever I can. Rendering features in ...


3

There is a plugin for that: Leaflet.Terminator.


2

Did you find a solution? I've created a function which does this for me. function mapToPosition(position){ lon = position.coords.longitude; lat = position.coords.latitude; var marker = new L.Marker([lat,lon],{title: "Not at the right spot? Drag me!"}).addTo(map); marker.dragging.enable(); marker.on('dragend', function(e){ var ...


2

AFAIK the label of a feature has by default the same z-index than the marker and the "correct" way to change the z-index of a marker is with the constructor option zIndexOffset or the method setZIndexOffset.


2

Terraformer can parse WKT, and it can project from Geographic Latlong to WebMercator, but it can't write a WKT. However we can build the WKT string from projected polygon. First refer to the terraformer-core and teraformer wkt parser libraries in your code, like this: <script src="terraformer-1.0.3.min.js"></script> <script ...


2

The controls on the map appear to be OpenLayers. Here's how you can find out yourself what kind of data it's using in the client in Chrome or Firefox: In Chrome, go to Menu > Tools > Developer Tools and switch to the Network tab. In Firefox, go to Menu > Developer > Network Refresh the page, pan around the map a few times, see what resources load.


2

It does really depend on the project and what type of data you're using (and what you know how to use) but Tom Macwright made this handy simple Map Makers cheat sheet: https://github.com/tmcw/mapmakers-cheatsheet


2

No, you don't need a special apache module. You don't even need a webserver at all because you can just to open file:///C:/Profiles/ApachePHP/apache/www/mwork/maperitive_test1/index_leaf.html in your browser. The problem is your osmUrl. Either you have to make C:\Profiles\Maperitive\Tiles available through your webserver. Or you have to replace the URL with ...


2

Your approach looks ok to me. On my local system, I skipped the TileCache part. Mapnik fills the folders in the way Openlayers reads them from disk using file:///... I don't know if leaflet can do it the same way. For the satellite tiles: You have no chance to get them legally. Google and bing do not like storing their tiles locally. If you have ...


1

Figured it out thanks to some documentation reading. The polygon in leaflet responds to setStyle but the marker can be changed using setIcon Documentation for setIcon


1

Seems like you can't do that because a marker uses an image to render. I think you'd need to grab the icon class of your marker and change the "iconUrl" attribute to whatever new image you want. Source: Leaflet API Reference Hope that helps, DR


1

For the satellite tiles, you could render them yourself using Mapnik. Landsat and NAIP are two sources of free satellite raster data. edit: I've also just come across a growing dataset (also free) of High Resolution Orthoimagery, which I've never used, but is much higher detail than the other two sources.


1

The quickest way to do this is https://mangomap.com, you should be able to get the whole thing set up in about 10 minutes without writing a single line of code. I'm the CEO, just give me a ping on chris@mangomap.com if you have any questions.


1

Hey plain CSS did the trick: .leaflet-container { background-color:rgba(255,0,0,0.0); }


1

An alternative solution to that is to stop event propagation with JavaScript (like it's done for Leaflet controls, e.g. zoom buttons): var div = L.DomUtil.get('div_id'); if (!L.Browser.touch) { L.DomEvent.disableClickPropagation(div); L.DomEvent.on(div, 'mousewheel', L.DomEvent.stopPropagation); } else { L.DomEvent.on(div, 'click', ...


1

Using the example from the Leaflet website, note where the L.Control object is instantiated as info; this is the <div> box in the upper-right associated with the map's hover interaction. Here is where it is defined in index.html from the Leaflet example: // control that shows state info on hover var info = L.control(); info.onAdd = ...


1

You need to set the desired basemap as: var basemap = L.Tilelayer (drop "new")... They're all being added as overlay layers as is


1

You would have to store polygon IDs in onEachFeature(feature, layer) handler (e.g. layer._polygonId = feature.id), so later you can iterate over layers (e.g. jsonLayer.eachLayer(function(layer) { setHighlighted(layer, doesRelate(layer._polygonId, selectedId)); });.


1

Computing a Convex Hull is possible in OpenLayers by using the external JSTS library. Although I haven't tried its implementation for convex hull, I have used it to create buffer/union etc. For more please go to this url also here you will find its implementation.


1

Short answer The containerPoint methods date from a feature request back in 2012, and today, they're a bit confusing. The best answer is Leaflet maintainer Vladimir Agafonkin's description: "layerPoint is actually a point relative to the map layer (the div which contains tiles and markers), not the outer map container. What you need is ...


1

For a one-time conversion I would have used the accepted answer from @Sasa Ivetic but needed something real-time, and Terraformer worked decently for that. Unfortunately it's only for single features by default, so for multiple features you need to loop through the array and add an ID to each feature: var FeatureCollection = { type: "FeatureCollection", ...



Only top voted, non community-wiki answers of a minimum length are eligible