How I use geopoint on frontend ?

Define / Create / Use Object-Classes, Fieldcollections, Object-Bricks, Variants, Inheritance, Custom Fields, ...
Post Reply
kurt22
Posts: 56
Joined: Tue Jan 24, 2012 7:17 pm
Location: France
Contact:

How I use geopoint on frontend ?

Post by kurt22 » Tue Mar 06, 2012 12:39 am

I have create a object in admin panel with geopoint. But now how I use my data for create the map on the frontend ? It's Ok if I use googlemap but I think is possible to use the same methode of the admin panel. So what is the method in the admin panel for look my marker on the googlemap ? Exemple code please :) ...and its strange, I work any api key ?!

Thomas_K
Posts: 26
Joined: Tue Jul 26, 2011 1:34 pm

Re: How I use geopoint on frontend ?

Post by Thomas_K » Tue Mar 06, 2012 9:20 pm

There are many way's show the geopoint on frontend so pimcore just save the geopoint and you can use it for everything you want. Googlemap Version 3 work's without a api-key http://digg.com/news/story/Use_Google_M ... an_API_key.

Cheers Thomas

User avatar
rayfx
Posts: 40
Joined: Tue Jan 24, 2012 12:09 pm
Location: Munich / Germany

Re: How I use geopoint on frontend ?

Post by rayfx » Fri Mar 09, 2012 1:09 pm

Geo Locations are imho currently solved suboptimal in pimcore as lat and long are - in google terms - changed.
So you have to split and change them on your own!

here is a example with google map api 3 (NOT version 2!!!) which works vor me:

Code: Select all

<?php $geo   = explode("; ", $this->object->getMap()); ?>
<script src="http://maps.googleapis.com/maps/api/js?key=youtgooglekey&sensor=true" type="text/javascript"></script>
<script type="text/javascript">
   $(document).ready(function(){
      var myLatlng   = new google.maps.LatLng(<?php echo $geo[1]; ?>, <?php echo $geo[0]; ?>);

      var myOptions   = {
         center: myLatlng,
         zoom: 13,
         mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      var marker = new google.maps.Marker({
         position: myLatlng,
         title: "my marker"
      });
                      
      // To add the marker to the map, call setMap();
      marker.setMap(map);
   });
</script>

<div id="map_canvas" style="width: 640px; height: 400px"></div>


online: http://ermisch-gmbh.rayfx.net/wir_ueber_uns/kontakt_687 (at the bottom of the page!)

Cheers,
Roland

paulg
Posts: 17
Joined: Wed Jan 18, 2012 12:02 am
Location: France
Contact:

Re: How I use geopoint on frontend ?

Post by paulg » Tue Mar 13, 2012 11:33 am

Spurred on by rayfx's reply I created the front end for some Event objects, I just added a venue name field and this works flawlessly using Gmaps v3 (auto streetview without flash, no key needed, optimized for mobile etc).

Code: Select all

<script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript">
   $(document).ready(function(){
      var myLatlng   = new google.maps.LatLng(
           <?php  echo $this->item->getGeopoint()->getLatitude(); ?>,
           <?php echo $this->item->getGeopoint()->getLongitude(); ?>);

      var myOptions   = {
         center: myLatlng,
         zoom: 13,
         mapTypeId: google.maps.MapTypeId.ROADMAP
      };
      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

      var marker = new google.maps.Marker({
         position: myLatlng,
         title: "<?php echo $this->item->getVenue(); ?>"
      });
     
      marker.setMap(map);
   });
</script>

<div id="map_canvas" style="width: 640px; height: 400px; border: 2px solid gray;"></div>


The minor diffs are:
Using getLatitude() getLongitude() -- without having to explode() the string.
Drop ref to key in the url for Gmaps.
Added venue name for marker.
Pimcore 1.4.2.

Post Reply

Return to “Objects”



Who is online

Users browsing this forum: No registered users and 1 guest