dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #14858
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 5164: Visualizer plugin example updated.
Merge authors:
Jan Henrik Øverland (janhenrik-overland)
------------------------------------------------------------
revno: 5164 [merge]
committer: Jan Henrik Overland <janhenrik.overland@xxxxxxxxx>
branch nick: dhis2
timestamp: Tue 2011-11-15 10:34:18 +0000
message:
Visualizer plugin example updated.
modified:
dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/css/plugin.css
dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.html
dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.js
--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk
Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/css/plugin.css'
--- dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/css/plugin.css 2011-11-12 14:36:30 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/css/plugin.css 2011-11-15 10:30:52 +0000
@@ -8,22 +8,23 @@
}
#chart1 {
- height: 250px;
width: 1400px;
+ height: 400px;
border: 2px solid #ccc;
margin-bottom: 100px;
}
#chart2 {
- height: 250px;
width: 1400px;
+ height: 400px;
border: 2px solid #ccc;
margin-bottom: 100px;
}
#chart3 {
- height: 250px;
width: 1400px;
+ height: 700px;
+ padding: 50px;
border: 2px solid #ccc;
margin-bottom: 100px;
}
=== modified file 'dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.html'
--- dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.html 2011-11-12 14:36:30 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.html 2011-11-15 10:30:52 +0000
@@ -21,40 +21,50 @@
<script>
Ext.onReady( function() {
var url = 'http://localhost:8180/dhis/dhis-web-visualizer/app';
+
+/*
+CONFIG TYPE DEFAULT DESCRIPTION
+
+type string 'column' (Optional) Chart types: 'column', 'bar', 'line', 'area', 'pie'
+stacked boolean false (Optional) Works for 'column' and 'bar'. Otherwise ignored.
+indicators [integer] (Required*) Indicator ids. Required if no data elements are provided.
+dataelements [integer] (Required*) Data element ids. Required if no indicators are provided.
+periods [string] 'monthsThisYear' (Optional) Relative period names.
+organisationunits [integer] (Required) Organisation unit ids.
+series string 'indicator' (Optional) Series: 'indicator', 'dataelement', 'period' or 'organisationunit'
+category string 'period' (Optional) Category: 'indicator', 'dataelement', 'period' or 'organisationunit'
+filter string 'organisationunit' (Optional) Filter: 'indicator', 'dataelement', 'period' or 'organisationunit'
+el string (Required) The element to render the chart.
+width integer <el width> (Optional) Chart width. Default is the element width.
+height integer <el height> (Optional) Chart height. Default is the element height.
+legendPosition string 'top' (Optional) Positions: 'top', 'right', 'bottom' or 'left'
+url string (Required) The web service url.
+*/
DHIS.getChart({
- type: 'column',
+ stacked: true,
indicators: [52486, 52487, 52488],
- periods: ['monthsThisYear'],
organisationunits: [525],
- series: 'indicator',
- category: 'period',
- filter: 'organisationunit',
- div: 'chart1',
+ el: 'chart1',
url: url
});
DHIS.getChart({
type: 'line',
- indicators: [52486, 52487, 52488],
- periods: ['monthsThisYear'],
+ indicators: [52486, 52487],
organisationunits: [525],
- series: 'indicator',
- category: 'period',
- filter: 'organisationunit',
- div: 'chart2',
+ el: 'chart2',
url: url
});
DHIS.getChart({
type: 'area',
- indicators: [52486, 52487, 52488],
- periods: ['monthsThisYear'],
+ indicators: [52486, 52487, 52488, 52491, 52496, 52497],
organisationunits: [525],
- series: 'indicator',
- category: 'period',
- filter: 'organisationunit',
- div: 'chart3',
+ el: 'chart3',
+ width: 1300,
+ height: 600,
+ legendPosition: 'right',
url: url
});
=== modified file 'dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.js'
--- dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.js 2011-11-12 14:36:30 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.js 2011-11-15 10:30:52 +0000
@@ -240,7 +240,7 @@
series: 'indicator',
category: 'period',
filter: 'organisationunit',
- div: '',
+ el: '',
legendPosition: false,
url: ''
};
@@ -333,15 +333,15 @@
},
el: null,
getChart: function(project) {
- this.el = Ext.get(project.state.conf.div);
+ this.el = Ext.get(project.state.conf.el);
this[project.state.type](project);
DHIS.exe.execute();
},
column: function(project) {
project.chart = Ext.create('Ext.chart.Chart', {
- renderTo: project.state.conf.div,
- width: this.el.getWidth(),
- height: this.el.getHeight(),
+ renderTo: project.state.conf.el,
+ width: project.state.conf.width || this.el.getWidth(),
+ height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
legend: DHIS.util.chart.getLegend(),
@@ -384,9 +384,9 @@
},
bar: function(project) {
project.chart = Ext.create('Ext.chart.Chart', {
- renderTo: project.state.conf.div,
- width: this.el.getWidth(),
- height: this.el.getHeight(),
+ renderTo: project.state.conf.el,
+ width: project.state.conf.width || this.el.getWidth(),
+ height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
legend: DHIS.util.chart.getLegend(),
@@ -429,9 +429,9 @@
},
line: function(project) {
project.chart = Ext.create('Ext.chart.Chart', {
- renderTo: project.state.conf.div,
- width: this.el.getWidth(),
- height: this.el.getHeight(),
+ renderTo: project.state.conf.el,
+ width: project.state.conf.width || this.el.getWidth(),
+ height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
legend: DHIS.util.chart.getLegend(),
@@ -463,9 +463,9 @@
},
area: function(project) {
project.chart = Ext.create('Ext.chart.Chart', {
- renderTo: project.state.conf.div,
- width: this.el.getWidth(),
- height: this.el.getHeight(),
+ renderTo: project.state.conf.el,
+ width: project.state.conf.width || this.el.getWidth(),
+ height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
legend: DHIS.util.chart.getLegend(),
@@ -505,9 +505,9 @@
},
pie: function(project) {
project.chart = Ext.create('Ext.chart.Chart', {
- renderTo: project.state.conf.div,
- width: this.el.getWidth(),
- height: this.el.getHeight(),
+ renderTo: project.state.conf.el,
+ width: project.state.conf.width || this.el.getWidth(),
+ height: project.state.conf.height || this.el.getHeight(),
animate: true,
shadow: true,
store: project.store,
