Tag to output a basic map?

[leeaston]

Having trouble understanding how to display a map in a template. I've created a field (handle: googleMap), attached it to a Single (handle: lake) and set a location. What's the most basic tag to put in a template to get it to display please?

[objectivehtml]

Loads of examples in the Wiki. If you don't see the example you need, let me know and I will add it. This is the most basic usage of the field type. It's super easy.

https://github.com/objectivehtml/Google-Maps-for-Craft/wiki/Using-the-Field-Type

[leeaston]

I'm using: {% set options = { id: 'lakeGoogleMap', width: '400px', height: '300px' } %}

{{ craft.googleMaps.lakeGoogleMap(options) }}

{% for entry in craft.entries.section('oakviewLakeLocation') %}

{{ craft.googleMaps.data('lakeGoogleMap', entry.lakeGoogleMap) }}

{% endfor %}

and get Template Error: Method "lakeGoogleMap" for object "Craft\GoogleMapsVariable" does not exist

[objectivehtml]

I think my examples may have too ambiguous naming conventions.

1. craft.googleMaps.lakeGoogleMap isn't a valid method. You need to use craft.googleMaps.map to generate the map. Your map "id" is lakeGoogleMap, which is fine.
2. craft.googleMaps.data('lakeGoogleMap', entry.lakeGoogleMap) should be craft.googleMaps.data('lakeGoogleMap', entry.yourMapFieldName)

[leeaston]

I agree, using 'map' as the field name in this example https://github.com/objectivehtml/Google-Maps-for-Craft/wiki/Using-the-Field-Type is confusing.

[objectivehtml]

I just updated the example and description a little bit. Should make it a little more obvious now. You get everything working though?

[leeaston]

Nearly there thanks! Is there somewhere I can look up 'options' - in particular I'm after how zoom and satellite view are set?

[objectivehtml]

I just updated this example with a link to all the map options. You should reference the Google Maps API for a full reference of options. Let me know if you have a specific question about a specific property and will see if I can help more.

https://github.com/objectivehtml/Google-Maps-for-Craft/wiki/Initializing-a-Google-Map

[leeaston]

Thanks for all the help - very much appreciated - any eta on the release so I can purchase?

[objectivehtml]

The code is pretty much final for v1 at this point. I am still trying to figure out if i am going to sell licenses before the official Craft plugin store is available. TBH, in a perfect world Google Maps for Craft would official launch with the Craft store. But... I am unsure of their ETA or progress on this, if any. So right now I am kinda in limbo as to whether or not to sell copies. I imagine plugin licenses will be purchased and tracked automatically with one-click updates for plugins with the store within Craft itself, which is what is ideal for me.

[leeaston]

I just looked at the page source and there's a ton of console and sql stuff listed - is that expected?

console.log("[18:21:36.475][trace][system.db.CDbConnection]\nOpening DB connection\nin /home/carp/craft/app/etc/behaviors/AppBehavior.php (636)\nin /home/craft/app/etc/web/WebApp.php (616)\nin /home/carp/craft/app/etc/behaviors/AppBehavior.php (69)");

console.log("[18:21:37.135][profile][system.db.CDbCommand.query]\nbegin:system.db.CDbCommand.query(SELECT elements.id, elements.type\nFROM craft_elements elements\nJOIN craft_elements_i18n elements_i18n ON elements_i18n.elementId = elements.id\nWHERE (elements_i18n.uri = :uri) AND (elements_i18n.locale = :locale) AND (elements_i18n.enabled = 1) AND (elements.enabled = 1) AND (elements.archived = 0). Bound with :uri='/-lake/location', :locale='en_gb')");

[objectivehtml]

Can you take a screenshot of the log? I am not seeing any of this log stuff on my end, and I don't think is is coming from this plugin. I just did a global search for console.log calls and there aren't any in my code that would be causing this.

[leeaston]

Have you looked at the source view of an actual web page with a map on?

[objectivehtml]

Oh yeah, for sure. ;)

Here is the generated output from my local example. The link is the generated output, and here is the template code I used. I am definitely not seeing any console.log'ing or anything or the sort in my output.

{% set options = {
    id: 'map', 
    width: '400px', 
    height: '300px',
    clustering: true
} %}

{{ craft.googleMaps.map(options) }}

{% for entry in craft.entries.section('news') %}

    {{ craft.googleMaps.data('map', entry.map, {
        clustering: true,
        iconSize: [32, 32]
    }) }}

{% endfor %}

https://gist.github.com/objectivehtml/90525c19d650736a0de8

[leeaston]

Must be because I'm in dev mode. Have you noticed that layout breaks in Live Preview. The 'add' buttons stray onto the preview.

[objectivehtml]

I just had another user report that issue. Honestly, have not tested it in the Live Preview yet. I'll look into that.

[objectivehtml]

Any suggestions on the UI for the map preview? Just wondering how to fit all the buttons in within a condensed window. Only thing I can come up with is some sort of alternative responsive button bar for smaller viewports.

[objectivehtml]

Can you take a screenshot of how it is appearing on your end? I am not getting the buttons straying.