Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature request: Satellite view #24

Open
sslupsky opened this issue Jul 5, 2016 · 6 comments
Open

Feature request: Satellite view #24

sslupsky opened this issue Jul 5, 2016 · 6 comments

Comments

@sslupsky
Copy link

sslupsky commented Jul 5, 2016

Would be nice to be able to render a satellite view of the map.

@daniellee
Copy link
Contributor

When I started with the panel, I had 5 different maps including a satellite view. In the end, I dumped them and just kept one map that suits the dark theme and one that suits the light theme. The satellite view didn't work that well for visualization and that is the reason there isn't one. Do you have a particular use case that needs a satellite view?

@sslupsky
Copy link
Author

sslupsky commented Jul 6, 2016

Hi @daniellee ,

My use case(s) involve remote sensor networks that are usually in areas with very few public roads nearby. The locations are generally very industrial in nature. In particular, mine sites where sensors are installed throughout the mine site.

@svet-b
Copy link

svet-b commented Nov 23, 2017

Thanks for a wonderful plugin! I'd like to second this request. We work with sensor data from rural locations across Africa, where the availability of digitized mapping data is minimal.

So while it's already great that we're able to see the geospatial relationships in the data through the following:
screen shot 2017-11-23 at 12 36 37 pm
...it would be about 1000% more helpful to see the datapoints, which correspond to houses, overlaid on a satellite map instead:
screen shot 2017-11-23 at 12 41 41 pm

I understand this may be a niche use case for the user base as a whole and that you may not want to implement and maintain full-on mapping selection - but it would be a game-changer for us. Could you give some pointers on the bits of code would need to be patched to just change the map source? Thanks in advance!

@svet-b
Copy link

svet-b commented Nov 25, 2017

Poked around a bit and it ended up being relatively straightforward to get this to work by modifying the JS. Of course it would be nice if there was a UI control for setting custom tile server parameters - but, for the time being - for anyone else that's interested in getting this to work and does not care about elegance of implementation, here's a way:

  1. In worldmap.js, around line 40 you can define additional tile server sources as members of the tileServers array. Here are two that provide respectively a pure satellite and a hybrid view
'Esri Satellite': { url: 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community', subdomains: 'abcd' },
'HERE Hybrid': { url: 'https://{s}.aerial.maps.cit.api.here.com/maptile/2.1/maptile/newest/hybrid.day/{z}/{x}/{y}/256/png8?app_id=<app_id>&app_code=<app_code>&lg=eng', attribution: 'Map &copy; 1987-2014 <a href="http://developer.here.com">HERE</a>', subdomains: '1234'}

I looked up these two at http://leaflet-extras.github.io/leaflet-providers/preview/ - there are many options there, but these seemed to be the best satellite ones. Note that in order to use the HERE tile server you need to sign up for API access and replace the <api_id> and <app_code> placeholders with the respective values allocated to you.

  1. In worldmap_ctrl.js, in the setMapProvider function edit the tile server setting accordingly, e.g. set this.tileServer = 'Esri Satellite';.

  2. Under the above scenario, no filters would be applied to the map tiles. Depending on your preferences, you can also tweak the CSS filter by editing the class set in the setMapSaturationClass function in worldmap_ctrl.js and/or the worldmap.(light/dark).css file for your theme.

Hope this might be helpful to anyone else who stumbles upon this page in search for a solution. The following is what I got with the HERE hybrid map, with a CSS filter to dial down saturation and increase brightness of the basemap, in an effort to improve the visibility of the actual data points:
screen shot 2017-11-25 at 5 27 32 pm

@svet-b
Copy link

svet-b commented Nov 20, 2018

FYI, here's a fork that uses the Esri Satellite map as the background: https://github.com/ammpio/worldmap-panel.

The actual diff between this and the original is here

@NateZimmer
Copy link

For it to be a 1 line code change ya would think it wouldn't be too tricky to make it a setting in the plugin for satellite view. Thanks @svet-b for your approach.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants