google maps datatype

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Paul Sørensen 304 posts 650 karma points

Mar 16, 2013 @ 00:06

I'm trying to use Google Maps datatype but without luck. I have found bits here and there but not sure that I have set up everything correct - I see Lee Keller's guide mentined but I can't find it -

This is what I do

    <div style="border: 0 none;"> 
        <div id="localMap" class="map">
            <umbraco:Item field="googleMap" runat="server"></umbraco:Item>
     </div>
       <div style="vertical-align: middle; height: 22px"></div> 
    </div> 
</asp:Content>
 
<asp:Content ContentPlaceHolderId="scripts" runat="server">
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript" ></script> 
    <script type="text/javascript">
$('div[class=map]').each(function() {
  $(this).addClass('mapdimensions');
 var mapId = $(this).attr('id');
    var value = $(this).text();
    value = $.trim(value);
 var point = value.split(',');
  var lat = parseFloat(point[0]);
    var lon = parseFloat(point[1]);
    var zoom = parseFloat(point[2]);
   var p = new google.maps.LatLng(lat, lon);
  var myOptions = {
      center: p,
     zoom: zoom,
        mapTypeId: google.maps.MapTypeId.ROADMAP
   };
 fm = new google.maps.Map(document.getElementById(mapId),
       myOptions); 
  var marker = new google.maps.Marker({
      position: p,
       title:"We are here!",
      animation: google.maps.Animation.BOUNCE
    });  
   // To add the marker to the map, call setMap();
    marker.setMap(fm);
});
    </script>
</asp:Content>

/Paul S

Copy Link

Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib

Mar 16, 2013 @ 10:05

0

Hi Paul

What does the content of your googleMap macro look like?

/Jan

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 17, 2013 @ 20:20
0
Hi

I don't have a macro - just the a property in my Document of type Google Maps. Am I missing something here?

The field is inserted here
```
<umbraco:Itemfield="googleMap"runat="server"></umbraco:Item>
```
/Paul S
Copy Link
gary 385 posts 916 karma points

Mar 18, 2013 @ 00:51

0

Hi Paul

Without checking your script will just ask if you have set a height for the map div in css.

Have been caught out with this a couple of times. It will show nothing without the height specified.

If this doesn't work, I use Sebaastians script.js (modified a bit) from his razor examples site. That does work in 6.0.2.

Regards

Gary

Copy Link
Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib

Mar 23, 2013 @ 14:08

0

@Paul Aaah, sorry missed that part in the code above. As Gary says you probably just need to set some dimensions for your map container.

Cheers,
Jan

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 23, 2013 @ 16:52

0

Hi

I'm working on it and have set the dimensions, but I'm not there yet. I'm not sure I have checked everything yet.

/Paul S

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 23, 2013 @ 17:39

0

Hi

I think my problems is that the field Location does not contain a value although the Datatype is created with a default value and the map is shown correctly in Content

/Paul S

Copy Link
gary 385 posts 916 karma points

Mar 23, 2013 @ 18:14

0

Hi Paul

There is another "gotcha" on the maps which catches people.

When you place the marker, you must right click and then click use this location, this wil then be used as the map centre.

Just check this before doing too much with the code.

G

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 24, 2013 @ 00:15

0

Hi Gary

I have tried that also without luck. One difference I notice between my site and the Razor sample site is that the grey box next to the Clear button contains the coordinates in the Razor sample but the same box is empty at my site

/Paul S

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 24, 2013 @ 11:34

0

Hi

I have exactly the same as in the MapEmptyTest in the Razor Example. No marker and I can't saved one either. So perhaps if I knew what the purpose was of MapEmptyTest.

The version of the GoogleMaps I installed was 0.0.0.0 and in Raxor sample it is 2.0.0.0 - I tried to copy that into my site but it didn't change anything.

/Paul S

Copy Link
gary 385 posts 916 karma points

Mar 24, 2013 @ 21:19

0

Hi Paul

Apologies for late reply have been out all day and tried to login via my phone but it wouldn't let me in.

Checked the mapEmptyTest and have no idea of it's purpose.

My Google Map package is the latest version, 2.0.4, from here:

and as I do that there is a 2.0.6 so would suggest you remove your current package and install the latest.

If your code then still does not work, will post my current code as I know that this will.

One other thing is this save and publish issue, save and publish twice just to make sure, this has been fixed in the nightly's but may still be causing issues elsewhere.

Again apologies, but we will have something working for you shortly.

Regards G

Copy Link
gary 385 posts 916 karma points

Mar 24, 2013 @ 21:19

0

Sorry forgot the link

http://localhost:61150/datatypesexamples/mapemptytest/

G

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 24, 2013 @ 23:15

0

Hi

I'm using 2.0.6, but I have tried to uninstall it and install it again. Makes no difference - I still don't see the coordinates in the backend

/Paul S

Copy Link
gary 385 posts 916 karma points

Mar 24, 2013 @ 23:21

0

Hi

Just realised I posted the wrong link too!

Ok, so you have the marker which is centered at the default value given in the datatype?

You can move it, then when you release it you can right click and hit "use this location" from the pop-up? But this is not updating the field with the selected location?

Can you also use the search to find a location by name? (just checking to see if it is connected).

G

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 25, 2013 @ 00:02

0

Hi

I don't have a marker although I have set the default location for the datatype. If I do a search the marker is displayed, but when I publish it disappears

/Paul S

Copy Link
gary 385 posts 916 karma points

Mar 25, 2013 @ 00:35

0

Hi

It seems odd that with a default you have no marker, but if you search and get your marker, then use "use this location" from teh pop-up, does the fiels become populated wiith the co-ordinates?

Just like the picture below?

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 25, 2013 @ 08:50

0

Hi

When I search and get the marker I cannot right click to get a content menu so I can't get what your picture looks like

/Paul S

Copy Link
gary 385 posts 916 karma points

Mar 25, 2013 @ 09:32

100

Hi Paul

OK, I may have got this wrong, but I am sure that it was a right click - however -

Just normal left-click the black dot at the centre - this should bring up the "use this location".

This will then enter the latitude and longitude in the field, save and publish then see if appears in page.

G

Copy Link
Paul Sørensen 304 posts 650 karma points

Mar 25, 2013 @ 09:51

0

Hi G

Left.click - sorry I didn't try that also, but now i works - thanks a lot

/Paul S

Copy Link
is working on a reply...

Please Sign in or register to post replies