HTTPS SSH

OpenERP Web D3 chart Module

This is an openERP v7 web module, provinding a new kind of view chart-d3, it allow to display data on a chart.

d3_chart.js was getting from nv d3, it's based on d3 js library.

Informations

This module is standalone, however we made two other modules together Advanced board and widget color, first one allow an advanced user to manage dashboard, the second provide a color widget to choose object color that could be used on the chart.

How to use it

chart_example

The chart display grouped values on abscisse, at least one group is required. You can cumul groups as needs.

In the same way as other view in openERP, you can filtered values using the search view.

Today, we give the ability to display bar chart with a line on the top or pie chart.

We made tools that you can discover as stack, expand, hide value, export the chart...

View documentation

bellow an example view definition:

<record id="view_d3_id" model="ir.ui.view">
    <field name="name">my.model.d3</field>
    <field name="model">my.model</field>
    <field name="priority" eval="8"/>
    <field name="arch" type="xml">
        <chart-d3 string="View Name" version="7.0" type="multiBarAndStack">
            <x-axis field="default_group_by_field"/>
            <y-axis>
                <field name="data_field_1" label="Label field 1 on the chart" tick-format=".2f"/>
                <field name="data_field_2" label="Label field 2 on the chart"/>
                <field name="data_field_3" label="Label field 3 on the chart" tick-format=".2f"/>
            </y-axis>
            <y2-axis>
                <field name="data_field_1" label="Label field 1 on the chart" tick-format=".2f"/>
                <field name="data_field_4" label="Label 4" tick-format=".2f"/>
            </y2-axis>
            <options>
                <rotate-labels value="0"/>
                <tool-tips value="False"/>
                <no-data value="No data available"/>
                <menu pie="True"/>
                <donut value="True"/>
            </options>
        </chart-d3>
    </field>
</record>

Abscisse is constructed on the fly using openERP grouped, however you must declare default one using x-axis tag:

field:default group by to use on abscisse.

You can declare two list of fields (y-axis and y2-axis) to display on y axis, the first list will be used to display field as bar, the second to display as line. Each field could have following attributes:

name:The name of the openERP field to use
label:The label to display on the chart
tick-format:Format number to display to end users

Then, you can define chart options using <options> tag:

<rotate-labels value="0"/>:
 Define abscisse label orientation
<tool-tips value="False"/>:
 If you want to disabled tool tip on mouse over
<no-data value="No data available"/>:
 to change message when there is no data
<menu pie="True">:
 User can swith between bar chart and pie chart
<donut value="True"/>:
 To display pie chart as donut