I want to show data (numbers) from database on the map, instead of just pointing the place and clicking on the pin to show data, I want it shown already where the pin is. I use this example to make the google map with pins: http://tips4php.net/2010/10/use-php-mysql-and-google-map-api-v3-for-displaying-data-on-map/
I cannot show images because I'm a new user, so here is an example of what I want to show on map, information about prices instead of usual pins: http://www.norc-imobiliare.ro
You may use the dynamic icons of the Image Charts -API. But this API is deprecated, it may(but must not) stop working in 2015.
The other options:
create an own serverside script that takes the strings(prices) as argument and delivers the desired image based on the input.
create a overlay instead of a marker, it may contain any HTML. e.g. infoBox would be usable.
Related
I built a map for our website. There are different pages where we want to show a different places. Therefore i build this one map with all the needed places within. When i embed the card, it shows the summary of all pins in this map. Is there a way, to show one active pin, with its informations?
I searched for different parameters, with which you can alter the display of the card. But none of them is showing an explicit place.
This is a test map showing 4 pins. What should i do to show one chosen pin?
Hope this is understandable.
Thank you in advance.
When you say you want to "show one chosen pin" does it mean you have an info window for this marker and you want to display it?
If so, you can add unique ids for each infowindow and pass the chosen infowindow id to the url with url params such as https://mymapssite?chosenMarkerId=markerId
And then you can check if this param is given and if so do something like
document.getElementById("markerId").open(yourMapsRef, yourMarkerRef);
I am trying to create a static map url using google maps api which looks similar to following
It seems like I require to increase the zoom levels and add a path parameter to the url. I have tried to create url like following
http://maps.googleapis.com/maps/api/staticmap?scale=4&format=png32¢er=50.133751,4.833644&zoom=16&size=640x640&markers=color:red%7C50.133751,4.833644&sensor=false&path=color:blue|48.133751,4.833644|50.133751,4.833644&style=feature:road.local
But it is not giving required results, I need to create dynamic urls based on the addresses and lat/lng values provided. I somehow requires to rotate map in such a way so that it always have a vertical road in the middle so that I can draw a path over it. Additionally, I need a bubble which will show a fixed time to reach say 5/1 min.
I am not using any programming language as of now. I am trying to create these urls manually.
Thanks in advance.
EDIT : I don't need to rotate it now. Just wants to show a 1-5 min directions to the given latitude/longtitude/address value and for message bubble, I have created a static image which I can show as an overlay.
Based on your specific needs to show a path and a time from 1 to 5 minutes I would recommend the following:
First of all you need to know that you have two possibilites concerning the label
Use the standard marker and add a label with a length of 1 and [A-Z], [0-9] (so just the time in your case...one to five)
Use a custom icon which already includes the label (in your case this is a option because you just have to create five images containing "2 min" or something)
For the first option I would take the center of two connected points and add a white marker with the label of the route duration like markers=color:white|label:1|52,5210924,13,39181335. Then you will have a white standard marker on your route like this.
For the second option you can change the marker position away from the path (depending on how your label image looks like) and add the image with the correct duration (1.png, 2.png, 3.png,...) like markers=icon:https//your.path/to/image.png|52,5210924,13,39228335. Like this you can include your own image, which would look like this (sorry for the bad image ;-)).
Adding a custom marker icon with a label (in the URL) is sadly not possible.
I think in your case (also when creating it manually) it would be fine to create 5 bubble images and add those as described to your static map. The faster and easier (but not so good looking) way would be the first option, because you could place it right on the path and don't have to create the bubble images.
i basically want to create a map which shows all the hotspots.
a bit like what this example does: google maps example
for example i'm going on a vacation and i want to know the nearest supermarket, nightclubs and bars. so i want to just type in a location and it shows me these spots with a custom marker.
i can figure most of this out myself but i can't seem to get multiple custom markers in there.
The results returned by a placesSearch contain multiple properties for each result, one of them is the icon-property which contains the URL of the icon, e.g.:http://maps.gstatic.com/mapfiles/place_api/icons/restaurant-71.png
i've found the answer in a different example:
https://developers.google.com/maps/tutorials/customizing/custom-markers#customize_marker_icons_for_different_markers
I'm having a hard time with this project: https://groups.google.com/forum/#!topic/leaflet-js/Vl56hyRp1i8
I hope you guys can help me with this last step.
There will be hundreds of thousands of markers but only the one you search for will be displayed. The content of the tooltips will have to be submitted through a form. I will not know the position for the markers until the mosaic is rendered.
Once the mosaic is rendered we have the position of the markers and I need to be able to search for any marker (by it's ID) and zoom+pan to it while displaying the marker and it's tooltip.
For example if I want to make a mosaic of 500x500 pictures this is what will happen:
we wait for users to submit a picture each until we have 250.000 pictures.
the tooltip meta content will be submitted along with each picture from the users (1 picture for each user) - this is also when the marker ID will be generated
now that we have 250k pictures we can render the mosaic, after the mosaic is complete I will have a text file containing the name and location of each individual picture by row+column
I need to use this file to fill in the position of the marker for each user's picture
I need to be able after this, to display only markers that you search for
when you search for a marker it will be by it's ID so it will be accurate and also I need the zoom+pan function here
when you click on a picture (marker) I need for that marker to appear (unhide the tooltip).
If anybody can help me please, this project is very cool and I would hate to get stuck on it. I will give proper credit and stuff. If you are really good I am even considering monetary rewards.
Thanks.
I suggest to follow this workflow:
For data drawing and editing I use Leaflet plugin leaflet.draw - .
For store data in GeoJSON format I use Leaflet function toGeoJSON(); like that var myMarkers = new L.FeatureGroup();
map.addLayer(myMarkers);
....
// get json
var myMarkersJson = myMarkers.toGeoJSON();
myMarkersJson I upload to MySQL database and store data as json. You can read more about sending json to MySQL using js/jquery here.
For analysis of data I use jQuery parseJSON
For uploading json data again to leaflet map, I use Leaflet function geoJSON();
I think this workflow is the easiest way to store, search and display data in leaflet from MySQL. But this solution may not be suitable for big data analysis.
I have a number of events in the US. I have addresses for these events, but it varies in accuracy. Some might be the full address, some might be just "Austin, Texas".
I'd like to plot these programatically on a map on a webpage with a marker as they'll change fairly regularly. The marker should be an internal link to the relevant row in the table of events lower down on the page.
The image doesn't need to be updated on the fly, just on the (say fortnightly occasions) when an event is added (e.g. a cached image is cleared and recreated)
Rather than use Google maps, I'd like to plot these on top of an image like this: http://0.tqn.com/d/geography/1/0/9/H/usa3.jpg
How would I go about putting markers on this image that correspond to the (rough) geolocation of these events?
Your best bet might be to use google maps and plot the locations and then just pull an image of the map - that way you can let google do all the work of placing the pins but not have to worry about people zooming, since it is a static image file.
Beyond that, you can type the locations into any mapping service to get a rough idea of the location and then place markers or dots on your map file in the same location. This would allow you to choose whatever image or color you want the icons/markers to be, since you will find and place them yourself.