google map showing location from property form - google-maps

Question

I am trying to make a form for showing properties:
My form looks like this below, how can i get the google map to show the location of the property?
<legend><?php echo JText::_('COM_IPROPERTY_LOCATION'); ?></legend>
<div class="formelm"><?php echo $this->form->getLabel('hide_address'); ?>
<?php echo $this->form->getInput('hide_address'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('street_num'); ?>
<?php echo $this->form->getInput('street_num'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('street'); ?>
<?php echo $this->form->getInput('street'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('street2'); ?>
<?php echo $this->form->getInput('street2'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('apt'); ?>
<?php echo $this->form->getInput('apt'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('city'); ?>
<?php echo $this->form->getInput('city'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('postcode'); ?>
<?php echo $this->form->getInput('postcode'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('locstate'); ?>
<?php echo $this->form->getInput('locstate'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('province'); ?>
<?php echo $this->form->getInput('province'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('country'); ?>
<?php echo $this->form->getInput('country'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('region'); ?>
<?php echo $this->form->getInput('region'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('county'); ?>
<?php echo $this->form->getInput('county'); ?></div>
</fieldset>
<fieldset>
<legend><?php echo JText::_( 'COM_IPROPERTY_DRAG_AND_DROP' ); ?></legend>
<?php echo $this->form->getLabel('geocode_header'); ?>
<div class="formelm"><?php echo $this->form->getLabel('latitude'); ?>
<?php echo $this->form->getInput('latitude'); ?></div>
<div class="formelm"><?php echo $this->form->getLabel('longitude'); ?>
<?php echo $this->form->getInput('longitude'); ?></div>
<div><?php echo $this->form->getInput('google_map'); ?></div>
</fieldset>
</div>

Answer 1

Create a Google Map and add a marker on top of it. It seems you have already got the latitude and longitude, so creating the map should be quite simple like in this example. This should be a starting point for your further development of your map.
function initialize() {
var myLatlng = new google.maps.LatLng(<?php echo $this->form->getInput('latitude'); ?>,<?php echo $this->form->getInput('longitude'); ?>);
var mapOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!'
});
}