dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #15085
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 5310: Visualizer plugin updated. Work in progress.
Merge authors:
Jan Henrik Øverland (janhenrik-overland)
------------------------------------------------------------
revno: 5310 [merge]
committer: Jan Henrik Overland <janhenrik.overland@xxxxxxxxx>
branch nick: dhis2
timestamp: Tue 2011-12-06 17:13:42 +0100
message:
Visualizer plugin updated. Work in progress.
modified:
dhis-2/dhis-web/dhis-web-visualizer/src/main/java/org/hisp/dhis/visualizer/action/GetAggregatedDataValuesPluginAction.java
dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/app.js
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/java/org/hisp/dhis/visualizer/action/GetAggregatedDataValuesPluginAction.java'
--- dhis-2/dhis-web/dhis-web-visualizer/src/main/java/org/hisp/dhis/visualizer/action/GetAggregatedDataValuesPluginAction.java 2011-12-01 20:07:31 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/java/org/hisp/dhis/visualizer/action/GetAggregatedDataValuesPluginAction.java 2011-12-06 15:57:32 +0000
@@ -104,65 +104,65 @@
this.organisationUnitIds = organisationUnitIds;
}
- private Boolean lastMonth;
+ private boolean lastMonth;
- public void setLastMonth( Boolean lastMonth )
+ public void setLastMonth( boolean lastMonth )
{
this.lastMonth = lastMonth;
}
- private Boolean monthsThisYear;
+ private boolean monthsThisYear;
- public void setMonthsThisYear( Boolean monthsThisYear )
+ public void setMonthsThisYear( boolean monthsThisYear )
{
this.monthsThisYear = monthsThisYear;
}
- private Boolean monthsLastYear;
+ private boolean monthsLastYear;
- public void setMonthsLastYear( Boolean monthsLastYear )
+ public void setMonthsLastYear( boolean monthsLastYear )
{
this.monthsLastYear = monthsLastYear;
}
- private Boolean lastQuarter;
+ private boolean lastQuarter;
- public void setLastQuarter( Boolean lastQuarter )
+ public void setLastQuarter( boolean lastQuarter )
{
this.lastQuarter = lastQuarter;
}
- private Boolean quartersThisYear;
+ private boolean quartersThisYear;
- public void setQuartersThisYear( Boolean quartersThisYear )
+ public void setQuartersThisYear( boolean quartersThisYear )
{
this.quartersThisYear = quartersThisYear;
}
- private Boolean quartersLastYear;
+ private boolean quartersLastYear;
- public void setQuartersLastYear( Boolean quartersLastYear )
+ public void setQuartersLastYear( boolean quartersLastYear )
{
this.quartersLastYear = quartersLastYear;
}
- private Boolean thisYear;
+ private boolean thisYear;
- public void setThisYear( Boolean thisYear )
+ public void setThisYear( boolean thisYear )
{
this.thisYear = thisYear;
}
- private Boolean lastYear;
+ private boolean lastYear;
- public void setLastYear( Boolean lastYear )
+ public void setLastYear( boolean lastYear )
{
this.lastYear = lastYear;
}
- private Boolean lastFiveYears;
+ private boolean lastFiveYears;
- public void setLastFiveYears( Boolean lastFiveYears )
+ public void setLastFiveYears( boolean lastFiveYears )
{
this.lastFiveYears = lastFiveYears;
}
=== modified file 'dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/app.js'
--- dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/app.js 2011-12-06 12:06:06 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/app.js 2011-12-06 15:57:32 +0000
@@ -871,7 +871,7 @@
type: 'Numeric',
position: 'bottom',
minimum: 0,
- fields: DV.store.chart.bottom,
+ fields: DV.store.chart.bottom,
label: DV.util.chart.label.getNumericLabel(),
grid: {
even: DV.util.chart.getGrid()
=== 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-15 10:30:52 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/css/plugin.css 2011-12-06 16:07:41 +0000
@@ -8,9 +8,9 @@
}
#chart1 {
- width: 1400px;
+ width: 600px;
height: 400px;
- border: 2px solid #ccc;
+ border: 2px solid #ddd;
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-15 10:30:52 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.html 2011-12-06 16:07:41 +0000
@@ -11,12 +11,6 @@
<h1>My chart 1</h1>
<div id="chart1"></div>
-
- <h1>My chart 2</h1>
- <div id="chart2"></div>
-
- <h1>My chart 3</h1>
- <div id="chart3"></div>
<script>
Ext.onReady( function() {
@@ -42,32 +36,11 @@
*/
DHIS.getChart({
- stacked: true,
- indicators: [52486, 52487, 52488],
- organisationunits: [525],
+ indicators: [31664],
+ organisationunits: [18],
el: 'chart1',
url: url
});
-
- DHIS.getChart({
- type: 'line',
- indicators: [52486, 52487],
- organisationunits: [525],
- el: 'chart2',
- url: url
- });
-
- DHIS.getChart({
- type: 'area',
- indicators: [52486, 52487, 52488, 52491, 52496, 52497],
- organisationunits: [525],
- el: 'chart3',
- width: 1300,
- height: 600,
- legendPosition: 'right',
- url: url
- });
-
});
</script>
=== 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-15 10:30:52 +0000
+++ dhis-2/dhis-web/dhis-web-visualizer/src/main/webapp/dhis-web-visualizer/app/plugin/plugin.js 2011-12-06 16:07:41 +0000
@@ -71,8 +71,8 @@
dataelement: {
getUrl: function(isFilter) {
var a = [];
- DHIS.state.state.conf.dataelements.each( function(r) {
- a.push('dataElementIds=' + r.data.id);
+ Ext.Array.each(DHIS.state.state.conf.dataelements, function(r) {
+ a.push('dataElementIds=' + r);
});
return (isFilter && a.length > 1) ? a.slice(0,1) : a;
}
@@ -97,17 +97,14 @@
}
},
chart: {
- getEncodedSeriesName: function(text) {
- return text.replace(/\./g,'');q
- },
- getLegend: function() {
- var lp = DHIS.state.state.conf.legendPosition,
- l = DHIS.state.state.series.data.length,
- p = lp ? lp : (l > 5 ? 'right' : 'top');
+ getLegend: function(len) {
+ len = len ? len : 1;
return {
- position: p,
+ position: len > 5 ? 'right' : 'top',
+ labelFont: '11px arial',
boxStroke: '#ffffff',
- boxStrokeWidth: 0
+ boxStrokeWidth: 0,
+ padding: 0
};
},
getGrid: function() {
@@ -118,6 +115,56 @@
'stroke-width': 0.2
};
},
+ getTitle: function() {
+ return {
+ type: 'text',
+ text: DHIS.state.state.filter.names[0],
+ font: 'bold 13px arial',
+ fill: '#222',
+ width: 300,
+ height: 20,
+ x: 28,
+ y: 16
+ };
+ },
+ getTips: function() {
+ return {
+ trackMouse: true,
+ height: 31,
+ renderer: function(item) {
+ }
+ };
+ },
+ setMask: function(str) {
+ if (DHIS.mask) {
+ DHIS.mask.hide();
+ }
+ DHIS.mask = new Ext.LoadMask(DHIS.chart.chart, {msg: str});
+ DHIS.mask.show();
+ },
+ label: {
+ getCategoryLabel: function() {
+ return {
+ font: '11px arial',
+ rotate: {
+ degrees: 320
+ }
+ };
+ },
+ getNumericLabel: function(values) {
+ return {
+ font: '11px arial',
+ renderer: Ext.util.Format.numberRenderer(DHIS.util.number.getChartAxisFormatRenderer(values))
+ };
+ }
+ },
+ bar: {
+ getCategoryLabel: function() {
+ return {
+ font: '11px arial'
+ };
+ }
+ },
line: {
getSeriesArray: function(project) {
var a = [];
@@ -131,6 +178,42 @@
}
return a;
}
+ },
+ pie: {
+ getTitle: function(title, subtitle) {
+ return [
+ {
+ type: 'text',
+ text: title,
+ font: 'bold 13px arial',
+ fill: '#222',
+ width: 300,
+ height: 20,
+ x: 28,
+ y: 16
+ },
+ {
+ type: 'text',
+ text: subtitle,
+ font: 'bold 11px arial',
+ fill: '#777',
+ width: 300,
+ height: 20,
+ x: 28,
+ y: 36
+ }
+ ];
+ },
+ getTips: function() {
+ return {
+ trackMouse: true,
+ height: 47,
+ renderer: function(item) {
+ this.setWidth((item.data.x.length * 8) + 15);
+ this.setTitle('<span class="dv-chart-tips">' + item.data.x + '<br/><b>' + item.data[DV.store.chart.left[0]] + '</b></span>');
+ }
+ };
+ }
}
},
number: {
@@ -155,6 +238,9 @@
}
},
string: {
+ getEncodedString: function(text) {
+ return text.replace(/[^a-zA-Z 0-9(){}<>_!+;:?*&%#-]+/g,'');
+ },
extendUrl: function(url) {
if (url.charAt(url.length-1) !== '/') {
url += '/';
@@ -209,15 +295,15 @@
type: null,
series: {
dimension: null,
- data: []
+ names: []
},
category: {
dimension: null,
- data: []
+ names: []
},
filter: {
dimension: null,
- data: []
+ names: []
},
getIndiment: function() {
var i = DHIS.conf.finals.dimension.indicator.value;
@@ -284,7 +370,7 @@
project.values = Ext.JSON.decode(r.responseText).values;
if (!project.values.length) {
- alert('no data values');
+ alert('No data values');
return;
}
@@ -293,10 +379,10 @@
item.dataelement = item.in;
item.period = item.pn;
item.organisationunit = item.on;
-
- Ext.Array.include(project.state.series.data, item[project.state.series.dimension]);
- Ext.Array.include(project.state.category.data, item[project.state.category.dimension]);
- Ext.Array.include(project.state.filter.data, item[project.state.filter.dimension]);
+
+ Ext.Array.include(project.state.series.names, DHIS.util.string.getEncodedString(item[project.state.series.dimension]));
+ Ext.Array.include(project.state.category.names, DHIS.util.string.getEncodedString(item[project.state.category.dimension]));
+ Ext.Array.include(project.state.filter.names, DHIS.util.string.getEncodedString(item[project.state.filter.dimension]));
item.v = parseFloat(item.v);
});
@@ -312,16 +398,16 @@
getData: function(project) {
project.data = [];
- Ext.Array.each(project.state.category.data, function(item) {
+ Ext.Array.each(project.state.category.names, function(item) {
var obj = {};
obj[DHIS.conf.finals.chart.x] = item;
project.data.push(obj);
});
Ext.Array.each(project.data, function(item) {
- for (var i = 0; i < project.state.series.data.length; i++) {
+ for (var i = 0; i < project.state.series.names.length; i++) {
for (var j = 0; j < project.values.length; j++) {
- if (project.values[j][project.state.category.dimension] === item[DHIS.conf.finals.chart.x] && project.values[j][project.state.series.dimension] === project.state.series.data[i]) {
+ if (project.values[j][project.state.category.dimension] === item[DHIS.conf.finals.chart.x] && project.values[j][project.state.series.dimension] === project.state.series.names[i]) {
item[project.values[j][project.state.series.dimension]] = project.values[j].v;
break;
}
@@ -344,26 +430,24 @@
height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
- legend: DHIS.util.chart.getLegend(),
+ items: DHIS.util.chart.getTitle(),
+ legend: DHIS.util.chart.getLegend(project.store.left.length),
axes: [
{
- title: 'Value',
type: 'Numeric',
position: 'left',
minimum: 0,
fields: project.store.left,
+ label: DHIS.util.chart.label.getNumericLabel(project.values),
grid: {
even: DHIS.util.chart.getGrid()
- },
- label: {
- renderer: Ext.util.Format.numberRenderer(DHIS.util.number.getChartAxisFormatRenderer(project.values))
}
},
{
- title: DHIS.conf.finals.dimension[project.state.category.dimension].rawvalue,
type: 'Category',
position: 'bottom',
- fields: project.store.bottom
+ fields: project.store.bottom,
+ label: DHIS.util.chart.label.getCategoryLabel()
}
],
series: [
@@ -389,23 +473,21 @@
height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
- legend: DHIS.util.chart.getLegend(),
+ items: DHIS.util.chart.getTitle(),
+ legend: DHIS.util.chart.getLegend(project.store.chart.bottom.length),
axes: [
{
- title: DHIS.conf.finals.dimension[project.state.category.dimension].rawvalue,
type: 'Category',
position: 'left',
- fields: project.store.left
+ fields: project.store.left,
+ label: DHIS.util.chart.bar.getCategoryLabel()
},
{
- title: 'Value',
type: 'Numeric',
position: 'bottom',
minimum: 0,
fields: project.store.bottom,
- label: {
- renderer: Ext.util.Format.numberRenderer(DHIS.util.number.getChartAxisFormatRenderer(project.values))
- },
+ label: DHIS.util.chart.label.getNumericLabel(project.values),
grid: {
even: DHIS.util.chart.getGrid()
}
@@ -434,26 +516,24 @@
height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
- legend: DHIS.util.chart.getLegend(),
+ items: DHIS.util.chart.getTitle(),
+ legend: DHIS.util.chart.getLegend(project.store.chart.left.length),
axes: [
{
- title: 'Value',
type: 'Numeric',
position: 'left',
minimum: 0,
fields: project.store.left,
- label: {
- renderer: Ext.util.Format.numberRenderer(DHIS.util.number.getChartAxisFormatRenderer(project.values))
- },
+ label: DHIS.util.chart.label.getNumericLabel(project.values),
grid: {
even: DHIS.util.chart.getGrid()
}
},
{
- title: DHIS.conf.finals.dimension[project.state.category.dimension].rawvalue,
type: 'Category',
position: 'bottom',
- fields: project.store.bottom
+ fields: project.store.bottom,
+ label: DV.util.chart.label.getCategoryLabel()
}
],
series: DHIS.util.chart.line.getSeriesArray(project)
@@ -468,26 +548,24 @@
height: project.state.conf.height || this.el.getHeight(),
animate: true,
store: project.store,
- legend: DHIS.util.chart.getLegend(),
+ items: DHIS.util.chart.getTitle(),
+ legend: DHIS.util.chart.getLegend(project.store.chart.left.length),
axes: [
{
- title: 'Value',
type: 'Numeric',
position: 'left',
minimum: 0,
fields: project.store.left,
- label: {
- renderer: Ext.util.Format.numberRenderer(DHIS.util.number.getChartAxisFormatRenderer(project.values))
- },
+ label: DHIS.util.chart.label.getNumericLabel(project.values),
grid: {
even: DHIS.util.chart.getGrid()
}
},
{
- title: DHIS.conf.finals.dimension[project.state.category.dimension].rawvalue,
type: 'Category',
position: 'bottom',
- fields: project.store.bottom
+ fields: project.store.bottom,
+ label: DHIS.util.chart.label.getCategoryLabel()
}
],
series: [{
@@ -511,20 +589,14 @@
animate: true,
shadow: true,
store: project.store,
- legend: DHIS.util.chart.getLegend(),
insetPadding: 60,
+ items: DHIS.util.chart.pie.getTitle(project.state.state.filter.names[0], project.store.left[0]),
+ legend: DHIS.util.chart.getLegend(project.state.state.category.names.length),
series: [{
type: 'pie',
field: project.store.left[0],
showInLegend: true,
- tips: {
- trackMouse: false,
- width: 160,
- height: 31,
- renderer: function(i) {
- this.setTitle('<span class="DHIS-chart-tips">' + i.data.x + ': <b>' + i.data[project.store.left[0]] + '</b></span>');
- }
- },
+ tips: DHIS.util.chart.pie.getTips(),
label: {
field: project.store.bottom[0]
},
