Node version: 6.10.2
react-leaflet version: 1.1.6
leaflet version: 1.0.3
Issue is map is not getting load, irrespective of number of times you refresh your screen. Repository on which I am trying this is a basic boiler plate repository with nothing fancy. I have created the boiler plate using create-react-app.
Related
I'm using Leaflet + CartoDB; I've also used Leaflet + Mapbox; and there may also be some Leaflet + GoogleMaps in my future.
My customer asked me this question: where do the Leaflet layers get painted onto the tiles? Is that done by Leaflet? Or by the Tile engine?
Does this change if I'm using a "regular" map engine (such as Mapbox) or if I'm using something like the KML-rendering plugin?
where do the Leaflet layers get painted onto the tiles? Is that done by Leaflet?
By default (unless you're doing something weird), that happens in your web browser, which is compositing DOM elements on top of each other. You can check this by using the developer tools in your browser and inspecting the DOM elements for the tiles, and the <canvas> or <svg> with your vector geometries. They are separate DOM elements, thus your browser is doing the compositing.
Does this change if I'm using a "regular" map engine (such as Mapbox) or if I'm using something like the KML-rendering plugin?
Not really. Mapbox-gl-js uses insane amounts of WebGL, so that means that the brunt of the workload moves from the browser's compositor to a WebGL stack. It still happens in the web browser, albeit in a different part of the browser.
There is no "KML rendering plugin" for leaflet, just KML loading plugins. Vector geometries are still rendered in a <canvas> or <svg> separate from the image tiles for the basemap, then composited.
You can, of course, run your own tile server (with software such as Geoserver, Mapserver, Mapproxy, mapnik+mod_tile, tirex, tilestream, or dozens of others). In that case, you obviously know you are rasterizing your data into tiles.
I have created one QGIS map server for serving map as WMS or WFS feature.
As I am adding the layers in QGIS various thumbnails of QGIS is appearing which I do not want to appear in my map.
Same thing is happening when I am accessing those layers on web via Leaflet. Please help me how to remove these thumbnails.
I am attaching screenshots regarding this problem:
I'm new to leafletjs. Been working on cesiumjs for a while and we are trying leaflet now. The main reason for the switch is to see if there's a huge performance difference.
In Cesium, I had a collection of primitive points that I plotted. What's the most efficient way of plotting 140K points in leafletjs? Using markers or creating individual little circles?
I am also thinking of using the clustering plugin (http://leafletjs.com/2012/08/20/guest-post-markerclusterer-0-1-released.html), so please share any thoughts on performance.
You have 2 common options:
Display your points in a Canvas-based layer, like using Circle Markers and force rendering them on a Canvas instead of SVG (see also Leaflet MaskCanvas plugin). Circle Markers, even on a canvas, still emit events, so you can detect "click" etc.
Use a clustering plugin, like Leaflet.markercluster plugin that you mention for exampe. It can handle your 140k points, depending on the client's computer performance (see https://github.com/Leaflet/Leaflet.markercluster#handling-lots-of-markers and demo http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.50000.html with 50k points, but note that the demo uses an old version of the plugin, whereas the current version is even faster).
Trying to display your 140k points without Canvas or clustering will crash your browser for sure.
If you want to render more than 100k markers, you can use Supercluster library, because Leaflet.markercluster loading of >100k markers could take more than 30 seconds.
I created a github repo to compare initial loading of Leaflet.markercluster and Supercluster.
I have followed several threads on this topic but have not been able to fix the following issues:
How to prevent Leaflet map tile images names from being read out by screen readers?
How to make vector layers (like Circles and Rectangles) tabbable?
How to make tile images not selectable - is this related to #1?
I have tried with current Leaflet distribution 0.7.5 and 1.0 Beta2 - without any success. Here are some related discussions:
Leaflet issue: accessibility improvements
StackOverflow: how to make Leaflet tile layers accessible
Does anyone have a link to share - to a Leaflet based site/page that is WCAG2 compliant?
I've been having difficulty with slow loading of a project I've been looking to fork that was on the Mapbox blog (link here).
I've substituted in my own mapbox key, redefined the bbox to focus on the Ukraine, and re-centered the map on my own mapbox studio baselayer. However, the page loads painfully slowly when I render it in MAMP locally on my computer or when it's uploaded to an S3 bucket.
Not sure what I've done wrong or what I could change to make it render quicker like in the bl.ocks.org example.
Link here for my version of the above project: https://s3.amazonaws.com/conflict.donbass/ukraine2.html
I think has something to do with the bbox size, try setting it to [33, 44.2, 40.6, 50.3]