summaryrefslogtreecommitdiff
path: root/addons/base_graph/static/lib/dhtmlxGraph/samples
diff options
context:
space:
mode:
authorKunal Chavda (OpenERP) <kch@tinyerp.com>2011-04-08 14:20:05 +0530
committerKunal Chavda (OpenERP) <kch@tinyerp.com>2011-04-08 14:20:05 +0530
commit20c75c45d8888e44b9b58b8ba67c6b5b2e8e7876 (patch)
tree6a3f8cbf50a611a2939f215fcf94133a66ba51fb /addons/base_graph/static/lib/dhtmlxGraph/samples
parent8f9edb9a102af7cb401c59c21deff928e891c9de (diff)
[IMP]Initialy show bar chart with data.
bzr revid: kch@tinyerp.com-20110408085005-hv9jv2wcfopnxrgm
Diffstat (limited to 'addons/base_graph/static/lib/dhtmlxGraph/samples')
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/01_load_xml.html70
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/02_load_json.html63
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/03_load_csv.html65
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/04_load_jsarray.html68
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/05_series.html119
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/01_default.html66
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/02_custom.html67
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/03_custom_logic.html77
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/04_gradient.html64
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/01_basic.html96
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/02_scales.html126
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/01_init.html67
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/02_text.html52
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/03_3d_chart.html48
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/04_legend.html81
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/01_init.html55
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/02_style.html153
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/03_scale.html101
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/04_spline.html57
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/05_series.html94
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/01_init.html74
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/02_text.html80
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/03_scales.html99
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/04_styles.html207
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html87
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/06_series.html81
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/07_horizonal_bars.html120
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/08_horizonal_stacked_bars.html75
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/01_init.html55
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/02_scale.html101
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_series.html90
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_stacked_area.html88
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/01_add.html83
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/02_events.html96
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/03_sorting.html73
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/04_filtering.html81
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/01_dhtmlxgrid.html70
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/02_dhtmlxgrid_group.html79
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/03_windows.html77
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/common/config.php13
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/common/data.php16
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/common/sales.xml46
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/common/stat.xml1
-rw-r--r--addons/base_graph/static/lib/dhtmlxGraph/samples/readme.txt7
44 files changed, 3388 insertions, 0 deletions
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/01_load_xml.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/01_load_xml.html
new file mode 100644
index 00000000000..e720ba8ee3e
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/01_load_xml.html
@@ -0,0 +1,70 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Data Loading: XML</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+
+ <script>
+ var barChart;
+ window.onload=function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ container:document.getElementById("chart_container"),
+ value:"#sales#",
+ label:"#year#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30,
+ gradient:true,
+ border:false
+ })
+ barChart.load("../common/sales.xml");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#sales#",
+ details:"#year#"
+ });
+ barChart2.load("../common/sales.xml");
+ }
+ function reloada(){
+
+ barChart.destructor();
+ barChart = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container",
+ value:"#sales#",
+ details:"#year#"
+ })
+ barChart.load("../common/sales.xml");
+ }
+
+ </script>
+</head>
+<body>
+ <p>Chart data can be loaded from different sources: xml,json,JS array,csv<br/> This samples demonstrates loading from xml file.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+
+ <input type="button" name="some_name" value="reload" onclick="reloada()">
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/02_load_json.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/02_load_json.html
new file mode 100644
index 00000000000..e2ce20ae764
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/02_load_json.html
@@ -0,0 +1,63 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Data Loading: JSON</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ { value:"2.9", label:"2000" },
+ { value:"3.5", label:"2001" },
+ { value:"3.1", label:"2002" },
+ { value:"4.2", label:"2003" },
+ { value:"4.5", label:"2004" },
+ { value:"9.6", label:"2005" },
+ { value:"7.4", label:"2006" },
+ { value:"9.0", label:"2007" },
+ { value:"7.3", label:"2008" },
+ { value:"2.8", label:"2009" }
+ ];
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ label:"#label#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30,
+ gradient:true,
+ border:false
+ })
+ barChart.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ details:"#label#"
+ });
+ barChart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/03_load_csv.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/03_load_csv.html
new file mode 100644
index 00000000000..64c39cfaef1
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/03_load_csv.html
@@ -0,0 +1,65 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Data Loading: CSV</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = "\
+ 2.9, 2000\n\
+ 3.5, 2001\n\
+ 3.1, 2002\n\
+ 4.2, 2003\n\
+ 4.5, 2004\n\
+ 9.6, 2005\n\
+ 7.4, 2006\n\
+ 9.0, 2007\n\
+ 7.3, 2008\n\
+ 2.8, 2009";
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#data0#",
+ label:"#data1#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30,
+ gradient:true,
+ border:false
+ })
+ barChart.parse(data,"csv");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#data0#",
+ details:"#data1#"
+ });
+ barChart2.parse(data,"csv");
+ }
+ </script>
+</head>
+<body>
+<p>When data are loaded from CSV string, you should use "data" and field index to define field in the template, for example, "#data0#","#data1#",etc.<br/>Charts in this sample represents values in the first column. Therefore, we have set value:"#data0#" in a chart contructor.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/04_load_jsarray.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/04_load_jsarray.html
new file mode 100644
index 00000000000..023cb0a503a
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/04_load_jsarray.html
@@ -0,0 +1,68 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Data Loading: JS array</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ [ "2.9", "2000" ],
+ [ "3.5", "2001" ],
+ [ "3.1", "2002" ],
+ [ "4.2", "2003" ],
+ [ "4.5", "2004" ],
+ [ "9.6", "2005" ],
+ [ "7.4", "2006" ],
+ [ "9.0", "2007" ],
+ [ "7.3", "2008" ],
+ [ "2.8", "2009" ]
+ ];
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#data0#",
+ label:"#data1#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30,
+ gradient:true,
+ border:false
+ })
+ barChart.parse(data,"jsarray");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#data0#",
+ details:"#data1#"
+ });
+ barChart2.parse(data,"jsarray");
+ }
+ </script>
+
+</head>
+<body>
+ <p>When data are loaded from JS array, you should use "data" and field index to define field in the template, for example, "#data0#","#data1#",etc.<br/>Charts in this sample represents values in the first column. Therefore, we have set value:"#data0#" in a chart contructor.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/05_series.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/05_series.html
new file mode 100644
index 00000000000..0600c05741d
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/01_initialization/05_series.html
@@ -0,0 +1,119 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>PieChart: Initiazation</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h1>BarChart: Scales</h1>
+
+ <table>
+ <tr>
+ <td>Automatic vertical scale</td>
+ <td>Custom vertical scale</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:350px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+ <script>
+ var data = [
+ { sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2000" },
+ { sales:"3.8",sales1:"4.5",sales2:"2.5",sales3:"7.5", year:"2001" },
+ { sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2002" }
+ ];
+
+
+
+ var barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ width:30,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ title:"Sales,million"
+ },
+ gradient:true,
+ border:false,
+ color: "#66cc33"
+ })
+ barChart1.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#"
+ });
+ barChart1.addSeries({
+ value:"#sales2#",
+ color:"#ffff99",
+ label:"#sales2#"
+ });
+ barChart1.parse(data,"json");
+
+
+
+
+ var barChart2 = new dhtmlXChart({
+ view:"bar",
+ container:"chart2",
+ value:"#sales#",
+ gradient:true,
+ border:false,
+ width:30,
+ color: "#66cc33",
+ label:"#sales#",
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ },
+ yAxis:{
+ start: 0,
+ end: 10,
+ step: 1,
+ title:"Sales, mil"
+ }
+
+ });
+ barChart2.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#"
+ });
+ barChart2.addSeries({
+ value:"#sales2#",
+ color:"#ffff99",
+ label:"#sales2#"
+ });
+ barChart2.addSeries({
+ value:"#sales3#",
+ color:"#ccff99",
+ label:"#sales3#"
+ });
+
+ barChart2.parse(data,"json");
+
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/01_default.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/01_default.html
new file mode 100644
index 00000000000..39b2f5e3865
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/01_default.html
@@ -0,0 +1,66 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Colors: default</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:"2.9", year:"2000" },
+ { sales:"3.5", year:"2001" },
+ { sales:"3.1", year:"2002" },
+ { sales:"4.2", year:"2003" },
+ { sales:"4.5", year:"2004" },
+ { sales:"9.6", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ label:"#year#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30
+ })
+ barChart.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#sales#",
+ details:"#year#"
+ });
+ barChart2.parse(data,"json");
+}
+ </script>
+</head>
+<body>
+ <p>Chart colors are defined by color property. If it is not set, chart is colored using "rainbow" algorithm.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/02_custom.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/02_custom.html
new file mode 100644
index 00000000000..8157a8f82b2
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/02_custom.html
@@ -0,0 +1,67 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Colors: custom colors</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:"2.9", year:"2000", color:"#0000FF" },
+ { sales:"3.5", year:"2001", color:"#00FF00"},
+ { sales:"3.1", year:"2002", color:"#00FFFF"},
+ { sales:"4.2", year:"2003", color:"#FF0000"},
+ { sales:"4.5", year:"2004", color:"#FF00FF"},
+ { sales:"9.6", year:"2005", color:"#FFFF00"},
+ { sales:"7.4", year:"2006", color:"#880088"},
+ { sales:"9.0", year:"2007", color:"#008800"},
+ { sales:"7.3", year:"2008", color:"#880000"},
+ { sales:"4.8", year:"2009", color:"#000088"}
+ ];
+
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ label:"#year#",
+ color:"#color#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30
+ })
+ barChart.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#sales#",
+ details:"#year#",
+ color:"#color#"
+ });
+ barChart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <p>Colors can be defined with template. In this sample colors and defined in data by "color" field.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px"></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/03_custom_logic.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/03_custom_logic.html
new file mode 100644
index 00000000000..e88c37b3283
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/03_custom_logic.html
@@ -0,0 +1,77 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Colors: custom logic</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:"2.9", year:"2000" },
+ { sales:"3.5", year:"2001" },
+ { sales:"3.1", year:"2002" },
+ { sales:"4.2", year:"2003" },
+ { sales:"4.5", year:"2004" },
+ { sales:"9.6", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ label:"#year#",
+ width:30,
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ gradient:true,
+ border:false,
+ color:function(obj){
+ if (obj.sales > 5) return "#FF0000";
+ else return "#00FF00";
+ }
+ })
+ barChart.parse(data,"json");
+
+ var index = 1;
+ var barChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart_container2",
+ value:"#sales#",
+ label:"#year#",
+ gradient:true,
+ color:function(obj,ratio){
+ index++;
+ if (index % 2) return "#FF0000";
+ return "#00FF00";
+ }
+ });
+ barChart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <p>Colors can be defined using function. In this sample color of bars depends on sales value, and colors of pie sectors are alternative.</p>
+ <div id="chart_container" style="width:450px;height:300px;border:1px solid #A4BED4;float:left;margin-right:20px""></div>
+ <div id="chart_container2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/04_gradient.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/04_gradient.html
new file mode 100644
index 00000000000..973d9cdc008
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/02_color/04_gradient.html
@@ -0,0 +1,64 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Colors: color gradient</title>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:"2.9", year:"2000" },
+ { sales:"3.5", year:"2001" },
+ { sales:"3.1", year:"2002" },
+ { sales:"4.2", year:"2003" },
+ { sales:"4.5", year:"2004" },
+ { sales:"9.6", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ label:"#year#",
+ padding:{
+ bottom:0,
+ right:0,
+ left:0
+ },
+ width:30,
+ gradient:function(gradient){
+ gradient.addColorStop(1.0,"#FF0000");
+ gradient.addColorStop(0.2,"#FFFF00");
+ gradient.addColorStop(0.0,"#00FF22");
+ }
+ })
+ barChart.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <p>The color of Bar Chart can be defined by gradient property. <br/>
+ In this case you should set a function that takes a gradient object as an argument. And using addColorStop you may define colors for chart.</p>
+ <div id="chart_container" style="width:500px;height:300px;border:1px solid #A4BED4;"></div>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/01_basic.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/01_basic.html
new file mode 100644
index 00000000000..401dbdae24f
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/01_basic.html
@@ -0,0 +1,96 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Grouping and Sorting</title>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var barChart;
+window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:70,
+ label:"#id#",
+ sort:{
+ by:"#id#",
+ as:"string",
+ dir:"asc"
+ },
+ group:{
+ by:"#year#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ },
+ padding:{
+ bottom:0
+ }
+ })
+ barChart.load("../common/stat.xml");
+}
+
+ function groupA(){
+ barChart.group({
+ by:"#company#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ });
+ barChart.refresh();
+ }
+
+ function groupB(){
+ barChart.group({
+ by:"#year#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ });
+ }
+
+ function groupC(){
+ barChart.group({
+ by:"#year#",
+ map:{
+ sales:["#sales#","max"]
+ }
+ });
+ }
+
+ </script>
+</head>
+<body>
+ <p>It's possible to group chart data by a certain property. You may use group method or group property in a chart constructor.</p>
+ <div id="chart_container" style="width:600px;height:300px;border:1px solid #A4BED4;"></div>
+
+
+ <br/>
+ <input type="button" name="some_name" value="Group by" onclick="window['group'+document.getElementById('groupby').value]()">
+ <select name="groupby" id="groupby">
+ <option value="A">company</option>
+ <option value="B" SELECTED>year (total sales)</option>
+ <option value="C">year (max sales)</option>
+ </select>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/02_scales.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/02_scales.html
new file mode 100644
index 00000000000..75746062b29
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/03_group/02_scales.html
@@ -0,0 +1,126 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales and grouping</title>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+ <style>
+ .dhx_chart_title{
+ padding-left:3px
+ }
+ </style>
+ <script>
+ var barChart;
+ window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:70,
+ yAxis:{},
+ xAxis:{
+ template:"#id#",
+ title:"Sales per year (all companies)"
+ },
+ label:"#sales#",
+ sort:{
+ by:"#id#",
+ as:"string",
+ dir:"asc"
+ },
+ group:{
+ by:"#year#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ }
+ })
+ barChart.load("../common/stat.xml");
+ }
+
+ function groupA(){
+ barChart.define("xAxis",{
+ template:"#id#",
+ title:"Total sales per companies"
+ });
+ barChart.define("yAxis",{});
+ barChart.group({
+ by:"#company#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ });
+ barChart.refresh();
+ }
+
+ function groupB(){
+ barChart.define("xAxis",{
+ template:"#id#",
+ title:"Sales per year (all companies)"
+ });
+ barChart.define("yAxis",{});
+ barChart.group({
+ by:"#year#",
+ map:{
+ sales:["#sales#","sum"]
+ }
+ });
+ }
+
+ function groupC(){
+ barChart.define("xAxis",{
+ template:"#id#",
+ title:"Maximum sales per year"
+ });
+ barChart.define("yAxis",{});
+ barChart.group({
+ by:"#year#",
+ map:{
+ sales:["#sales#","max"]
+ }
+ });
+ }
+
+ function sort(direction){
+
+ barChart.define("sort",{
+ by:"#sales#",
+ dir:direction,
+ as:"int"
+ });
+ barChart.render();
+ }
+ </script>
+</head>
+<body>
+ <p>To update configuration properties after grouping you need to cal define method with new settings.</p>
+ <div id="chart_container" style="width:600px;height:300px;border:1px solid #A4BED4;"></div>
+ <br/>
+ <input type="button" name="some_name" value="Group by" onclick="window['group'+document.getElementById('groupby').value]()">
+ <select name="groupby" id="groupby">
+ <option value="A">company</option>
+ <option value="B" SELECTED>year (total sales)</option>
+ <option value="C">year (max sales)</option>
+ </select>
+ <br/><br/>
+ <input type="button" name="some_name" value="Sort by sales" onclick="sort(document.getElementById('dir').value)">
+ <select name="dir" id="dir">
+ <option value="asc" selected>asc</option>
+ <option value="desc" >desc</option>
+ </select>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/01_init.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/01_init.html
new file mode 100644
index 00000000000..63c82ecf42c
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/01_init.html
@@ -0,0 +1,67 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Initialization</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"6300", company:"Company 1",color:"#d2ed7e" },
+ { sales:"8700", company:"Company 2",color:"#b3e025" },
+ { sales:"10500", company:"Company 3",color:"#9ac86d" },
+ { sales:"7800", company:"Company 4",color:"#e0e56c" }
+ ];
+
+ window.onload = function(){
+ var chart = new dhtmlXChart({
+ view:"pie",
+ container:"chart1",
+ value:"#sales#",
+ color:"#color#",
+ label:"#company#",
+ pieInnerText:"<b>#sales#</b>",
+ gradient:true
+ });
+ chart.parse(data,"json");
+
+
+ var chart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart2",
+ value:"#sales#",
+ color:"#color#",
+ label:"#company#",
+ pieInnerText:"<b>#sales#</b>",
+ gradient:true,
+ radius:90,
+ x:280,
+ y:150
+ });
+ chart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td>Pie chart with Automatic radius and center position</td>
+ <td>Pie chart with Custom radius and center position</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/02_text.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/02_text.html
new file mode 100644
index 00000000000..7ba118f19e2
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/02_text.html
@@ -0,0 +1,52 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Labels</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"10.7", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var pieChart = new dhtmlXChart({
+ view:"pie",
+ container:"chart",
+ value:"#sales#",
+ pieInnerText:"#sales#",
+ label:"#year#"
+ });
+ pieChart.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <p>There are two properties to define sectors labels:
+ <li>label - defines text outside sectors</li>
+ <li>pieInnerText - set text inside sectors</li>
+ </p>
+
+ <div id="chart" style="width:450px;height:300px;"></div></td>
+
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/03_3d_chart.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/03_3d_chart.html
new file mode 100644
index 00000000000..957f7ed7954
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/03_3d_chart.html
@@ -0,0 +1,48 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>3D view</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"10.5", component:"dhxGrid",color:"#c7e1f3" },
+ { sales:"8.7", component:"dhxScheduler",color:"#45abf5" },
+ { sales:"6.3", component:"dhxTree",color:"#3590d0" },
+ { sales:"5.3", component:"dhxTabbar",color:"#BDDBF9" },
+ { sales:"4.5", component:"dhxLayout",color:"#d9e5ed" },
+ { sales:"4.2", component:"dhxMenu",color:"#aed7f4" }
+ ];
+
+ window.onload = function(){
+ var chart = new dhtmlXChart({
+ view:"pie3D",
+ container:"chart",
+ value:"#sales#",
+ label:function(obj){
+ var sum = chart.sum("#sales#");
+ return obj.component+" ("+Math.round(parseFloat(obj.sales)/sum*100)+"%)";
+ },
+ color:"#color#",
+ radius:110
+ });
+ chart.parse(data,"json");
+ }
+
+ </script>
+</head>
+<body>
+ <div id="chart" style="width:500px;height:300px;border:1px solid #A4BED4;"></div></td>
+
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/04_legend.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/04_legend.html
new file mode 100644
index 00000000000..2d5c45c0151
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/04_pie_chart/04_legend.html
@@ -0,0 +1,81 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Details Block</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+ window.onload = function(){
+ var pieChart = new dhtmlXChart({
+ view:"pie",
+ container:"chart1",
+ value:"#sales#",
+ pieInnerText:"#sales#",
+ gradient:true,
+ tooltip:{
+ template:"#sales#"
+ },
+ legend:"#year#"
+ });
+ pieChart.parse(data,"json");
+
+
+ var pieChart2 = new dhtmlXChart({
+ view:"pie",
+ container:"chart2",
+ value:"#sales#",
+ pieInnerText:"#sales#",
+ gradient:true,
+ legend:{
+ width: 75,
+ align:"right",
+ valign:"middle",
+ marker:{
+ type:"round",
+ width:15
+ },
+ template:"#year#"
+ }
+ });
+ pieChart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <p>Pie Chart provides property "details" that displayes informationa about all sectors in a separate block.</p>
+
+ <table>
+ <tr>
+ <td>PieChart with default details block</td>
+ <td>PieChart with custom details block</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/01_init.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/01_init.html
new file mode 100644
index 00000000000..626a1e216fe
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/01_init.html
@@ -0,0 +1,55 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Initialization</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart = new dhtmlXChart({
+ view:"line",
+ container:"chart",
+ value:"#sales#",
+ label:"#year#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#ffffff",
+ color: "#000000"
+ },
+ line:{
+ color:"#ff9900",
+ width:3
+ }
+ })
+ chart.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+</body>
+</html>
+
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/02_style.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/02_style.html
new file mode 100644
index 00000000000..39dfe7eb41f
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/02_style.html
@@ -0,0 +1,153 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Style definition</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ window.onload = function(){
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ var chart1 = new dhtmlXChart({
+ view:"line",
+ container:"chart1",
+ value:"#sales#",
+ label:"#year#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#ffffff",
+ color: "#000000"
+ },
+ line:{
+ color:"#ff9900",
+ width:3
+ }
+ })
+ chart1.parse(data,"json");
+
+ var chart2 = new dhtmlXChart({
+ view:"line",
+ container:"chart2",
+ value:"#sales#",
+ label:"#year#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#3399ff",
+ color: "#ffffff"
+ },
+ line:{
+ color:"#3399ff",
+ width:3
+ }
+ })
+ chart2.parse(data,"json");
+
+ var data2 = [
+ { sales:"1.2", year:"2000" },
+ { sales:"2.4", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"5.9", year:"2005" },
+ { sales:"6.5", year:"2006" },
+ { sales:"6.1", year:"2007" },
+ { sales:"6.0", year:"2008" },
+ { sales:"6.2", year:"2009" }
+ ];
+ var chart3 = new dhtmlXChart({
+ view:"line",
+ container:"chart3",
+ value:"#sales#",
+ item:{
+ radius:0
+ },
+ line:{
+ color:"#b25151",
+ width:3
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#",
+ lines:true
+ },
+ yAxis:{
+ start: 0,
+ end: 10,
+ step: 1,
+ title:"Sales, mil"
+ },
+ tooltip:{
+ template:"#year#"
+ }
+ })
+ chart3.parse(data2,"json");
+
+ var chart4 = new dhtmlXChart({
+ view:"line",
+ container:"chart4",
+ value:"#sales#",
+ item:{
+ borderColor: "#000000",
+ color: "#ffffff",
+ borderWidth:1,
+ radius:3
+ },
+ line:{
+ color:"#3399ff",
+ width:3
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ },
+ yAxis:{
+ start: 0,
+ end: 10,
+ step: 1,
+ title:"Sales, mil",
+ lines:false
+ },
+ tooltip:{
+ template:"#year#"
+ }
+ })
+ chart4.parse(data2,"json");
+ }
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ <tr>
+ <td><div id="chart3" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart4" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/03_scale.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/03_scale.html
new file mode 100644
index 00000000000..161cbf7ee53
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/03_scale.html
@@ -0,0 +1,101 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart1 = new dhtmlXChart({
+ view:"line",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#ffffff",
+ color: "#000000"
+ },
+ line:{
+ color:"#ff9900",
+ width:3
+ },
+ yAxis:{},
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ }
+ })
+ chart1.parse(data,"json");
+
+ var chart2 = new dhtmlXChart({
+ view:"line",
+ container:"chart2",
+ value:"#sales#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#3399ff",
+ color: "#ffffff"
+ },
+ line:{
+ color:"#3399ff",
+ width:3
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales, million"
+ },
+ item:{
+ borderColor: "#3399ff",
+ color: "#ffffff"
+ }
+ })
+ chart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td>Automatic vertical scale</td>
+ <td>Custom vertical scale</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+</body>
+</html>
+
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/04_spline.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/04_spline.html
new file mode 100644
index 00000000000..4f266ee8983
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/04_spline.html
@@ -0,0 +1,57 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Initialization</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart = new dhtmlXChart({
+ view:"spline",
+ container:"chart",
+ value:"#sales#",
+ label:"#year#",
+ tooltip:{
+ template:"#sales#"
+ },
+ item:{
+ borderColor: "#ffffff",
+ color: "#000000"
+ },
+ line:{
+ color:"#ff9900",
+ width:3
+ },
+ padding:{
+ left:15
+ }
+ })
+ chart.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/05_series.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/05_series.html
new file mode 100644
index 00000000000..532cd385519
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/05_line_chart/05_series.html
@@ -0,0 +1,94 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { "companyA":"-1.9", "companyB":1, year:"2000" },
+ { "companyA":"-0.8", "companyB":0.8, year:"2001" },
+ { "companyA":"3.4", "companyB":1.9, year:"2002" },
+ { "companyA":"4.1", "companyB":2.5, year:"2003" },
+ { "companyA":"4.3", "companyB":3.1, year:"2004" },
+ { "companyA":"5.9", "companyB":4.5, year:"2005" },
+ { "companyA":"6.1", "companyB":5.7, year:"2006" },
+ { "companyA":"6.5", "companyB":7.2, year:"2007" },
+ { "companyA":"5.2", "companyB":6.5, year:"2008" },
+ { "companyA":"4.8", "companyB":6.8, year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart1 = new dhtmlXChart({
+ view:"line",
+ container:"chart1",
+ value:"#companyA#",
+ item:{
+ borderColor: "#3399ff",
+ color: "#ffffff"
+ },
+ line:{
+ color:"#3399ff",
+ width:3
+ },
+ xAxis:{
+ template:"#year#"
+ },
+ yAxis:{
+ start:-2,
+ step:1,
+ end:8
+ },
+ padding:{
+ left:35,
+ bottom:20
+ },
+ origin:0,
+ legend:{
+ layout:"x",
+ width: 75,
+ align:"center",
+ valign:"bottom",
+ marker:{
+ type:"round",
+ width:15
+ },
+ values:[
+ {text:"company A",color:"#3399ff"},
+ {text:"company B",color:"#66cc00"}
+ ]
+ }
+ })
+
+
+ chart1.addSeries({
+ value:"#companyB#",
+ item:{
+ borderColor: "#66cc00",
+ color: "#ffffff"
+ },
+ line:{
+ color:"#66cc00",
+ width:3
+ }
+ })
+ chart1.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:500px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/01_init.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/01_init.html
new file mode 100644
index 00000000000..e31ae20dd39
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/01_init.html
@@ -0,0 +1,74 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>PieChart: Initiazation</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#year#",
+ width:30,
+ gradient:true,
+ border:false
+ })
+ barChart1.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"bar",
+ container:"chart2",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#66ccff",
+ gradient:"3d",
+ //border:false,
+ width:25,
+ padding:{
+ bottom:0,
+ right:50,
+ left:50
+ }
+ });
+ barChart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <h1>BarChart: Initiazation</h1>
+
+ <table>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/02_text.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/02_text.html
new file mode 100644
index 00000000000..ee378b194f1
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/02_text.html
@@ -0,0 +1,80 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>PieChart: Initiazation</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h1>BarChart: Initiazation</h1>
+
+ <table>
+ <tr>
+ <td></td>
+ <td></td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+
+ var barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#66cc33",
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ }
+ })
+ barChart1.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"bar",
+ container:"chart2",
+ value:"#sales#",
+ label:"#sales#",
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ }
+ });
+ barChart2.parse(data,"json");
+
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/03_scales.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/03_scales.html
new file mode 100644
index 00000000000..edc1f6ca45d
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/03_scales.html
@@ -0,0 +1,99 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>PieChart: Initiazation</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h1>BarChart: Scales</h1>
+
+ <table>
+ <tr>
+ <td>Custom vertical scale and origin</td>
+ <td>Automatic vertical scale</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+ <script>
+ var data = [
+ { sales:"-2.0", year:"2000" },
+ { sales:"-0.4", year:"2001" },
+ { sales:"1.1", year:"2002" },
+ { sales:"3.3", year:"2003" },
+ { sales:"1.2", year:"2004" },
+ { sales:"1.8", year:"2005" },
+ { sales:"4.1", year:"2006" },
+ { sales:"5.5", year:"2007" },
+ { sales:"3.5", year:"2008" },
+ { sales:"1.8", year:"2009" }
+ ];
+
+
+
+
+ var barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ width:30,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ template:"#year#",
+ title:"Year"
+ },
+
+ yAxis:{
+ start:-3,
+ end:7,
+ step:1,
+ title:"Profit"
+ },
+ origin:0,
+ gradient:true,
+ border:false
+ })
+ barChart1.parse(data,"json");
+
+
+
+
+ var barChart2 = new dhtmlXChart({
+ view:"bar",
+ container:"chart2",
+ value:"#sales#",
+ gradient:true,
+ border:false,
+ width:30,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ template:"#year#",
+ title:"Year"
+ },
+ yAxis:{
+ title:"Profit"
+ }
+
+ });
+ barChart2.parse(data,"json");
+
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/04_styles.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/04_styles.html
new file mode 100644
index 00000000000..0877a95de16
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/04_styles.html
@@ -0,0 +1,207 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Chart</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h1>Chart</h1>
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart3" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ <tr>
+
+
+ </tr>
+ <tr>
+ <td><div id="chart4" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart5" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart6" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+
+ var barChart1 = new dhtmlXChart({
+ view:"bar",
+ alpha:function(data){
+ return data.sales/10;
+ },
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#66cc33",
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales, million"
+ }
+ })
+ barChart1.parse(data,"json");
+
+ var barChart2 = new dhtmlXChart({
+ view:"bar",
+ container:"chart2",
+ value:"#sales#",
+ label:"#sales#",
+ width:2,
+ border:false,
+
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Years",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales,<br/>million"
+ }
+
+ })
+ barChart2.parse(data,"json");
+
+
+ var barChart3 = new dhtmlXChart({
+ view:"bar",
+ container:"chart3",
+ value:"#sales#",
+ label:"#sales#",
+ width:35,
+ border:false,
+ gradient:true,
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales,<br/>million"
+ }
+ });
+ barChart3.parse(data,"json");
+
+ var barChart4 = new dhtmlXChart({
+ view:"bar",
+ alpha:function(data){
+ return data.sales/10;
+ },
+ container:"chart4",
+ value:"#sales#",
+ label:"#sales#",
+ width:50,
+ gradient:function(gradient){
+ gradient.addColorStop(1.0,"#FF0000");
+ gradient.addColorStop(0.3,"#FFFF00");
+ gradient.addColorStop(0.0,"#00FF22");
+ },
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales,<br/>million"
+ }
+ })
+ barChart4.parse(data,"json");
+
+
+ var barChart5 = new dhtmlXChart({
+ view:"bar",
+ container:"chart5",
+ value:"#sales#",
+ label:"#sales#",
+ width:35,
+
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales,<br/>million"
+ }
+ })
+ barChart5.parse(data,"json");
+
+ var barChart6 = new dhtmlXChart({
+ view:"bar",
+ alpha:function(data){
+ return data.sales/10;
+ },
+ container:"chart6",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#66cc33",
+ border:false,
+ width:30,
+ radius:0,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ end:10,
+ step:1,
+ title:"Sales,<br/>million"
+ }
+ })
+ barChart6.parse(data,"json");
+
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html
new file mode 100644
index 00000000000..d165d0bd488
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/05_stacked_chart.html
@@ -0,0 +1,87 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>StackedBar Chart</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body onload="init()">
+ <h1>StackedBar Chart</h1>
+ <div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div>
+
+
+ <script>
+ var data = [
+ { sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2000" },
+ { sales:"5.0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2001" },
+ { sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2002" }
+ ];
+ function init(){
+ var barChart1 = new dhtmlXChart({
+ view:"stackedBar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ width:60,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ title:"Sales,million"
+ },
+ gradient:"3d",
+ //border:false,
+ color: "#66cc33",
+ legend:{
+ values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"},{text:"department D",color:"#66ffcc"}],
+ valign:"top",
+ align:"right",
+ width:120,
+ layout:"y",
+ marker:{
+ width:15,
+ type:"round"
+ }
+ }
+ })
+ barChart1.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#",
+ tooltip:{
+ template:"#sales1#"
+ }
+ });
+ barChart1.addSeries({
+ value:"#sales2#",
+ color:"#ffff99",
+ label:"#sales2#",
+ tooltip:{
+ template:"#sales2#"
+ }
+ });
+ barChart1.addSeries({
+ value:"#sales3#",
+ color:"#66ffcc",
+ label:"#sales3#",
+ tooltip:{
+ template:"#sales3#"
+ }
+ });
+ barChart1.parse(data,"json");
+ }
+</script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/06_series.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/06_series.html
new file mode 100644
index 00000000000..3c5fb695692
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/06_series.html
@@ -0,0 +1,81 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Series</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h1>Series</h1>
+
+ <div id="chart" style="width:500px;height:300px;border:1px solid #A4BED4;"></div>
+
+ <script>
+ var data = [
+ { sales:"4.2",sales1:"3.4",sales2:"1.2", year:"2000" },
+ { sales:"3.8",sales1:"4.5",sales2:"2.5", year:"2001" },
+ { sales:"3.4",sales1:"4.7",sales2:"1.9", year:"2002" }
+ ];
+
+
+
+ var barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart",
+ value:"#sales#",
+ label:"#sales#",
+ width:30,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ start:0,
+ step:1,
+ end:5,
+ title:"Sales,million"
+ },
+ gradient:true,
+ border:false,
+ color: "#66cc33",
+ legend:{
+ values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"}],
+ valign:"top",
+ align:"center",
+ width:120,
+ layout:"x",
+ marker:{
+ width:15,
+ type:"round"
+ }
+ }
+ })
+ barChart.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#"
+ });
+ barChart.addSeries({
+ value:"#sales2#",
+ color:"#ffff99",
+ label:"#sales2#"
+ });
+ barChart.parse(data,"json");
+
+
+
+
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/07_horizonal_bars.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/07_horizonal_bars.html
new file mode 100644
index 00000000000..6c8046c5855
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/07_horizonal_bars.html
@@ -0,0 +1,120 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Horizontal bar Chart</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+</head>
+<body >
+ <h3>Horizontal bar Chart</h3>
+
+ <table>
+
+ <tr>
+ <td><div id="chart1" style="width:450px;height:350px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:450px;height:350px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+
+ var data2 = [
+ { sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2007" },
+ { sales:"3.8",sales1:"4.5",sales2:"2.5",sales3:"7.5", year:"2008" },
+ { sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2009" }
+ ];
+ var barChart1 = new dhtmlXChart({
+ view:"barH",
+ container:"chart1",
+ value:"#sales#",
+ width:50,
+ label: "#sales#",
+ gradient:"3d",
+ color:"#ffcc00",
+ xAxis:{
+ title:"Sales per year",
+ lines: true
+ },
+ yAxis:{
+ title:"Year",
+ template:"#year#"
+ },
+ padding:{
+ left:75,
+ right:30
+ }
+ })
+ barChart1.parse(data,"json");
+
+
+
+ var barChart2 = new dhtmlXChart({
+ view:"barH",
+ container:"chart2",
+ value:"#sales#",
+ label:"#sales#",
+ width:30,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year"
+ },
+ yAxis:{
+ title:"Year",
+ template:"#year#"
+ },
+ gradient:true,
+ border:false,
+ color: "#66cc33",
+ legend:{
+ values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff99"}],
+
+ width:120,
+ align:"right",
+ valign:"middle",
+ marker:{
+ width:15,
+ type:"round"
+ }
+ },
+ padding:{
+ left:65
+ }
+ });
+ barChart2.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#"
+ });
+ barChart2.addSeries({
+ value:"#sales2#",
+ color:"#ffff99",
+ label:"#sales2#"
+ });
+ barChart2.parse(data2,"json");
+ </script>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/08_horizonal_stacked_bars.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/08_horizonal_stacked_bars.html
new file mode 100644
index 00000000000..fe4d8509376
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/06_bar_chart/08_horizonal_stacked_bars.html
@@ -0,0 +1,75 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Horizontal Stacked Bars</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+<script>
+
+var data = [
+ { sales:"3.0",sales1:"3.4",sales2:"1.2",sales3:"6.9", year:"2007" },
+ { sales:"5.0",sales1:"5.0",sales2:"5.0",sales3:"5.0", year:"2008" },
+ { sales:"3.4",sales1:"4.7",sales2:"1.9",sales3:"5.5", year:"2009" }
+];
+
+window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"stackedBarH",
+ container:"chart",
+ value:"#sales#",
+ width:50,
+ label: "#sales#",
+ gradient:"3d",
+ color: "#66cc33",
+ xAxis:{
+ title:"Sales per year",
+ lines: false
+ },
+ yAxis:{
+ title:"Year",
+ template:"#year#"
+ },
+ padding:{left:75},
+ legend:{
+ values:[{text:"department A",color:"#66cc33"},{text:"department B",color:"#ff9933"},{text:"department C",color:"#ffff66"},{text:"department D",color:"#66ffcc"}],
+ valign:"top",
+ align:"left",
+ width:120,
+ layout:"x",
+ marker:{
+ width:15,
+ type:"round"
+ }
+ }
+ })
+ barChart.addSeries({
+ value:"#sales1#",
+ color:"#ff9933",
+ label:"#sales1#"
+ });
+ barChart.addSeries({
+ value:"#sales2#",
+ color:"#ffff66",
+ label:"#sales2#"
+ });
+ barChart.addSeries({
+ value:"#sales3#",
+ color:"#66ffcc",
+ label:"#sales3#"
+ });
+ barChart.parse(data,"json");
+}
+ </script>
+</head>
+<body>
+ <div id="chart" style="width:480px;height:350px;border:1px solid #A4BED4;"></div></td>
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/01_init.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/01_init.html
new file mode 100644
index 00000000000..5195e7476e1
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/01_init.html
@@ -0,0 +1,55 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Initialization</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"7.6", year:"2005" },
+ { sales:"7.8", year:"2006" },
+ { sales:"7.2", year:"2007" },
+ { sales:"5.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart = new dhtmlXChart({
+ view:"area",
+ container:"chart",
+ value:"#sales#",
+ label:"#year#",
+ color:"#00ccff",
+ tooltip:{
+ template:"#sales#"
+ },
+
+ alpha:0.8,
+ padding:{
+ left:0,
+ right:0,
+ bottom:0
+ }
+ })
+ chart.parse(data,"json");
+ }
+ </script>
+</head>
+<body>
+ <div id="chart" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
+</body>
+</html>
+
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/02_scale.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/02_scale.html
new file mode 100644
index 00000000000..e3d65bd6d55
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/02_scale.html
@@ -0,0 +1,101 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <style>
+ .dhx_axis_item_x{
+ font-size: 10px
+ }
+ .dhx_axis_item_y{
+ font-size: 10px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"7.6", year:"2005" },
+ { sales:"7.8", year:"2006" },
+ { sales:"7.2", year:"2007" },
+ { sales:"5.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart1 = new dhtmlXChart({
+ view:"area",
+ container:"chart1",
+ value:"#sales#",
+ color:"#00ccff",
+ tooltip:{
+ template:"#sales#"
+ },
+ padding:{
+ left:30
+ },
+ yAxis:{
+ start:0,
+ step:1,
+ end:10
+ },
+ xAxis:{
+ lines:true,
+ title:"sales per year",
+ template:"#year#"
+ }
+ })
+ chart1.parse(data,"json");
+
+ var chart2 = new dhtmlXChart({
+ view:"area",
+ container:"chart2",
+ value:"#sales#",
+ tooltip:{
+ template:"#sales#"
+ },
+ color:"#00ccff",
+ xAxis:{
+ title:"sales per year",
+ template:"#year#"
+ },
+ yAxis:{
+ },
+ padding:{
+ left:30
+ },
+ item:{
+ borderColor: "#3399ff",
+ color: "#ffffff"
+ }
+ })
+ chart2.parse(data,"json");
+ }
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td>Custom vertical scale</td>
+ <td>Automatic vertical scale</td>
+ </tr>
+ <tr>
+ <td><div id="chart1" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
+ <td><div id="chart2" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+</body>
+</html>
+
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_series.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_series.html
new file mode 100644
index 00000000000..c071386c348
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_series.html
@@ -0,0 +1,90 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <style>
+ .dhx_axis_item_x{
+ font-size: 10px
+ }
+ .dhx_axis_item_y{
+ font-size: 10px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:3.0, sales1:2.8, sales2:3.4, year:"2000" },
+ { sales:3.8, sales1:2.5, sales2:2.0, year:"2001" },
+ { sales:3.4, sales1:1.7, sales2:3.1, year:"2002" },
+ { sales:4.1, sales1:2.7, sales2:3.5, year:"2003" },
+ { sales:4.3, sales1:3.6, sales2:4.0, year:"2004" },
+ { sales:7.6, sales1:3.1, sales2:4.9, year:"2005" },
+ { sales:7.8, sales1:3.9, sales2:5.2, year:"2006" },
+ { sales:7.2, sales1:3.6, sales2:5.6, year:"2007" },
+ { sales:5.3, sales1:2.9, sales2:4.1, year:"2008" },
+ { sales:4.8, sales1:2.1, sales2:3.9, year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart1 = new dhtmlXChart({
+ view:"area",
+ container:"chart",
+ value:"#sales#",
+ color:"#00ccff",
+ alpha:0.6,
+ padding:{
+ left:30
+ },
+ yAxis:{
+ start:0,
+ step:1,
+ end:8
+ },
+ xAxis:{
+ lines:true,
+ title:"sales per year",
+ template:"#year#"
+ },
+ legend:{
+ layout:"x",
+ width: 75,
+ align:"center",
+ valign:"top",
+ marker:{
+ type:"round",
+ width:15
+ },
+ values:[
+ {text:"company A",color:"#00ccff"},
+ {text:"company B",color:"#0000ff"},
+ {text:"company C",color:"#cc33ff"}
+ ]
+ }
+ })
+ chart1.addSeries({
+ value:"#sales1#",
+ color:"#0000ff"
+ })
+ chart1.addSeries({
+ value:"#sales2#",
+ color:"#cc33ff"
+ })
+ chart1.parse(data,"json");
+
+ }
+ </script>
+</head>
+<body >
+ <div id="chart" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_stacked_area.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_stacked_area.html
new file mode 100644
index 00000000000..55fccb93e84
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/07_area_chart/03_stacked_area.html
@@ -0,0 +1,88 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Scales</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <style>
+ .dhx_axis_item_x{
+ font-size: 10px
+ }
+ .dhx_axis_item_y{
+ font-size: 10px
+ }
+ </style>
+ <script>
+ var data = [
+ { sales:3.0, sales1:2.8, sales2:3.9, year:"2000" },
+ { sales:3.8, sales1:2.5, sales2:2.0, year:"2001" },
+ { sales:3.4, sales1:1.7, sales2:3.1, year:"2002" },
+ { sales:4.1, sales1:2.7, sales2:3.5, year:"2003" },
+ { sales:4.3, sales1:3.6, sales2:4.0, year:"2004" },
+ { sales:7.6, sales1:3.1, sales2:4.9, year:"2005" },
+ { sales:7.8, sales1:3.9, sales2:5.2, year:"2006" },
+ { sales:7.2, sales1:3.6, sales2:5.6, year:"2007" },
+ { sales:5.3, sales1:2.9, sales2:4.1, year:"2008" },
+ { sales:4.8, sales1:2.1, sales2:3.9, year:"2009" }
+ ];
+
+ window.onload = function(){
+ var chart1 = new dhtmlXChart({
+ view:"stackedArea",
+ container:"chart",
+ value:"#sales#",
+ color:"#00ccff",
+ alpha:0.6,
+ padding:{
+ left:30
+ },
+ yAxis:{
+
+ },
+ xAxis:{
+ lines:true,
+ title:"sales per year",
+ template:"#year#"
+ },
+ legend:{
+ layout:"x",
+ width: 75,
+ align:"center",
+ valign:"top",
+ marker:{
+ type:"round",
+ width:15
+ },
+ values:[
+ {text:"company A",color:"#00ccff"},
+ {text:"company B",color:"#0000ff"},
+ {text:"company C",color:"#cc33ff"}
+ ]
+ }
+ })
+ chart1.addSeries({
+ value:"#sales1#",
+ color:"#0000ff"
+ })
+ chart1.addSeries({
+ value:"#sales2#",
+ color:"#cc33ff"
+ })
+ chart1.parse(data,"json");
+
+ }
+ </script>
+</head>
+<body >
+ <div id="chart" style="width:470px;height:300px;border:1px solid #A4BED4;"></div></td>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/01_add.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/01_add.html
new file mode 100644
index 00000000000..7a3b45f8cee
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/01_add.html
@@ -0,0 +1,83 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Adding</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ var barChart1;
+
+ window.onload = function(){
+ barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ padding:{
+ top:20,
+ left:0,
+ right:0
+ }
+ });
+ barChart1.parse(data,"json");
+ }
+
+ var counter = 2010;
+ function add_new () {
+ barChart1.add({
+ year:counter,
+ sales:(Math.random()*5).toFixed(2)
+ });
+ counter++;
+ }
+ function delete_first(){
+ barChart1.remove(barChart1.first());
+ }
+ </script>
+</head>
+<body>
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+
+
+ <input type="button" value="add" onclick="add_new()">
+ <input type="button" value="delete" onclick="delete_first()">
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/02_events.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/02_events.html
new file mode 100644
index 00000000000..495d42bf795
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/02_events.html
@@ -0,0 +1,96 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Events</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+ var barChart1;
+ window.onload = function(){
+ barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ padding:{
+ top:20,
+ left:0,
+ right:0
+ }
+ });
+ barChart1.parse(data,"json");
+ barChart1.attachEvent("onMouseMove", function(id){
+ id = barChart1.get(id).year;
+ log("onMouseMove", id);
+ return true;
+ });
+ barChart1.attachEvent("onMouseOut", function(id){
+ log("onMouseOut", id);
+ return true;
+ });
+
+ barChart1.attachEvent("onItemClick", function(id){
+ id = barChart1.get(id).year;
+ log("onItemClick", id);
+ return true;
+ });
+ barChart1.attachEvent("onItemDblClick", function(id){
+ id = barChart1.get(id).year;
+ log("onItemDblClick", id);
+ return true;
+ });
+
+ }
+
+ function log(name, id){
+ var t = document.createElement("DIV");
+ t.innerHTML = name+" for element "+id;
+
+ var p = document.getElementById("log_div");
+ p.insertBefore(t, p.firstChild);
+ }
+
+ </script>
+</head>
+<body>
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+ <div id="log_div" style="widht:950px; height:300px; font-family:Tahoma;overflow:auto"></div>
+
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/03_sorting.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/03_sorting.html
new file mode 100644
index 00000000000..cb8b254fe10
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/03_sorting.html
@@ -0,0 +1,73 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Sorting</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ var barChart1;
+
+ window.onload = function(){
+ barChart1 = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ padding:{
+ top:20,
+ left:0,
+ right:0
+ }
+ });
+ barChart1.parse(data,"json");
+ }
+
+ </script>
+</head>
+<body >
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+
+ <input type="button" value="sort by sales, ASC" onclick="barChart1.sort('#sales#','asc');">
+ <input type="button" value="sort by sales, DESC" onclick="barChart1.sort('#sales#','desc');">
+ <input type="button" value="sort by year, ASC" onclick="barChart1.sort('#year#','asc');">
+ <input type="button" value="sort by year, DESC" onclick="barChart1.sort('#year#','desc');">
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/04_filtering.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/04_filtering.html
new file mode 100644
index 00000000000..230aa820800
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/08_dynamic/04_filtering.html
@@ -0,0 +1,81 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+<head>
+ <title>Filtering</title>
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+ window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart1",
+ value:"#sales#",
+ label:"#sales#",
+ color:"#b3e025",
+ gradient:true,
+ border:false,
+ width:50,
+ tooltip:{
+ template:"#sales#"
+ },
+ xAxis:{
+ title:"Sales per year",
+ template:"#year#"
+ },
+ padding:{
+ top:30,
+ left:0,
+ right:0
+ }
+ });
+ barChart.parse(data,"json");
+ }
+
+ function filter_year(){
+ barChart.filter(function(obj){
+ return obj.year >2005;
+ })
+ }
+ function filter_sales(){
+ barChart.filter(function(obj){
+ return obj.sales < 8;
+ })
+ }
+
+ </script>
+</head>
+<body>
+ <table>
+ <tr>
+ <td><div id="chart1" style="width:750px;height:300px;border:1px solid #A4BED4;"></div></td>
+ </tr>
+ </table>
+
+
+
+ <input type="button" value="show all" onclick="barChart.filter();">
+ <input type="button" value="show year > 2005" onclick="filter_year()">
+ <input type="button" value="show sales < 8" onclick="filter_sales()">
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/01_dhtmlxgrid.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/01_dhtmlxgrid.html
new file mode 100644
index 00000000000..698da15d9fd
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/01_dhtmlxgrid.html
@@ -0,0 +1,70 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+
+<html>
+<head>
+ <title>Integration with grid</title>
+ <link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/dhtmlxgrid.css'>
+ <link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css'>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxcommon.js'></script>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxgrid.js'></script>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxgridcell.js'></script>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var barChart;
+ window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ color:"#66ccff",
+ gradient:"3d",
+ container:"chart_container",
+ value:"#data0#",
+ label:"#data0#",
+ radius:3,
+ tooltip:{
+ template:"#data0#"
+ },
+ width:30,
+ origin:0,
+ yAxis:{},
+ xAxis:{
+ template:function(){return ""}
+ },
+ border:false
+ });
+
+ function refresh_chart(){
+ barChart.clearAll();
+ barChart.parse(mygrid,"dhtmlxgrid");
+ };
+
+ mygrid = new dhtmlXGridObject('gridbox');
+ mygrid.setImagePath('../../../dhtmlxGrid/codebase/imgs/');
+ mygrid.setSkin("dhx_skyblue")
+ mygrid.loadXML("../../../dhtmlxGrid/samples/common/gridH.xml",refresh_chart);
+ mygrid.attachEvent("onEditCell",function(stage){
+ if (stage == 2)
+ refresh_chart();
+ return true;
+ });
+ }
+</script>
+</head>
+
+<body>
+
+ <div id="gridbox" style="width:600px; height:270px; background-color:white;"></div>
+ <hr>
+ <div id="chart_container" style="width:500px;height:300px;"></div>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/02_dhtmlxgrid_group.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/02_dhtmlxgrid_group.html
new file mode 100644
index 00000000000..d911e209922
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/02_dhtmlxgrid_group.html
@@ -0,0 +1,79 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+
+<html>
+<head>
+ <title>Integration with Grid and Grouping</title>
+ <link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/dhtmlxgrid.css'>
+ <link rel='STYLESHEET' type='text/css' href='../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css'>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxcommon.js'></script>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxgrid.js'></script>
+ <script src='../../../dhtmlxGrid/codebase/dhtmlxgridcell.js'></script>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+ <script>
+ var barChart;
+ window.onload = function(){
+ barChart = new dhtmlXChart({
+ view:"bar",
+ container:"chart_container",
+ value:"#sales#",
+ label:"#sales#",
+ sort:{
+ by:"#sales#",
+ as:"int"
+ },
+ group:{
+ by:"#data2#",
+ map:{
+ author:["#data2#"],
+ sales:["#data0#","sum"]
+ }
+ },
+ xAxis:{
+ template:"#author#"
+ },
+ padding:{
+ left:0,
+ right:0
+ },
+ color:"#45abf5",
+ gradient:true,
+ width:50,
+ border:false
+ });
+
+ function refresh_chart(){
+ barChart.clearAll();
+ barChart.parse(mygrid,"dhtmlxgrid");
+ };
+
+ mygrid = new dhtmlXGridObject('gridbox');
+ mygrid.setImagePath('../../../dhtmlxGrid/codebase/imgs/');
+ mygrid.setSkin("dhx_skyblue")
+ mygrid.loadXML("../../../dhtmlxGrid/samples/common/gridH.xml",refresh_chart);
+ mygrid.attachEvent("onEditCell",function(stage){
+ if (stage == 2)
+ refresh_chart();
+ return true;
+ });
+ }
+</script>
+</head>
+
+<body>
+
+ <div id="gridbox" style="width:600px; height:270px; background-color:white;"></div>
+ <hr>
+ <div id="chart_container" style="width:600px;height:300px;"></div>
+
+</body>
+</html>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/03_windows.html b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/03_windows.html
new file mode 100644
index 00000000000..822e621d9ca
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/09_integration/03_windows.html
@@ -0,0 +1,77 @@
+<!--conf
+<sample>
+ <product version="2.6" edition="std"/>
+ <modifications>
+ <modified date="100609"/>
+ </modifications>
+ </sample>
+ -->
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+
+<html>
+<head>
+ <title>Integration with dhtmlxWindows</title>
+
+ <link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/dhtmlxwindows.css">
+ <link rel="stylesheet" type="text/css" href="../../../dhtmlxWindows/codebase/skins/dhtmlxwindows_dhx_skyblue.css">
+
+ <script src="../../../dhtmlxWindows/codebase/dhtmlxcommon.js"></script>
+ <script src="../../../dhtmlxWindows/codebase/dhtmlxwindows.js"></script>
+ <script src="../../../dhtmlxWindows/codebase/dhtmlxcontainer.js"></script>
+
+ <script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
+ <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
+
+</head>
+<style type="text/css" media="screen">
+ html, body{
+ height:100%;
+ padding:0px;
+ margin:0px;
+ }
+</style>
+<body onload="doOnLoad();">
+
+<script>
+ var dhxWins
+ var data = [
+ { sales:"3.0", year:"2000" },
+ { sales:"3.8", year:"2001" },
+ { sales:"3.4", year:"2002" },
+ { sales:"4.1", year:"2003" },
+ { sales:"4.3", year:"2004" },
+ { sales:"9.9", year:"2005" },
+ { sales:"7.4", year:"2006" },
+ { sales:"9.0", year:"2007" },
+ { sales:"7.3", year:"2008" },
+ { sales:"4.8", year:"2009" }
+ ];
+
+
+ function doOnLoad() {
+ dhxWinsParams = {
+ image_path: "../../../dhtmlxWindows/codebase/imgs/",
+ wins: [ {id: "w1", left: 230, top: 230, width: 420, height: 340}]
+ };
+ dhxWins = new dhtmlXWindows(dhxWinsParams);
+ pieChart2 = dhxWins.window("w1").attachChart({
+ view:"pie",
+ value:"#sales#",
+ pieInnerText:"#sales#",
+ gradient:true,
+ details:{
+ width: 75,
+ align:"right",
+ valign:top,
+ marker:{
+ type:"round",
+ width:15
+ },
+ template:"#year#"
+ }
+ });
+
+ pieChart2.parse(data,"json");
+ };
+</script>
+</body> \ No newline at end of file
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/common/config.php b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/config.php
new file mode 100644
index 00000000000..3695ac3905a
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/config.php
@@ -0,0 +1,13 @@
+<?php
+/*
+Copyright DHTMLX LTD. http://www.dhtmlx.com
+This version of Software is free for using in non-commercial applications.
+For commercial use please contact sales@dhtmlx.com to obtain license
+*/
+
+ $mysql_host = "localhost";
+ $mysql_user = "root";
+ $mysql_pasw = "";
+ $mysql_db = "sampledb";
+
+?>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/common/data.php b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/data.php
new file mode 100644
index 00000000000..ac8f5116a9d
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/data.php
@@ -0,0 +1,16 @@
+<?php
+
+$str = "<data>";
+
+for ($i=1; $i <= 100; $i++) {
+ $sales = rand(100,1000);
+ $year = rand(1996,2009);
+ $company = "Company ".rand(1,3);
+ $str.="<item id='{$i}' sales='{$sales}' year='{$year}' company='{$company}'></item>";
+}
+
+$str .= "</data>";
+
+file_put_contents("stat.xml",$str);
+
+?> \ No newline at end of file
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/common/sales.xml b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/sales.xml
new file mode 100644
index 00000000000..03c153cb1e5
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/sales.xml
@@ -0,0 +1,46 @@
+<data>
+ <item id="1">
+ <sales>2.9</sales>
+ <year>2000</year>
+ </item>
+ <item id="2">
+ <sales>3.5</sales>
+ <year>2001</year>
+ </item>
+ <item id="3">
+ <sales>3.1</sales>
+ <year>2002</year>
+ </item>
+ <item id="4">
+ <sales>4.2</sales>
+ <year>2003</year>
+ </item>
+ <item id="5">
+ <sales>4.5</sales>
+ <year>2004</year>
+ </item>
+ <item id="6">
+ <sales>7.4</sales>
+ <year>2005</year>
+ </item>
+ <item id="7">
+ <sales>9.6</sales>
+ <year>2006</year>
+ </item>
+ <item id="8">
+ <sales>9</sales>
+ <year>2007</year>
+ </item>
+ <item id="9">
+ <sales>7.3</sales>
+ <year>2008</year>
+ </item>
+ <item id="10">
+ <sales>5.8</sales>
+ <year>2009</year>
+ </item>
+ <item id="11">
+ <sales>7.7</sales>
+ <year>2010</year>
+ </item>
+</data>
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/common/stat.xml b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/stat.xml
new file mode 100644
index 00000000000..824ff6f6829
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/common/stat.xml
@@ -0,0 +1 @@
+<data><item id='1' sales='262' year='2003' company='Company 3'></item><item id='2' sales='527' year='1998' company='Company 1'></item><item id='3' sales='629' year='2006' company='Company 3'></item><item id='4' sales='403' year='2008' company='Company 2'></item><item id='5' sales='652' year='2005' company='Company 3'></item><item id='6' sales='708' year='2006' company='Company 3'></item><item id='7' sales='377' year='2006' company='Company 2'></item><item id='8' sales='714' year='2004' company='Company 3'></item><item id='9' sales='385' year='2000' company='Company 3'></item><item id='10' sales='113' year='2002' company='Company 3'></item><item id='11' sales='215' year='2004' company='Company 2'></item><item id='12' sales='149' year='2003' company='Company 1'></item><item id='13' sales='391' year='1996' company='Company 3'></item><item id='14' sales='234' year='2006' company='Company 2'></item><item id='15' sales='847' year='2003' company='Company 3'></item><item id='16' sales='878' year='2008' company='Company 1'></item><item id='17' sales='248' year='2004' company='Company 2'></item><item id='18' sales='311' year='2007' company='Company 1'></item><item id='19' sales='724' year='1996' company='Company 1'></item><item id='20' sales='113' year='2003' company='Company 3'></item><item id='21' sales='884' year='2003' company='Company 1'></item><item id='22' sales='936' year='1996' company='Company 2'></item><item id='23' sales='550' year='2001' company='Company 3'></item><item id='24' sales='923' year='2006' company='Company 2'></item><item id='25' sales='977' year='2005' company='Company 1'></item><item id='26' sales='446' year='2002' company='Company 3'></item><item id='27' sales='578' year='1999' company='Company 3'></item><item id='28' sales='521' year='1999' company='Company 2'></item><item id='29' sales='554' year='2002' company='Company 1'></item><item id='30' sales='335' year='2005' company='Company 2'></item><item id='31' sales='612' year='2006' company='Company 3'></item><item id='32' sales='173' year='2000' company='Company 1'></item><item id='33' sales='995' year='2005' company='Company 3'></item><item id='34' sales='743' year='2006' company='Company 2'></item><item id='35' sales='904' year='2003' company='Company 2'></item><item id='36' sales='696' year='2007' company='Company 1'></item><item id='37' sales='526' year='2008' company='Company 2'></item><item id='38' sales='459' year='1997' company='Company 1'></item><item id='39' sales='357' year='2007' company='Company 2'></item><item id='40' sales='655' year='2009' company='Company 2'></item><item id='41' sales='527' year='2009' company='Company 3'></item><item id='42' sales='526' year='2008' company='Company 2'></item><item id='43' sales='125' year='1998' company='Company 2'></item><item id='44' sales='865' year='2003' company='Company 3'></item><item id='45' sales='125' year='2000' company='Company 2'></item><item id='46' sales='633' year='2002' company='Company 2'></item><item id='47' sales='911' year='2006' company='Company 3'></item><item id='48' sales='791' year='2008' company='Company 2'></item><item id='49' sales='700' year='2006' company='Company 3'></item><item id='50' sales='921' year='1996' company='Company 3'></item><item id='51' sales='267' year='2000' company='Company 2'></item><item id='52' sales='350' year='2005' company='Company 1'></item><item id='53' sales='477' year='2006' company='Company 1'></item><item id='54' sales='180' year='1997' company='Company 3'></item><item id='55' sales='699' year='2008' company='Company 3'></item><item id='56' sales='808' year='2000' company='Company 2'></item><item id='57' sales='837' year='1999' company='Company 2'></item><item id='58' sales='352' year='2004' company='Company 2'></item><item id='59' sales='656' year='1999' company='Company 2'></item><item id='60' sales='279' year='2002' company='Company 3'></item><item id='61' sales='907' year='2004' company='Company 3'></item><item id='62' sales='227' year='1997' company='Company 2'></item><item id='63' sales='845' year='2002' company='Company 2'></item><item id='64' sales='931' year='2003' company='Company 3'></item><item id='65' sales='264' year='2006' company='Company 1'></item><item id='66' sales='846' year='2005' company='Company 1'></item><item id='67' sales='616' year='1999' company='Company 2'></item><item id='68' sales='877' year='1998' company='Company 2'></item><item id='69' sales='738' year='1997' company='Company 3'></item><item id='70' sales='999' year='2008' company='Company 2'></item><item id='71' sales='674' year='2006' company='Company 1'></item><item id='72' sales='483' year='2006' company='Company 3'></item><item id='73' sales='105' year='2002' company='Company 1'></item><item id='74' sales='826' year='2005' company='Company 3'></item><item id='75' sales='372' year='2004' company='Company 2'></item><item id='76' sales='566' year='2009' company='Company 2'></item><item id='77' sales='196' year='2001' company='Company 1'></item><item id='78' sales='919' year='2004' company='Company 2'></item><item id='79' sales='412' year='2008' company='Company 1'></item><item id='80' sales='591' year='1999' company='Company 2'></item><item id='81' sales='588' year='2006' company='Company 1'></item><item id='82' sales='517' year='2005' company='Company 1'></item><item id='83' sales='149' year='2002' company='Company 1'></item><item id='84' sales='474' year='1998' company='Company 1'></item><item id='85' sales='408' year='2008' company='Company 2'></item><item id='86' sales='212' year='2003' company='Company 1'></item><item id='87' sales='284' year='1999' company='Company 3'></item><item id='88' sales='580' year='1999' company='Company 2'></item><item id='89' sales='134' year='2005' company='Company 3'></item><item id='90' sales='145' year='1997' company='Company 3'></item><item id='91' sales='172' year='1997' company='Company 2'></item><item id='92' sales='825' year='1997' company='Company 1'></item><item id='93' sales='696' year='2005' company='Company 3'></item><item id='94' sales='907' year='2008' company='Company 1'></item><item id='95' sales='515' year='1996' company='Company 2'></item><item id='96' sales='675' year='1996' company='Company 2'></item><item id='97' sales='771' year='2005' company='Company 3'></item><item id='98' sales='836' year='1996' company='Company 2'></item><item id='99' sales='666' year='2007' company='Company 3'></item><item id='100' sales='944' year='2007' company='Company 1'></item></data> \ No newline at end of file
diff --git a/addons/base_graph/static/lib/dhtmlxGraph/samples/readme.txt b/addons/base_graph/static/lib/dhtmlxGraph/samples/readme.txt
new file mode 100644
index 00000000000..c1f4b60567c
--- /dev/null
+++ b/addons/base_graph/static/lib/dhtmlxGraph/samples/readme.txt
@@ -0,0 +1,7 @@
+Next samples
+ 08_integration\01_dhtmlxgrid.html
+ 08_integration\02_dhtmlxgrid_group.html
+ 08_integration\03_layout.html
+requires external components ( dhtmlxgrid and dhtmlxwindow )
+
+Its recommended to run samples through any kind of webserver.