Tag Info

Hot answers tagged

4

What you are describing is a well known issue with animation of Google basemap tiles in Leaflet, and unfortunately, I don't think there is an easy solution. The map in the fiddle uses the Leaflet Google.js plugin by Pavel Shramov. As explained in this answer by @mourner, this plugin "acts as a proxy to the original Google Maps API v3, so it doesn't work ...


3

I don't know of any built-in functionality or plugins for this, but here is a solution that should get you started (using jQuery). In short, because the Layer Control is generating dynamic html, we use jQuery to select the leaflet control layers overlays, and add a description. Then make use of these built in Leaflet map events to show and hide the ...


3

Use the TopoColour plugin, which is already compatible with QGIS 2.x but is not yet available in the official repository: https://github.com/nyalldawson/topocolour Download the zip file and unzip it in the QGIS plugin directory: Linux: ~/.qgis2/python/plugins Windows: C:\Users\{username}\.qgis2\python\plugins


2

building from this answer, you can extend L.Polyline to include any number of variables as options customPolyline = L.Polyline.extend({ options: { // default values, you can override these when constructing a new customPolyline speed: '25', bearing: '140' } }); now create your polylines, and add to the map: latlngs = ...


2

You can do it pretty easy, here's some code: onEachFeature: function (feature, layer) { var content = ""; content = content + "<b><u>" + feature.id.split('.')[0] + "</b></u><br>"; delete feature.properties.bbox; for (var name in feature.properties) {content = content + "<b>" ...


2

in order to style the markers that L.esri.featureLayer helps you add to the map, you can use L.icon. see this leaflet tutorial and this example for more info.


2

Use dragend method for the marker. Look through the jsfiddle.I hope it helps. http://jsfiddle.net/Poshan/w6ej59jk/5/


2

IE8 can't handle trailing commas in object literals map = new L.Map('map', { zoomControl: true, center: [49.2500, -123.1000], zoom: 10, // Delete this comma }) There are three other trailing commas, around line 57, 67, 96 in the inline script on the index page (console debug in IE will show you where) There will probably be other issues in ...


2

What you should look for is called 'Map Matching'. I've opened sourced my idea based on GraphHopper very recently here so it is still in a VERY early shape, please give feedback via providing data or creating issues etc.


2

Like HasT said, you need to uncomment the line where you set the view on the map. map.setView(new L.LatLng(59.9244, 10.7582),10); This is because the minimap needs to centre itself on creation, which it does by checking the centre of the main map. This is done before your Ajax call returns, so no position has been set yet. I made a JsFiddle to try out ...


2

I think this is an issue with CORS. The layer you are trying to use is on an older version of server (10.0x) which mean that it does not ship with support for cross origin requests (CORS) out of the box. Esri Leaflet assumes newer versions of server (10.1x) which include support for CORS. You just need to tell Esri Leaflet not to use CORS the following ...


2

You need to initialize your map object. See the source code here for an example: http://leafletjs.com/examples/quick-start-example.html Add something like this to harris.js before you call map.on. var map = L.map('map').setView([51.505, -0.09], 13); What's happening is map.on is undefined. Map itself is not defined in JavaScript, but by default DOM ...


2

Wire up a button that calls map.setView http://leafletjs.com/reference.html#map-setview map.setView(lat, lng, zoom);


2

Since Github supports CORS, you can use jQuery's getJSON() or a micro-library like corslite to grab your geojson without altering it. Here's a working example using $.getJSON() (notice that I took out your script tag referencing your geojson file): <html> <head> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" ...


2

Your github file cannot just contain a value; it must define a variable that will be defined when the file is included as javascript. var geojsonFeature = { "type": "FeatureCollection", "crs": { "type": "name", "properties": { "name": "urn:ogc:def:crs:OGC:1.3:CRS84" } }, .... }; Then you can use this variable as an input to your GeoJSON layer var ...


1

I think you are asking the wrong question ... Leaflet does the right thing: the tiles you see in your errors belong to your boundaries. To be convinced of it, please have a look at this JSFiddle where your boundaries are shown as a rectangle. You see that Leaflet only loads the tiles needed and that 14/4105/5993.png is shown


1

I don't think Leaflet supports this out of the box. However, I think you can implement such a behavior using events such as tileloadstart and tileload: http://leafletjs.com/reference.html#tilelayer-tileloadstart For example, you could start counting time the first time a tileloadstart is fired using setTimeout, and cancel it (using clearTimeout) once a ...


1

If you edit your code this way, it works (note the ADDED line) var Markerlayer = L.geoJson(null, { pointToLayer: function(feature, latlng) { marker = L.marker(latlng, {}); marker.options['title'] = feature.properties['uname']; // ADDED return marker; }, onEachFeature: function(feature, ...


1

Not tested, but something like this should work var oldLayer = ""; // to start, declare an empty variable outside of the function scope function clickFeature(e) { var layer = e.target; layer.setIcon(layer.options.icon = icon2); // only attempt to change oldLayer icon back to original if oldLayer defined if (oldLayer) ...


1

You forgot to upload 2 files <script src="nzoutline.geojson"></script> <script src="sectors.geojson"></script> They should be in the same directory as 167finalAD.html


1

This plugin for Debian lacks this problem, but does not meet terms of service of google (Oficial example). Or try this code: var map = L.map( 'map' ).setView( [ 51.505, -0.09 ], 13 ); L.tileLayer( '//mt{s}.googleapis.com/vt?x={x}&y={y}&z={z}', { maxZoom: 18, subdomains: [ 0, 1, 2, 3 ] } ).addTo( map ); var marker = L.marker( [ 51.5, -0.09 ] ...


1

The popup is printing the text just as you have written it. Use javascript variables in marker.bindPopup, not php: marker.bindPopup(data[i].name + "<br>" + data[i].user_date + "<br>" + data[i].user_time + "<br>" + data[i].address + "<br>" + data[i].icon_name).addTo(map);


1

Because of the way the BoM appears to produce those images, the "content" will always be in the same locations in geographic space, and in the same location in pixel space. So you should be able to use a Leaflet JS image overlay, specifying whatever turns out to be the equivalent of the outer bounds of the source PNG for the imageBounds argument. An ...


1

There is no builtin functionality for this in Leaflet, and no plugin to do it that I am aware of either. You could maybe produce something like it with some CSS transform3d hack, but it would likely look pretty horrible. In general, I think OpenLayers 3 might be more suited for pseudo-3d functionality. I have not used OpenLayers 3 myself, though.


1

I found that one way to do this is using the CartoDB Core API. Check this example: http://jsfiddle.net/eczajk1/ok0nseom/


1

Calculate the bounding box of the line (using getBounds() in Leaflet), put a circle with the center at the center of the bounding box, and the radius chosen as half width or height of the bounding box, whichever is highest.


1

i wrote a quick example of loading dojo and leaflet in the same application here that being said, if you are committed to using dojo, it probably makes more sense to maintain a mapping application written with our ArcGIS API for JavaScript, which loads the framework automatically (and uses it internally) than it does to use Esri Leaflet. additonal ...


1

I have realised that proj4js doesn't work in IE below version 9


1

Your best bet is to convert it to JSON. I assume the binary array is a file type, so you have a X,Y,(Attribute) grid in some format and you want to display it on Leaflet. If you have a way of reading the file, then work out how to output it just as points, so CSV, or GeoJSON as a first preference. If there are less than, say, 3000 points, that will render ...


1

I was having the same issue than you, and then realize that it was a problem on the data. In order to log those errors on the console, you have to put: omnivore.csv('your_file.csv', null, L.mapbox.featureLayer()).addTo(map) .on('error', function(error) { console.log(error); }); And it will tell you which line is not working, such as an invalid lat ...



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