mirror of https://github.com/OCA/web.git
[15.0][MIG] web_widget_mpld3_chart
Christopher Ormaza
parent
6bd33bc679
commit
2333c32155
|
|
@ -14,13 +14,13 @@ Web Widget mpld3 Chart
|
|||
:target: http://www.gnu.org/licenses/lgpl-3.0-standalone.html
|
||||
:alt: License: LGPL-3
|
||||
.. |badge3| image:: https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github
|
||||
:target: https://github.com/OCA/web/tree/14.0/web_widget_mpld3_chart
|
||||
:target: https://github.com/OCA/web/tree/15.0/web_widget_mpld3_chart
|
||||
:alt: OCA/web
|
||||
.. |badge4| image:: https://img.shields.io/badge/weblate-Translate%20me-F47D42.png
|
||||
:target: https://translation.odoo-community.org/projects/web-14-0/web-14-0-web_widget_mpld3_chart
|
||||
:target: https://translation.odoo-community.org/projects/web-15-0/web-15-0-web_widget_mpld3_chart
|
||||
:alt: Translate me on Weblate
|
||||
.. |badge5| image:: https://img.shields.io/badge/runbot-Try%20me-875A7B.png
|
||||
:target: https://runbot.odoo-community.org/runbot/162/14.0
|
||||
:target: https://runbot.odoo-community.org/runbot/162/15.0
|
||||
:alt: Try me on Runbot
|
||||
|
||||
|badge1| |badge2| |badge3| |badge4| |badge5|
|
||||
|
|
@ -48,9 +48,14 @@ Usage
|
|||
|
||||
To insert a mpld3 chart in a view proceed as follows:
|
||||
|
||||
#. You should inherit from abstract class abstract.mpld3.parser::
|
||||
|
||||
_name = 'res.partner'
|
||||
_inherit = ['res.partner', 'abstract.mpld3.parser']
|
||||
|
||||
#. Import the required libraries::
|
||||
|
||||
import matplotlib.pyplot as plt, mpld3
|
||||
import matplotlib.pyplot as plt
|
||||
|
||||
#. Declare a text computed field like this::
|
||||
|
||||
|
|
@ -66,7 +71,7 @@ To insert a mpld3 chart in a view proceed as follows:
|
|||
# Design your mpld3 figure:
|
||||
plt.scatter([1, 10], [5, 9])
|
||||
figure = plt.figure()
|
||||
rec.mpld3_chart = mpld3.fig_to_html(figure)
|
||||
rec.mpld3_chart = self.convert_figure_to_json(figure)
|
||||
|
||||
#. In the view, add something like this wherever you want to display your
|
||||
mpld3 chart::
|
||||
|
|
@ -81,7 +86,7 @@ Bug Tracker
|
|||
Bugs are tracked on `GitHub Issues <https://github.com/OCA/web/issues>`_.
|
||||
In case of trouble, please check there if your issue has already been reported.
|
||||
If you spotted it first, help us smashing it by providing a detailed and welcomed
|
||||
`feedback <https://github.com/OCA/web/issues/new?body=module:%20web_widget_mpld3_chart%0Aversion:%2014.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**>`_.
|
||||
`feedback <https://github.com/OCA/web/issues/new?body=module:%20web_widget_mpld3_chart%0Aversion:%2015.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**>`_.
|
||||
|
||||
Do not contact contributors directly about support or help with technical issues.
|
||||
|
||||
|
|
@ -97,6 +102,7 @@ Contributors
|
|||
~~~~~~~~~~~~
|
||||
|
||||
* Jordi Ballester Alomar <jordi.ballester@forgeflow.com>
|
||||
* Christopher Ormaza <chris.ormaza@forgeflow.com>
|
||||
|
||||
Other credits
|
||||
~~~~~~~~~~~~~
|
||||
|
|
@ -119,6 +125,17 @@ OCA, or the Odoo Community Association, is a nonprofit organization whose
|
|||
mission is to support the collaborative development of Odoo features and
|
||||
promote its widespread use.
|
||||
|
||||
This module is part of the `OCA/web <https://github.com/OCA/web/tree/14.0/web_widget_mpld3_chart>`_ project on GitHub.
|
||||
.. |maintainer-JordiBForgeFlow| image:: https://github.com/JordiBForgeFlow.png?size=40px
|
||||
:target: https://github.com/JordiBForgeFlow
|
||||
:alt: JordiBForgeFlow
|
||||
.. |maintainer-ChrisOForgeFlow| image:: https://github.com/ChrisOForgeFlow.png?size=40px
|
||||
:target: https://github.com/ChrisOForgeFlow
|
||||
:alt: ChrisOForgeFlow
|
||||
|
||||
Current `maintainers <https://odoo-community.org/page/maintainer-role>`__:
|
||||
|
||||
|maintainer-JordiBForgeFlow| |maintainer-ChrisOForgeFlow|
|
||||
|
||||
This module is part of the `OCA/web <https://github.com/OCA/web/tree/15.0/web_widget_mpld3_chart>`_ project on GitHub.
|
||||
|
||||
You are welcome to contribute. To learn how please visit https://odoo-community.org/page/Contribute.
|
||||
|
|
|
|||
|
|
@ -1 +1,2 @@
|
|||
# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl).
|
||||
from . import models
|
||||
|
|
|
|||
|
|
@ -6,11 +6,18 @@
|
|||
"category": "Hidden",
|
||||
"summary": "This widget allows to display charts using MPLD3 library.",
|
||||
"author": "ForgeFlow, Odoo Community Association (OCA)",
|
||||
"version": "14.0.1.0.0",
|
||||
"version": "15.0.1.0.0",
|
||||
"website": "https://github.com/OCA/web",
|
||||
"depends": ["web"],
|
||||
"data": ["views/web_widget_mpld3_chart.xml"],
|
||||
"external_dependencies": {"python": ["mpld3"]},
|
||||
"data": [],
|
||||
"external_dependencies": {"python": ["mpld3", "beautifulsoup4"]},
|
||||
"auto_install": False,
|
||||
"development_status": "Beta",
|
||||
"maintainers": ["JordiBForgeFlow", "ChrisOForgeFlow"],
|
||||
"license": "LGPL-3",
|
||||
"assets": {
|
||||
"web.assets_backend": [
|
||||
"web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js",
|
||||
],
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
from . import abstract_mpld3_parser
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
# Copyright 2022 ForgeFlow S.L.
|
||||
# License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl).
|
||||
|
||||
|
||||
import json
|
||||
import logging
|
||||
|
||||
from odoo import api, models
|
||||
|
||||
_logger = logging.getLogger(__name__)
|
||||
|
||||
try:
|
||||
import mpld3
|
||||
from bs4 import BeautifulSoup
|
||||
except (ImportError, IOError) as err:
|
||||
_logger.debug(err)
|
||||
|
||||
|
||||
class AbstractMpld3Parser(models.AbstractModel):
|
||||
|
||||
_name = "abstract.mpld3.parser"
|
||||
_description = "Utility to parse ploot figure to json data for widget Mpld3"
|
||||
|
||||
@api.model
|
||||
def convert_figure_to_json(self, figure):
|
||||
html_string = mpld3.fig_to_html(figure, no_extras=True, include_libraries=False)
|
||||
soup = BeautifulSoup(html_string, "lxml")
|
||||
json_data = {
|
||||
"style": soup.style.decode(),
|
||||
"div": soup.div.get("id"),
|
||||
"script": soup.script.decode_contents(),
|
||||
}
|
||||
return json.dumps(json_data)
|
||||
|
|
@ -1 +1,2 @@
|
|||
* Jordi Ballester Alomar <jordi.ballester@forgeflow.com>
|
||||
* Christopher Ormaza <chris.ormaza@forgeflow.com>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,8 @@
|
|||
* 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
|
||||
* This module uses the library `BeautifulSoup 4 <https://pypi.org/project/beautifulsoup4/>`__
|
||||
which is under the open-source MIT License.
|
||||
Copyright (c) 2014, Leonard Richardson
|
||||
|
||||
* Odoo Community Association (OCA)
|
||||
|
|
|
|||
|
|
@ -1,8 +1,13 @@
|
|||
To insert a mpld3 chart in a view proceed as follows:
|
||||
|
||||
#. You should inherit from abstract class abstract.mpld3.parser::
|
||||
|
||||
_name = 'res.partner'
|
||||
_inherit = ['res.partner', 'abstract.mpld3.parser']
|
||||
|
||||
#. Import the required libraries::
|
||||
|
||||
import matplotlib.pyplot as plt, mpld3
|
||||
import matplotlib.pyplot as plt
|
||||
|
||||
#. Declare a text computed field like this::
|
||||
|
||||
|
|
@ -18,7 +23,7 @@ To insert a mpld3 chart in a view proceed as follows:
|
|||
# Design your mpld3 figure:
|
||||
plt.scatter([1, 10], [5, 9])
|
||||
figure = plt.figure()
|
||||
rec.mpld3_chart = mpld3.fig_to_html(figure)
|
||||
rec.mpld3_chart = self.convert_figure_to_json(figure)
|
||||
|
||||
#. In the view, add something like this wherever you want to display your
|
||||
mpld3 chart::
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="generator" content="Docutils 0.15.1: http://docutils.sourceforge.net/" />
|
||||
<meta name="generator" content="Docutils: http://docutils.sourceforge.net/" />
|
||||
<title>Web Widget mpld3 Chart</title>
|
||||
<style type="text/css">
|
||||
|
||||
|
|
@ -367,7 +367,7 @@ ul.auto-toc {
|
|||
!! This file is generated by oca-gen-addon-readme !!
|
||||
!! changes will be overwritten. !!
|
||||
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
|
||||
<p><a class="reference external" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external" href="http://www.gnu.org/licenses/lgpl-3.0-standalone.html"><img alt="License: LGPL-3" src="https://img.shields.io/badge/licence-LGPL--3-blue.png" /></a> <a class="reference external" href="https://github.com/OCA/web/tree/14.0/web_widget_mpld3_chart"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external" href="https://translation.odoo-community.org/projects/web-14-0/web-14-0-web_widget_mpld3_chart"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external" href="https://runbot.odoo-community.org/runbot/162/14.0"><img alt="Try me on Runbot" src="https://img.shields.io/badge/runbot-Try%20me-875A7B.png" /></a></p>
|
||||
<p><a class="reference external" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external" href="http://www.gnu.org/licenses/lgpl-3.0-standalone.html"><img alt="License: LGPL-3" src="https://img.shields.io/badge/licence-LGPL--3-blue.png" /></a> <a class="reference external" href="https://github.com/OCA/web/tree/15.0/web_widget_mpld3_chart"><img alt="OCA/web" src="https://img.shields.io/badge/github-OCA%2Fweb-lightgray.png?logo=github" /></a> <a class="reference external" href="https://translation.odoo-community.org/projects/web-15-0/web-15-0-web_widget_mpld3_chart"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external" href="https://runbot.odoo-community.org/runbot/162/15.0"><img alt="Try me on Runbot" src="https://img.shields.io/badge/runbot-Try%20me-875A7B.png" /></a></p>
|
||||
<p>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.</p>
|
||||
<p>If you want to see some samples of mpld3’s capabilities follow this <a class="reference external" href="http://mpld3.github.io/">link</a>.</p>
|
||||
|
|
@ -397,9 +397,15 @@ pip install mpld3
|
|||
<h1><a class="toc-backref" href="#id2">Usage</a></h1>
|
||||
<p>To insert a mpld3 chart in a view proceed as follows:</p>
|
||||
<ol class="arabic">
|
||||
<li><p class="first">You should inherit from abstract class abstract.mpld3.parser:</p>
|
||||
<pre class="literal-block">
|
||||
_name = 'res.partner'
|
||||
_inherit = ['res.partner', 'abstract.mpld3.parser']
|
||||
</pre>
|
||||
</li>
|
||||
<li><p class="first">Import the required libraries:</p>
|
||||
<pre class="literal-block">
|
||||
import matplotlib.pyplot as plt, mpld3
|
||||
import matplotlib.pyplot as plt
|
||||
</pre>
|
||||
</li>
|
||||
<li><p class="first">Declare a text computed field like this:</p>
|
||||
|
|
@ -417,7 +423,7 @@ def _compute_mpld3_chart(self):
|
|||
# Design your mpld3 figure:
|
||||
plt.scatter([1, 10], [5, 9])
|
||||
figure = plt.figure()
|
||||
rec.mpld3_chart = mpld3.fig_to_html(figure)
|
||||
rec.mpld3_chart = self.convert_figure_to_json(figure)
|
||||
</pre>
|
||||
</li>
|
||||
<li><p class="first">In the view, add something like this wherever you want to display your
|
||||
|
|
@ -435,7 +441,7 @@ mpld3 chart:</p>
|
|||
<p>Bugs are tracked on <a class="reference external" href="https://github.com/OCA/web/issues">GitHub Issues</a>.
|
||||
In case of trouble, please check there if your issue has already been reported.
|
||||
If you spotted it first, help us smashing it by providing a detailed and welcomed
|
||||
<a class="reference external" href="https://github.com/OCA/web/issues/new?body=module:%20web_widget_mpld3_chart%0Aversion:%2014.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**">feedback</a>.</p>
|
||||
<a class="reference external" href="https://github.com/OCA/web/issues/new?body=module:%20web_widget_mpld3_chart%0Aversion:%2015.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**">feedback</a>.</p>
|
||||
<p>Do not contact contributors directly about support or help with technical issues.</p>
|
||||
</div>
|
||||
<div class="section" id="credits">
|
||||
|
|
@ -450,6 +456,7 @@ If you spotted it first, help us smashing it by providing a detailed and welcome
|
|||
<h2><a class="toc-backref" href="#id6">Contributors</a></h2>
|
||||
<ul class="simple">
|
||||
<li>Jordi Ballester Alomar <<a class="reference external" href="mailto:jordi.ballester@forgeflow.com">jordi.ballester@forgeflow.com</a>></li>
|
||||
<li>Christopher Ormaza <<a class="reference external" href="mailto:chris.ormaza@forgeflow.com">chris.ormaza@forgeflow.com</a>></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="section" id="other-credits">
|
||||
|
|
@ -468,7 +475,9 @@ Copyright (c) 2013, Jake Vanderplas</li>
|
|||
<p>OCA, or the Odoo Community Association, is a nonprofit organization whose
|
||||
mission is to support the collaborative development of Odoo features and
|
||||
promote its widespread use.</p>
|
||||
<p>This module is part of the <a class="reference external" href="https://github.com/OCA/web/tree/14.0/web_widget_mpld3_chart">OCA/web</a> project on GitHub.</p>
|
||||
<p>Current <a class="reference external" href="https://odoo-community.org/page/maintainer-role">maintainers</a>:</p>
|
||||
<p><a class="reference external" href="https://github.com/JordiBForgeFlow"><img alt="JordiBForgeFlow" src="https://github.com/JordiBForgeFlow.png?size=40px" /></a> <a class="reference external" href="https://github.com/ChrisOForgeFlow"><img alt="ChrisOForgeFlow" src="https://github.com/ChrisOForgeFlow.png?size=40px" /></a></p>
|
||||
<p>This module is part of the <a class="reference external" href="https://github.com/OCA/web/tree/15.0/web_widget_mpld3_chart">OCA/web</a> project on GitHub.</p>
|
||||
<p>You are welcome to contribute. To learn how please visit <a class="reference external" href="https://odoo-community.org/page/Contribute">https://odoo-community.org/page/Contribute</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,31 @@
|
|||
/** @odoo-module **/
|
||||
|
||||
import basicFields from "web.basic_fields";
|
||||
import fieldRegistry from "web.field_registry";
|
||||
|
||||
const Mpld3ChartWidget = basicFields.FieldChar.extend({
|
||||
jsLibs: [
|
||||
"/web_widget_mpld3_chart/static/src/lib/d3/d3.v5.js",
|
||||
"/web_widget_mpld3_chart/static/src/lib/mpld3/mpld3.v0.5.7.js",
|
||||
],
|
||||
_renderReadonly: function () {
|
||||
try {
|
||||
const val = JSON.parse(this.value);
|
||||
const new_div = document.createElement("div");
|
||||
new_div.setAttribute("id", val.div);
|
||||
this.$el.html(new_div);
|
||||
this.$el.ready(function () {
|
||||
const script = document.createElement("script");
|
||||
script.setAttribute("type", "text/javascript");
|
||||
if ("textContent" in script) script.textContent = val.script;
|
||||
else script.text = val.script;
|
||||
$("head").append(script);
|
||||
});
|
||||
} catch (error) {
|
||||
return this._super(...arguments);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
fieldRegistry.add("mpld3_chart", Mpld3ChartWidget);
|
||||
export default Mpld3ChartWidget;
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
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,
|
||||
};
|
||||
});
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
|
|
@ -1,23 +0,0 @@
|
|||
<?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>
|
||||
Loading…
Reference in New Issue