Merge PR #1549 into 13.0

Signed-off-by JordiBForgeFlow

requirements.txt

@@ -1,2 +1,5 @@
 # web_widget_bokeh_chart
 bokeh==1.1.0
+# web_widget_mpld3_chart
+matplotlib>=2.0.0
+mpld3>=0.3

setup/web_widget_mpld3_chart/odoo/addons/web_widget_mpld3_chart

@@ -0,0 +1 @@
+../../../../web_widget_mpld3_chart

setup/web_widget_mpld3_chart/setup.py

@@ -0,0 +1,6 @@
+import setuptools
+
+setuptools.setup(
+    setup_requires=['setuptools-odoo'],
+    odoo_addon=True,
+)

web_widget_mpld3_chart/__init__.py

@@ -0,0 +1 @@
+# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl).

web_widget_mpld3_chart/__manifest__.py

@@ -0,0 +1,16 @@
+# Copyright 2020 ForgeFlow, S.L.
+# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl).
+
+{
+    "name": "Web Widget mpld3 Chart",
+    "category": "Hidden",
+    "summary": "This widget allows to display charts using MPLD3 library.",
+    "author": "ForgeFlow, Odoo Community Association (OCA)",
+    "version": "13.0.1.0.0",
+    "website": "https://github.com/OCA/web",
+    "depends": ["web"],
+    "data": ["views/web_widget_mpld3_chart.xml"],
+    "external_dependencies": {"python": ["mpld3"]},
+    "auto_install": False,
+    "license": "LGPL-3",
+}

web_widget_mpld3_chart/readme/CONTRIBUTORS.rst

@@ -0,0 +1 @@
+* Jordi Ballester Alomar <jordi.ballester@forgeflow.com>

web_widget_mpld3_chart/readme/CREDITS.rst

@@ -0,0 +1,4 @@
+* This module uses the library `mpld3 <https://github.com/mpld3/mpld3>`__
+  which is under the open-source BSD 3-clause "New" or "Revised" License.
+  Copyright (c) 2013, Jake Vanderplas
+* Odoo Community Association (OCA)

web_widget_mpld3_chart/readme/DESCRIPTION.rst

@@ -0,0 +1,5 @@
+This module adds the possibility to insert mpld3 charts into Odoo standard views.
+This is an interactive D3js-based viewer which brings matplotlib graphics to the browser.
+
+If you want to see some samples of mpld3's capabilities follow this `link
+<http://mpld3.github.io/>`_.

web_widget_mpld3_chart/readme/INSTALL.rst

@@ -0,0 +1,3 @@
+You need to install the python mpld3 library::
+
+    pip install mpld3

web_widget_mpld3_chart/readme/USAGE.rst

@@ -0,0 +1,28 @@
+To insert a mpld3 chart in a view proceed as follows:
+
+#. Import the required libraries::
+
+    import matplotlib.pyplot as plt, mpld3
+
+#. Declare a text computed field like this::
+
+    mpld3_chart = fields.Text(
+        string='Mpld3 Chart',
+        compute='_compute_mpld3_chart',
+    )
+
+#. In its computed method do::
+
+    def _compute_mpld3_chart(self):
+        for rec in self:
+            # Design your mpld3 figure:
+            plt.scatter([1, 10], [5, 9])
+            figure = plt.figure()
+            rec.mpld3_chart = mpld3.fig_to_html(figure)
+
+#. In the view, add something like this wherever you want to display your
+   mpld3 chart::
+
+    <div>
+        <field name="mpld3_chart" widget="mpld3_chart" nolabel="1"/>
+    </div>

web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.js

@@ -0,0 +1,17 @@
+odoo.define("web_widget_mpld3_chart", function(require) {
+    "use strict";
+
+    var fieldRegistry = require("web.field_registry");
+    var AbstractField = require("web.AbstractField");
+
+    var Mpld3ChartWidget = AbstractField.extend({
+        start: function() {
+            var val = this.value;
+            this.$el.html(val);
+        },
+    });
+    fieldRegistry.add("mpld3_chart", Mpld3ChartWidget);
+    return {
+        Mpld3ChartWidget: Mpld3ChartWidget,
+    };
+});

web_widget_mpld3_chart/views/web_widget_mpld3_chart.xml

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<odoo>
+    <template
+        id="assets_backend"
+        name="web_widget_mpld3_chart assets"
+        inherit_id="web.assets_backend"
+    >
+        <xpath expr="." position="inside">
+            <script
+                type="text/javascript"
+                src="/web_widget_mpld3_chart/static/src/lib/d3/d3.v3.min.js"
+            />
+            <script
+                type="text/javascript"
+                src="/web_widget_mpld3_chart/static/src/lib/mpld3/mpld3.v0.3.1.dev1.js"
+            />
+            <script
+                type="text/javascript"
+                src="/web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.js"
+            />
+        </xpath>
+    </template>
+</odoo>