<h1>Web Google Maps Drawing</h1> <p><a href="https://youtu.be/DDUFT6XP8AU" title="Demo"><img src="https://i.ytimg.com/vi/DDUFT6XP8AU/2.jpg" alt="Demo"></a> </p> <p>This module will integrate Google Maps Drawing that allows you to draw a shape on a map.<br> You can find the document <a href="https://developers.google.com/maps/documentation/javascript/examples/drawing-tools">here</a></p> <h2>New widget <code>map_drawing_shape</code></h2> <p>This module will support three kind of shapes:<br> - <a href="https://developers.google.com/maps/documentation/javascript/examples/rectangle-simple">Rectangle</a><br> - <a href="https://developers.google.com/maps/documentation/javascript/examples/polygon-simple">Polygon</a><br> - <a href="https://developers.google.com/maps/documentation/javascript/examples/polygon-simple">Circle</a> </p> <h2>Drawing Mixin</h2> <p>To ease the implementation of this feature, I defined a mixin class that you can use in your model ```python class GoogleMapsDrawingShapeMixin(models.AbstractModel): <em>name = &#39;google</em>maps.drawing.shape.mixin&#39; <em>description = &#39;Google Maps Shape Mixin&#39; _rec</em>name = &#39;shape_name&#39;</p> <pre><code> shape_name = fields.Char(string=&#39;Name&#39;) shape_area = fields.Float(string=&#39;Area&#39;) shape_radius = fields.Float(string=&#39;Radius&#39;) shape_description = fields.Text(string=&#39;Description&#39;) shape_type = fields.Selection([ (&#39;circle&#39;, &#39;Circle&#39;), (&#39;polygon&#39;, &#39;Polygon&#39;), (&#39;rectangle&#39;, &#39;Rectangle&#39;)], string=&#39;Type&#39;, default=&#39;polygon&#39;, required=True) shape_paths = fields.Text(string=&#39;Paths&#39;) @api.multi def decode_shape_paths(self): self.ensure_one() return safe_eval(self.shape_paths) </code></pre> <p><code> How to use the widget </code>xml <field name="shape_paths" widget="map_drawing_shape"/> ```</p> <p>How to load shape(s) on <code>map</code> view <code>xml &lt;record id=&quot;view_res_partner_area_map&quot; model=&quot;ir.ui.view&quot;&gt; &lt;field name=&quot;name&quot;&gt;view.res.partner.area.map&lt;/field&gt; &lt;field name=&quot;model&quot;&gt;res.partner.area&lt;/field&gt; &lt;field name=&quot;arch&quot; type=&quot;xml&quot;&gt; &lt;map library=&quot;drawing&quot; string=&quot;Shape&quot;&gt; &lt;field name=&quot;partner_id&quot;/&gt; &lt;field name=&quot;shape_name&quot;/&gt; &lt;field name=&quot;shape_description&quot;/&gt; &lt;field name=&quot;shape_type&quot;/&gt; &lt;field name=&quot;shape_radius&quot;/&gt; &lt;field name=&quot;shape_area&quot;/&gt; &lt;field name=&quot;shape_paths&quot;/&gt; &lt;templates&gt; &lt;t t-name=&quot;kanban-box&quot;&gt; &lt;div class=&quot;oe_kanban_global_click&quot;&gt; &lt;div class=&quot;oe_kanban_details&quot;&gt; &lt;strong class=&quot;o_kanban_record_title oe_partner_heading&quot;&gt; &lt;field name=&quot;shape_name&quot;/&gt; &lt;/strong&gt; &lt;div&gt; &lt;field name=&quot;shape_description&quot;/&gt; &lt;/div&gt; &lt;div attrs=&quot;{&#39;invisible&#39;: [(&#39;shape_type&#39;, &#39;not in&#39;, [&#39;rectangle&#39;, &#39;polygon&#39;])]}&quot;&gt; Area: &lt;field name=&quot;shape_area&quot;/&gt; &lt;/div&gt; &lt;div attrs=&quot;{&#39;invisible&#39;: [(&#39;shape_type&#39;, &#39;!=&#39;, &#39;circle&#39;)]}&quot;&gt; Radius: &lt;field name=&quot;shape_radius&quot;/&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/t&gt; &lt;/templates&gt; &lt;/map&gt; &lt;/field&gt; &lt;/record&gt; </code> <em>I have created a simple use case (custom module) to show you how to use the widget</em></p> <h1>Module Dependency:</h1> <p>This module will install <code>web_google_maps</code>.<br> <em>I recommend you to add Google Maps Key API into Odoo Settings &gt; General Settings when you installed this module</em></p> <p><a href="https://ko-fi.com/P5P4FOM0"><img src="https://www.ko-fi.com/img/donate_sm.png" alt="ko-fi"></a>,<br> if you want to support me to keep this project maintained. Thanks :)</p> <p>Regards,<br> Yopi<br> yopiangi@gmail.com</p>