Quick Jump ↵
Add <script type="text/javascript" src="/PATH/TO/magic/tricks/gmaps/gmaps..js" charset="UTF-8"></script> below your <script type="text/javascript" src="/PATH/TO/magic/wand..js" charset="UTF-8"></script>
<script type="text/javascript" src="/PATH/TO/magic/tricks/gmaps/gmaps..js" charset="UTF-8"></script>
<script type="text/javascript" src="/PATH/TO/magic/wand..js" charset="UTF-8"></script>
Add <script type="text/javascript">$m.trick.gmaps.config = { api_key : "YOUR_API_KEY" </script> inside your <body> tag.
<script type="text/javascript">$m.trick.gmaps.config = { api_key : "YOUR_API_KEY" </script>
<body>
Add your markers like in /PATH/TO/magic/tricks/gmaps/gmap_ex_1.json.
/PATH/TO/magic/tricks/gmaps/gmap_ex_1.json
Create like a format_marker function like in this page's source code.
format_marker
<div data-mjf="gmaps" data-mjf_gmaps='{"config" : { "json_file" : "/PATH/TO/YOUR_MARKERS.json", "animate" : true, "zoom" : 3, "start_lat" : "42.145809" , "start_lon" : "-33.462164" } }' id="gmap_ex_1"></div>
…or…
<div data-mjf="gmaps" data-mjf_gmaps='{"config" : { "json_var" : "NAME_OF_JSON_VARIABLE_ON_YOUR_PAGE", "animate" : true, "zoom" : 3, "start_lat" : "42.145809" , "start_lon" : "-33.462164" } }' id="gmap_ex_2"></div>
« Back to the main documentation
Gmaps (): Magic JavaScript