Magento: Store locator in Magento using Google Map API

First you need to create a custom module with single model (one model-one table).
Suppose Bd_Storelocator is a custom module and Storelocator is a model,
Then use following code in any phtml file as
<?php
$requireData = Mage::getModel('storelocator/storelocator')->getStore();
//print_r($requireData->getData());
$markers = "";
$messages = "";
foreach ($requireData as $data) {
    $markers .= '{lat:' . $data["latitude"] . ',lng:' . $data["longitude"] . ',name:' . '"' . $data["storename"] . '"},';
    $messages .= "'" . addslashes($data["storename"]) . "<br/ >" . addslashes($data["address"]) . "<br />" . $data["telephone"] . "', ";    }
$markers1 = rtrim($markers, ",");
$messages1 = rtrim($messages, ", ");
?>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var map;
    google.maps.event.addDomListener(window, "load", initialize);
    function initialize() {
        var map = new google.maps.Map(document.getElementById("map_canvas"), {
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableAutoPan: false,
            streetViewControl: false
        });
        var markers = [<?php echo $markers1; ?>];
        var widt = document.body.offsetWidth;
        document.getElementById("map_canvas").width = widt+"px";
        for (index in markers) {
            if(Number(index) != index) break;
            addMarker(markers[index],map,index);
        }
        var bounds = new google.maps.LatLngBounds();
        for (index in markers) {
            if(Number(index) != index) break;
            var data = markers[index];
            bounds.extend(new google.maps.LatLng(data.lat, data.lng));
        }
        // Don't zoom in too far on only one marker
        if (bounds.getNorthEast().equals(bounds.getSouthWest())) {
            var extendPoint1 = new google.maps.LatLng(bounds.getNorthEast().lat() + 0.01, bounds.getNorthEast().lng() + 0.01);
            var extendPoint2 = new google.maps.LatLng(bounds.getNorthEast().lat() - 0.01, bounds.getNorthEast().lng() - 0.01);
            bounds.extend(extendPoint1);
            bounds.extend(extendPoint2);
        }
        map.fitBounds(bounds);
    }
    function addMarker(data,map,index) {
        // Create the marker
        //var image = '<?php //print $base_url . '/' . $themePath . '/images/drupal.png'  ?>';
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.lng),
            map: map,
            //icon: image,
            title: data.name
        });
        attachSecretMessage(marker,index,map)

    }
    function attachSecretMessage(marker,number,map) {
        var message = [<?php echo $messages1; ?>];

        var infowindow = new google.maps.InfoWindow({
            content: message[number],
            size: new google.maps.Size(50,50)
        });
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map,marker);
           jQuery("#showinfo").html(message[number]);

        });
    }
</script>
<div class="mapBlock">
    <div id="map_canvas" style="height: 473px;">
    </div>
</div>
<div id="showinfo">

</div>