How can we create a google static map with a custom polyline overlay?
I need to create a map image, which has to be embedded into a pdf report. The basemap will be google, and on top of that, we need to show the markers and polylines.
I could see some docs to include marker while creating google static maps. but couldn't figure out a solution for including custom polyline on that. I've the polyline data in my database as geojson and can change it to any other defined format if required, from a nodejs api.
Could anyone suggest a solution for this?
Thanks in advance
Related
I have a Flutter project using flutter_map and tiles from Mapbox. I also have a very large list of coordinates to create polylines on the map. The coordinates are worldwide geographical boundaries. It's working fine but when displaying the polylines the map gets a bit unresponsive due to the amount of polyline data.
How would I be able to create a custom map with the coordinates/polyline data already embedded in the map to avoid having to draw polylines separately?
Thanks
You could use Mapbox Studio to create a map style with sources and layers referencing these coordinates/polyline data. This tutorial on creating a custom style is a great place to get started.
Been trying to get my head around this for some time although clearly i'm missing something
what i am trying to do is not draw a new map although provide a src link to say (https://www.google.com/maps/d/u/0/embed?mid=1xI_dALvs0A-oySG-dkf4BYeDyBk) to something of the below
https://developers.google.com/maps/documentation/javascript/styling
I want to embed my custom map with the markers to my site and styling it
I guess map = new google.maps.Map(document.getElementById('map') has something to do with the drawing of the new map although not too sure as to take it out or what.
is there anyway to use the custom map + .json code rather than hard coding an array of poi's as would like to rely on it pointing through to the custom map link for the markers
is there any better way to get around this
Google Maps JavaScript API can load data that were stored in GeoJSON format. So you have to look into GeoJSON specification and create corresponding file for your markers (or polylines, polygons, etc.).
The Google Maps JavaScript API documentation explains how to load the GeoJSON data via Data layer of maps:
https://developers.google.com/maps/documentation/javascript/datalayer#load_geojson
You should combine the styling example with GeoJSON example from the documentation to achieve your goal.
Here is the github link - https://github.com/hpi1hpi/custom-google-map-with-json
Add google map with custom color and data from JSON with slider
Good day !
I'm developing custom service, that will grab params form Google Maps url, like https://www.google.nl/maps/search/fietsenmaker/#52.1285737,5.0837216,13z/data=!3m1!4b1?hl=en. From this example it's possible to take search param, longitude, latitude and zoom level. All this params will pass to Google Places API and markers will be drawn on Google map. The main problem, i can't get this markers look same as on embed Google Maps. Here is attachment:
In simple words:
Need to dynamically embed map with listing of places, that was originally in search param and place map center according lat/long with original markers as on embed map.
Any ideas ?
Thanks !
Google Embed API will allow you to embed maps with starting params, like map center, object name. You can find it here https://developers.google.com/maps/documentation/embed/guide
Good luck everybody !
I'm not sure where to start looking in the documentation, but I'm trying to load map images of cities with their boundaries outlined.
Like this...
Any help getting started would be greatly appreciated, I'm pretty new to the maps api.
Thanks
There is currently no way to request a map with boundaries automatically rendered on it. Your best bet is to pull the polygon information from another system and render using an encoded polyline if you're using the Static Map API or regular overlays in the JavaScript API.
Google Static Map API
Here it is
here, some links to help you:
Geographical boundaries of states/provinces -> Google Maps Polygon
EInsert extension
Boundary Draw - Google Map Application
Getting neighbourhood boundaries from Google Maps API
https://stackoverflow.com/questions/8441467/can-you-draw-custom-search-boundaries-in-google-map
Ability to draw boundaries on Google Maps
I am using this api
http://gwt-google-apis.googlecode.com/svn/javadoc/maps/1.1/index.html
, the GWT Google Maps API, in my application.
Now I want to render some text on different coordinates on the map. But.... how?
I have googled around, but it seems there isn't a clear solution?
Any ideas if/how it is possible using some sort of JSNI solution?
You can add markers to the map as described in the GWT Maps Getting started Guide:
LatLng cawkerCity = LatLng.newInstance(39.509, -98.434);
map.addOverlay(new Marker(cawkerCity));
If you want to render your text directly on the map, you can extend com.google.gwt.maps.client.overlay.Overlay (to create a text overlay). An example of a custom map overlay can be found at http://timlwhite.typepad.com/blog/2008/08/creating-custom-google-maps-overlays-with-gwt-widgets.html