I've been working on a google map (v3 of the api) that is plotting 120 markers or so (or will do shortly) - see http://www.mediwales.com/mapping. If you view the source the map data is for all the see, is it possible to hide this?

I'm not worried about the code that is generating the map, just the data. The data is grabbed from a Wordpress cms.

Here's the code that's generating it all:

<script type="text/javascript"> 
(function() { 

window.onload = function() { 
 var mc;
// Creating an object literal containing the properties we want to pass to the map 
var options = { 
zoom: 10, 
center: new google.maps.LatLng(52.40, -3.61), 
mapTypeId: google.maps.MapTypeId.ROADMAP 

// Creating the map 
var map = new google.maps.Map(document.getElementById('map'), options); 

// Creating a LatLngBounds object 
var bounds = new google.maps.LatLngBounds(); 

// Creating an array that will contain the addresses 
var places = []; 

// Creating a variable that will hold the InfoWindow object 
var infowindow; 
mc = new MarkerClusterer(map);
$pages = get_pages(array('child_of' => $post->ID, 'sort_column' => 'menu_order'));
$popup_content = array();
foreach($pages as $post)
    $fields = get_fields(); 
    $popup_content[] = '<p>'.$fields->company_name.'</p><img src="'.$fields->company_logo.'" /><br /><br /><a href="'.get_page_link($post->ID).'">View profile</a>';
    $comma = ", ";
    $full_address = "{$fields->address_line_1}{$comma}{$fields->address_line_2}{$comma}{$fields->address_line_3}{$comma}{$fields->post_code}";
    $address[] = $full_address;
echo 'var popup_content = ' . json_encode($popup_content) . ';';
echo 'var address = ' . json_encode($address) . ';';

var geocoder = new google.maps.Geocoder(); 

var markers = [];

// Adding a LatLng object for each city  
for (var i = 0; i < address.length; i++) { 
    (function(i) { 
        geocoder.geocode( {'address': address[i]}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                places[i] = results[0].geometry.location;

                // Adding the markers 
                var marker = new google.maps.Marker({position: places[i], map: map});

                // Creating the event listener. It now has access to the values of i and marker as they were during its creation
                google.maps.event.addListener(marker, 'click', function() {
                    // Check to see if we already have an InfoWindow
                    if (!infowindow) {
                        infowindow = new google.maps.InfoWindow();

                    // Setting the content of the InfoWindow

                    // Tying the InfoWindow to the marker 
                    infowindow.open(map, marker);

                // Extending the bounds object with each LatLng 

                // Adjusting the map to new bounding box 
            } else { 
            alert("Geocode was not successful for the following reason: " + status); 



var markerCluster = new MarkerClusterer(map, markers); 
  • What data are you referring to? popup_content and address? Oct 5, 2011 at 13:09
  • @SasaIvetic Both if possible.
    – Rob
    Oct 5, 2011 at 13:11

2 Answers 2


You can store your data in a database (Fusion Tables is a quick solution).

Google Maps has a tutorial that shows you how to do this with MySQL (but can be any database) http://code.google.com/apis/maps/articles/phpsqlajax_v3.html

You can get as secure and obfuscated as you want using a database back-end.

Looks like you geocode your data on the fly - you will be limited to 1000 request a day per IP address.

Would be more efficient to geocode and then update the database near-realtime.

  • 1
    Great suggestion for Fusion Tables! Fusion Tables has a geocoding limit, though I can't recall it now, but it is MUCH higher than the API limit. Only drawback is that you will need to keep your wordpress data synced with a Fusion Table (or alternately use the Fusion Tables data in your wordpress site). Oct 5, 2011 at 14:04
  • This is a great idea. The API limits have changed recently. I'm entering details as a separate answer, for space, but @Mapperz gave the REAL answer, just want to make sure that mine isn't perceived as a copycat! Oct 5, 2011 at 18:40
  • @Mapperz This is definitely the direction I want to head in... if only I knew how! Think I'll probably need some examples of the code... I'll add a bounty.
    – Rob
    Nov 1, 2011 at 14:32

You won't be able to actually hide the contents of popup_content and address from the user, simply because anything that is sent to a web page is plainly visible to the end-user. Instead of dumping it all at load-time though, you can do an async request for it on a map click. In your click handler function you would want to make a request from the PHP page for popup_content[i], and open the infoWindow once the request completes (alternately, open the infoWindow right away with Loading... text, and update the text afterwards). You can handle addresses in a similar fashion.

Note: this solution still does NOT hide the content from the user, it simply delays the loading so that all of the data isn't immediately present. It also will have a negative impact on your performance.

As another alternative, you could obfuscate the data in some way. You can also output the data to a separate JavaScript file on load, that way it isn't immediately visible when the user clicks View Source. Again, the data isn't actually hidden from the user; it is simply removed from plain sight.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.