Adding Google street view to Joomla Estate Agencie JEA

So, even though I have only edited the code in minor ways, it actually took me a long time to do it, but here is the final result! Posted here on JEA forums

Hi, I've had a go at this myself, and finally came up with a solution.

The first thing I did was to go into my template and create an override for JEA Property.

I then edited the "default_googlemap.php" file. From line 44 to the bottom, replace the script with this script:

$script = <<

 

function initMap(mapOptions, panoOptions, MarkerLatlng) {

    map = new google.maps.Map(document.id('jea_property_map'), mapOptions);

    var marker = new google.maps.Marker({

        position: MarkerLatlng, 

        map: map, 

        title: '{$this->row->ref}'

    });

    var panorama = new google.maps.StreetViewPanorama(document.getElementById('jea_property_map_pano'), panoOptions);

  map.setStreetView(panorama);

}

 

window.addEvent("domready", function(){

    var longitude  = {$longitude};

    var latitude   = {$latitude};

 

    if (longitude && latitude) {

        var myLatlng = new google.maps.LatLng(latitude, longitude);

        var options = {

          zoom : 15,

          center : myLatlng,

          mapTypeId : google.maps.MapTypeId.ROADMAP

        };

        var panoramaOptions = {

    position: myLatlng,

  };

        initMap(options, panoramaOptions, myLatlng);

 

    } else {

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

        var opts = {'address':'$address', 'language':'$lang', 'region':'$region'};

        geocoder.geocode(opts, function(results, status) {

            if (status == google.maps.GeocoderStatus.OK) {

                var myLatlng = results[0].geometry.location;

                var options = {

                  center : myLatlng,

                  mapTypeId : google.maps.MapTypeId.ROADMAP

                };

                var panoramaOptions = {

    position: myLatlng,

  };

                initMap(options, panoramaOptions, myLatlng);

                map.fitBounds(results[0].geometry.viewport);

             }

        });

    }

});

 

EOD;

 

$this->document->addScriptDeclaration($script);

?>

 

I've only modified the original code to add panoramaOptions variable, and pass it to the initMap function. I then added the panorama variable.

 

At the bottom I also added a div tag called "jea_property_map_pano", but you have to give it a height property otherwise you won't be able to see it. The street view loads up in this div tag.