Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Adding text overlay to Google Maps

Tags:

google-maps

This is such a simple problem, but I can't find an answer anywhere...

I have a python script that returns a bunch of numbers that represents the total number of items for a given geographic region. I have a bunch of .kml files that I made that represent the geographic bounds for each region. I want to take those numbers created by the script and paste them over top the matching .kml overlay. I can't figure out how to do this. I know how to add the .kml files, but I can't figure out how to do the text. Theres a lot of information on Google's site on how to add marker icons, polylines, even images to the map, but I can't find how to add just a simple bit of text.

like image 381
priestc Avatar asked Jul 03 '09 05:07

priestc


People also ask

Can I add text to a Google map?

You can annotate your map using a variety of tools and content. You may drop placemarks wherever you want and select or import an appropriate icon. Each marker activates the ability to add text descriptions as well as images or videos. You can also annotate using drawing tools and directions made available by Google.

Can you add a text box to Google Earth?

In Google Earth Pro, you can use the Save Image button or File>Save>Save Image. That will open the Save Image toolbar. In Map Options you can find a title, legend and an HTML area where you can add some text.


1 Answers

You can translate from the latitude, longitude to a pixel offset within the map div with the fromLatLngToDivPixel method of the GMap2 object.

To show a div at that pixel offset you need to attach it to the appropriate map div. The map is actually made up of multiple layered divs called panes. You can access the div for a particular pane using the GMap2.getPane method. You can try out inserting your div on any of the panes described in the GMapPane enum.

So to summarize:

  • Attach your absolutely positioned text div (display: none) to the appropriate pane div.
  • Take your latitude and longitude and translate it to a map div pixel offset.
  • Set the top and left attributes of your absolutely positioned text div and display it.
like image 92
RedBlueThing Avatar answered Oct 03 '22 00:10

RedBlueThing