function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
pp11222pp11222 

In Google Map with V3 Maps API

Hi

 

I need to add a In Line VF page with Google's V3 Maps API. I already have a s-control with v2 api but it requires a Google Map API Key.

 

Can someone please provide an example of Inline VF page with Google's V3 Maps API, so that I can show Google map for a address and include this page on a detail page layout.

 

 

Thanks

kiranmutturukiranmutturu

you can convert the same s-control to a vf page by adding the standard controller .. the u can use that page as an in inline section 
pp11222pp11222

My S-controll currently uses Google Map API V2 and it requires a API key, but V3 MAP API does not require a API Key.

 

I am looking for an example for a VF page which use Google MAP API V3.

 

 
pp11222pp11222

Can some one please provide a sample VF page with google MAP API V3
J&AJ&A

Here's a quick example. Note that this shows how to load the map asynchronously. Please check the Google Maps API V3 for further info:

<apex:page >
    <div id="map_canvas"/>
    <script type="text/javascript">
        function initialize()
        {
            var myLatlng = new google.maps.LatLng(-34.397, 150.644);
            var myOptions = {
                zoom: 8,
                center: myLatlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            }
            var mapComp = document.getElementById("map_canvas");
            mapComp.style.width = '900px';
            mapComp.style.height = '500px';
            var map = new google.maps.Map(mapComp, myOptions);
        }
        
        function loadScript()
        {
            var script = document.createElement("script");
            script.type = "text/javascript";
            script.src="http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize";
            document.body.appendChild(script);
        }
        
        // Loads the Google Maps app asynchronously
        window.onload = loadScript;

    </script>
</apex:page>

 

Hope this helps.