Odoo Help

3

Website with Google Map

By
Mark Wells
on 1/3/15, 3:19 PM 4,232 views

I need to create a Locations page on the Website that has multiple maps for each location. It seemed like this would be a pretty simple thing to do but it seems when ever I try to embed the Google Map API <iframe> in the buit in HTML editor, it will not save the file.  It rejects the <iframe>.

So, simple question?  how do you add a map element to a website page in Odoo?

Please Note: I also looked at the map on the default Contct Us page but the template doesn't seem to allow you to extract the map element from the template and I don't wnat to go digging though python etc to find out how to just put a simple HTML element on a page.

Thanks for any help

Thanks You, That worked great.  I was using the pre-built Google API maps that creates an

Mark Wells
on 1/5/15, 3:30 PM

Mark feel free to upvote good answers so that the user can build karma points.

Stephen Mack
on 1/5/15, 4:21 PM
Done 

Mark R. Wells
Data Solutions & Technology
9901 Business Parkway Suite R
Lanham, MD. 20706
(301) 583-3500
(240) 487-1453 (direct)
(571) 421-6295 (cell)


From: Stephen Mack <smack815@gmail.com>
Reply-To: "Odoo S.A." <catchall@mail.odoo.com>
Date: Mon, 5 Jan 2015 21:21:21 +0000
To: Mark Wells <mwells@dstincorporated.com>
Subject: Re: Website with Google Map

Mark feel free to upvote good answers so that the user can build karma points.

--Stephen
odoo
(I'm not an odoo employee just playing around with the signature feature)


Sent by Odoo S.A. using Odooabout Forum Post Website with Google Map
Mark Wells
on 1/5/15, 5:27 PM
8
Kazim Mirza
On 1/3/15, 6:37 PM

Hello Mark

Steps to set multiple google map in page

Step 1: Select page where you want to add google map and select customize.

Step 2: You have to add following code in page 

             <script src="http://maps.googleapis.com/maps/api/js"></script>
            <script>
                     function initialize() {
                            var mapProp = {
                                center:new google.maps.LatLng(51.508742,-0.120850),zoom:5,mapTypeId:google.maps.MapTypeId.ROADMAP
                                 };
                    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
                        } 
                       google.maps.event.addDomListener(window, 'load', initialize);
              </script>
            <div id="googleMap" style="width:250px;height:250px;"></div>

Step 3: If you want to use more than one Google Map in single page then you have to just change the boldtext whis the ID of the google frame which uses as a DIV tag.

If you get the answer as you need then please accept the answer.

Thank You 

@Thanks..It's work..!

Mohit Kotak (MK)
on 9/7/15, 2:18 AM
0
Daniel Haas
On 2/16/17, 8:48 AM

Hey 74n3r,
Dont know if this will help or not but couple things i was able to do to get this to work.  On your page you are inserting the code into make sure it is placed after the tag for the website.layout  (t-call=) and before the end of the call </t>
doing this i was able to get the map to populate but i was still getting an unknown error on map. turning the web developer on in my browser the error was associated with no API key


To resolve this issue i needed to change the src to include an API key.  i know in the past you didnt need an API key with google but i cannot seam to load a map without it now.  Anyways here is the change to the src.  Hope it helps.  You will need to get an API key from google (free) and replace API_KEY in my code with the one provided by google.

<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY"></script>

Dan

0
74n3r
On 1/16/17, 4:11 AM

guys.. i had some problem ..when write in xml (Res.partner's form)..

<script src="http://maps.googleapis.com/maps/api/js"></script> <script> function initialize() { var mapProp = { center:new google.maps.LatLng(51.508742,-0.120850),zoom:5,mapTypeId:google.maps.MapTypeId.ROADMAP };

                    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

                        } google.maps.event.addDomListener(window, 'load', initialize);

              </script> <div id="googleMap" style="width:250px;height:250px;"></div>

it's gives to me this error..  how can i solve this ?

Uncaught ReferenceError: google is not definedhttp://localhost:8069/web?#id=1&view_type=form&model=res.partner&action=307:8Traceback:

ReferenceError: google is not defined at eval (eval at <anonymous> (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:473:213), <anonymous>:8:24) at eval (<anonymous>) at http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:473:213 at Function.globalEval (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:473:233) at jQuery.fn.init.domManip (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:833:306) at jQuery.fn.init.append (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:819:295) at Object.append (http://localhost:8069/web/content/326-6394053/web.assets_backend.js:3263:50) at Array.<anonymous> (http://localhost:8069/web/content/326-6394053/web.assets_backend.js:3159:11) at fire (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:644:299) at Object.fireWith [as resolveWith] (http://localhost:8069/web/content/285-ddc7143/web.assets_common.js:649:198)

About This Community

This platform is for beginners and experts willing to share their Odoo knowledge. It's not a forum to discuss ideas, but a knowledge base of questions and their answers.

Register

Odoo Training Center

Access to our E-learning platform and experience all Odoo Apps through learning videos, exercises and Quizz.

Test it now

Question tools

4 follower(s)

Stats

Asked: 1/3/15, 3:19 PM
Seen: 4232 times
Last updated: 2/16/17, 8:48 AM