so i build a custom Leaflet map and I would like to integrate it into my Wiki. I tried both the Kartographer and the Maps extension, but for both I can't find how to feed them the url of my map.
Is this even possible?
If there is such an option in either of these extensions or another extension I have overlooked please let me know.
It is possible now (May 2020) with the Maps extension
So you can add this to a wiki page
{{#display_map:
| image layers=mymap.jpg
| geojson=MyMap
}}
Then create a page in the GeoJson namespace called GeoJson:MyMap to match the param you passed to display_map
Now the map has editable GeoJson data in the wiki and on the GeoJson: namespace page
Now you have a map with GeoJson data that you can add for markers etc
Not all of leaflet's options are available as of yet in mediawiki Maps extension - but a few are - they can be seen by adding the following to a page:
{{#mapsdoc:leaflet|parameters=all}}
Finally there is the maps documentation Maps for MediaWiki Docs
Related
The docs say it's possible so I'm obviously missing something. So far I've tested different variations of marker-url and url- in the Mapbox playground with both single point and feature collections (as shown in the examples) but all I'm getting are the generic markers.
Any guidance to point me in the right direction?
https://api.mapbox.com/styles/v1/mapbox/streets-v11/static/geojson({"type":"FeatureCollection","features":[{"type":"Feature","properties":{"url-":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2599,37.8098]}},{"type":"Feature","properties":{"url-":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2591,37.8062]}},{"type":"Feature","properties":{"url-":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2565,37.8063]}}]})/-122.2647,37.8006,12,0/1080x1080#2x?access_token={token}
This is not reflected in the official documentation, but in order to use a custom marker with a geojson overlay, you can rely on the marker-url property for your features.
If you update your request to the API to the following, you should achieve the desired result:
https://api.mapbox.com/styles/v1/mapbox/streets-v11/static/geojson({"type":"FeatureCollection","features":[{"type":"Feature","properties":{"marker-url":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2599,37.8098]}},{"type":"Feature","properties":{"marker-url":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2591,37.8062]}},{"type":"Feature","properties":{"marker-url":"http%253A%252F%252Fwebsite.com%252Ffiles%252Fmarkers%252Fgreenpin.png"},"geometry":{"type":"Point","coordinates":[-122.2565,37.8063]}}]})/-122.2647,37.8006,12,0/1080x1080#2x?access_token={token}
Disclaimer: I currently work at Mapbox
Does anyone have any example code of using Bing maps as the provider with React-Leaflet? I looked through the docs but it only use openstreetmap. I don't see an example of adding any provider.
I solved my own problem kinda. I could not use React-Leaflet or at least not version 3 so I did it with React, Leaflet, and leaflet-bing-layer. For my needs I also needed to make an api call to render ferry pins. Rather than type it all in here I will include a link to a gist.
I Used google Maps in Flutter and it works out of box for us. I am able to do with the help of documentation like how to use google maps in Flutter But i want to Use Bing Maps in Flutter and all properties like current loc. ,Drawing polylines,custom marker,popUp on marker. Can someone suggest me where to learn thiese things or any other suggestions??
I'm not aware of any Bing Maps map control for Flutter. One option might be to use the open source Flutter map control: https://github.com/fleaflet/flutter_map
Details on how to directly access Bing Maps tiles can be found here: https://learn.microsoft.com/en-us/bingmaps/rest-services/directly-accessing-the-bing-maps-tiles
The open source Flutter Map control has an example that uses Azure Maps as well, which is another Microsoft mapping platform to consider.
I try to build a map for my stormchasing community. It is very important to see urban areas on the map. I tried to add a landuse=residential layer/filter but it seems Mapbox does not support this at all.
Any ideas or solutions on this?
You are correct that the Mapbox Streets v8 tileset does not contain a landuse=residential field. However, this type of data is available in OSM as shown here and can be downloaded using Overpass Turbo - you can refer to the "Add OpenStreetMap data to your Mapbox project" tutorial for steps on how to do that.
Once you've downloaded this data, you can upload it to your Mapbox account, add it as a new layer to your map, and style it accordingly.
I'm new to using Leaflet after having made some interactive choropleth maps using Mapbox's TileMill. If I add a custom polygon layer through using geoJSON, is there any way for me to symbolize (i.e. color) polygons based on values in a linked spreadsheet? What I'm trying to do is find a way to create an online interactive choropleth that can be automatically updated with current data just by making changes to a spreadsheet (i.e. Google doc) rather than adding a new geoJSON layer. Thank you for your help!
You can request your Google Spreadsheet data as JSON and then parse the data on the client-side, updating the data inside your geoJSON. Here's some more documentation via Google. Basically you'd call the spreadsheet, pass the spreadsheet data as JSON to a callback function, then have that function update your geoJSON with the new values. The basic API looks like this, where feed is the type of feed (either list or cell) you'd want and key is your Google Spreadsheet's key.
http://spreadsheets.google.com/feeds/feed/key/worksheet/public/basic?alt=json-in-script&callback=myFunc
It seems like you might have two different Qs there, and since I can't comment to ask for clarification, here are answers to both:
If you're referring to updating colors in Tilemill, then (the title of your question shouldn't refer to Leaflet, and) there's a pretty good workflow here for using a google spreadsheet as a Tilemill data source. Unfortunately though, fill colors are not data-driven properties, so you'll still need to assign colors conditionally in CartoCSS.
If you're referring to updating a thematic layer in the Leaflet client, then there are two options:
Write a script to populate this function and this line with values brought in from your google spreadsheet endpoint.
Use CartoDB. It does pretty much all of what your referring to, with live changes on a leaflet map as you update the table and CartoCSS styles. You can also synchronize a CartoDB table with a google spreadsheet.