dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #30423
[Branch ~dhis2-documenters/dhis2/dhis2-docbook-docs] Rev 1086: Plugin docs updated.
------------------------------------------------------------
revno: 1086
committer: Jan Henrik Overland <janhenrik.overland@xxxxxxxxx>
branch nick: dhis2-docbook-docs
timestamp: Wed 2014-05-28 11:19:08 +0200
message:
Plugin docs updated.
modified:
src/docbkx/en/dhis2_user_man_web_api.xml
--
lp:~dhis2-documenters/dhis2/dhis2-docbook-docs
https://code.launchpad.net/~dhis2-documenters/dhis2/dhis2-docbook-docs
Your team DHIS 2 developers is subscribed to branch lp:~dhis2-documenters/dhis2/dhis2-docbook-docs.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-documenters/dhis2/dhis2-docbook-docs/+edit-subscription
=== modified file 'src/docbkx/en/dhis2_user_man_web_api.xml'
--- src/docbkx/en/dhis2_user_man_web_api.xml 2014-05-28 08:29:53 +0000
+++ src/docbkx/en/dhis2_user_man_web_api.xml 2014-05-28 09:19:08 +0000
@@ -1863,7 +1863,7 @@
<section><title>Plugins</title>
<para>DHIS 2 comes with plugins which enables you to embed live data directly in your web portal or web site. Currently, plugins exist for charts, maps and pivot tables.</para>
<section>
- <title>Embedding pivot tables with the Pivot table plug-in</title>
+ <title>Embedding pivot tables with the Pivot Table plug-in</title>
<para>In this example we will see how we can embed good-looking, light-weight html pivot tables with data served from a DHIS back-end into a Web page. To accomplish this we will use the Pivot table plug-in. The plug-in is written in Javascript and depends on the Ext JS library only. A complete working example can be found at <ulink url="http://apps.dhis2.org/portal/table.html"/>. Open the page in a web browser and view the source to see how it is set up.</para>
@@ -1871,9 +1871,9 @@
<screen><!DOCTYPE html>
<html>
<head>
- <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v214/ext/resources/css/ext-plugin-gray.css" />
- <script src="http://dhis2-cdn.org/v214/ext/ext-all.js"></script>
- <script src="http://dhis2-cdn.org/v214/plugin/table.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+ <script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
+ <script src="http://dhis2-cdn.org/v215/plugin/table.js"></script>
<script>
var base = "http://apps.dhis2.org/demo";
@@ -1891,15 +1891,15 @@
function setLinks() {
- // Referring to an existing table through the id parameter, render to "tableA1" div
+ // Referring to an existing table through the id parameter, render to "table1" div
- DHIS.getTable({ url: base, el: "tableA1", id: "R0DVGvXDUNP" });
+ DHIS.getTable({ url: base, el: "table1", id: "R0DVGvXDUNP" });
- // Full table configuration, render to "tableB1" div
+ // Full table configuration, render to "table2" div
DHIS.getTable({
url: base,
- el: "tableB1",
+ el: "table2",
columns: [
{dimension: "de", items: [{id: "YtbsuPPo010"}, {id: "l6byfWFUGaP"}]}
],
@@ -1924,8 +1924,8 @@
</head>
<body>
- <div id="tableA1"></div>
- <div id="tableB1"></div>
+ <div id="table1"></div>
+ <div id="table2"></div>
</body>
</html></screen>
</para>
@@ -1934,9 +1934,9 @@
two files are the Ext JS javascript library (we use the DHIS 2 content delivery network in
this case) and its css stylesheet. The third file is the Pivot table plug-in. Make sure the
path is pointing to your DHIS server installation.</para>
- <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v214/ext/resources/css/ext-plugin-gray.css" />
-<script src="http://dhis2-cdn.org/v214/ext/ext-all.js"></script>
-<script src="http://dhis2-cdn.org/v214/plugin/table.js"></script></screen>
+ <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+<script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
+<script src="http://dhis2-cdn.org/v215/plugin/table.js"></script></screen>
<para>To authenticate with the DHIS server we use the same approach as in the previous section. In the header of the HTML document we include the following Javascript inside a script element. The <emphasis role="italic">setLinks</emphasis> method will be implemented later. Make sure the <emphasis role="italic">base</emphasis> variable is pointing to your DHIS installation.</para>
<screen>var base = "http://apps.dhis2.org/demo/";
@@ -2079,11 +2079,11 @@
</table>
<para>We continue by adding one pre-defined and one dynamic pivot table to our HTML document. You can browse the list of available pivot tables using the Web API here: <ulink url="http://apps.dhis2.org/demo/api/reportTables"/>.</para>
<screen>function setLinks() {
- DHIS.getTable({ url: base, el: "tableA1", id: "R0DVGvXDUNP" });
+ DHIS.getTable({ url: base, el: "table1", id: "R0DVGvXDUNP" });
DHIS.getTable({
url: base,
- el: "tableB1",
+ el: "table2",
columns: [
{dimension: "de", items: [{id: "YtbsuPPo010"}, {id: "l6byfWFUGaP"}]}
],
@@ -2105,8 +2105,8 @@
});
}</screen>
<para>Finally we include some <emphasis role="italic">div</emphasis> elements in the body section of the HTML document with the identifiers referred to in the plug-in Javascript.</para>
- <screen><div id="tableA1"></div>
-<div id="tableB1"></div></screen>
+ <screen><div id="table1"></div>
+<div id="table2"></div></screen>
<para>To see a complete working example please visit <ulink url="http://apps.dhis2.org/portal/table.html"/>.</para>
</section>
<section>
@@ -2117,9 +2117,9 @@
<screen><!DOCTYPE html>
<html>
<head>
- <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v214/ext/resources/css/ext-plugin-gray.css" />
- <script src="http://dhis2-cdn.org/v214/ext/ext-all.js"></script>
- <script src="http://dhis2-cdn.org/v214/plugin/chart.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+ <script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
+ <script src="http://dhis2-cdn.org/v215/plugin/chart.js"></script>
<script>
var base = "http://apps.dhis2.org/demo";
@@ -2137,15 +2137,15 @@
function setLinks() {
- // Referring to an existing chart through the id parameter, render to "chartA1" div
+ // Referring to an existing chart through the id parameter, render to "chart1" div
- DHIS.getChart({ url: base, el: "chartA1", id: "R0DVGvXDUNP" });
+ DHIS.getChart({ url: base, el: "chart1", id: "R0DVGvXDUNP" });
- // Full chart configuration, render to "chartB1" div
+ // Full chart configuration, render to "chart2" div
DHIS.getChart({
url: base,
- el: "chartB1",
+ el: "chart2",
type: "stackedBar",
columns: [ // Chart series
{dimension: "de", items: [{id: "YtbsuPPo010"}, {id: "l6byfWFUGaP"}]}
@@ -2171,8 +2171,8 @@
</head>
<body>
- <div id="chartA1"></div>
- <div id="chartB1"></div>
+ <div id="chart1"></div>
+ <div id="chart2"></div>
</body>
</html></screen>
</para>
@@ -2181,9 +2181,9 @@
two files are the Ext JS javascript library (we use the DHIS 2 content delivery network in
this case) and its stylesheet. The third file is the Visualizer plug-in. Make sure the path
is pointing to your DHIS server installation.</para>
- <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v213/ext/resources/css/ext-plugin-gray.css" />
-<script src="http://dhis2-cdn.org/v213/ext/ext-all.js"></script>
-<script src="http://dhis2-cdn.org/v213/plugin/chart.js"></script></screen>
+ <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+<script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
+<script src="http://dhis2-cdn.org/v215/plugin/chart.js"></script></screen>
<para>To authenticate with the DHIS server we use the same approach as in the previous section. In the header of the HTML document we include the following Javascript inside a script element. The <emphasis role="italic">setLinks</emphasis> method will be implemented later. Make sure the <emphasis role="italic">base</emphasis> variable is pointing to your DHIS installation.</para>
<screen>var base = "http://apps.dhis2.org/demo/";
@@ -2361,11 +2361,11 @@
</table>
<para>We continue by including two pre-defined charts and to dynamic charts to our HTML document. You can browse the list of available charts using the Web API here: <ulink url="http://apps.dhis2.org/demo/api/charts"/>.</para>
<screen>function setLinks() {
- DHIS.getChart({ url: base, el: "chartA1", id: "R0DVGvXDUNP" });
+ DHIS.getChart({ url: base, el: "chart1", id: "R0DVGvXDUNP" });
DHIS.getChart({
url: base,
- el: "chartB1",
+ el: "chart2",
type: "stackedBar",
columns: [ // Chart series
{dimension: "de", items: [{id: "YtbsuPPo010"}, {id: "l6byfWFUGaP"}]}
@@ -2388,8 +2388,8 @@
});
}</screen>
<para>Finally we include some <emphasis role="italic">div</emphasis> elements in the body section of the HTML document with the identifiers referred to in the plug-in Javascript.</para>
- <screen><div id="chartA1"></div>
-<div id="chartB1"></div>
+ <screen><div id="chart1"></div>
+<div id="chart2"></div>
</screen>
<para>To see a complete working example please visit <ulink url="http://apps.dhis2.org/portal/chart.html"/>.</para>
</section>
@@ -2401,11 +2401,11 @@
<screen><!DOCTYPE html>
<html>
<head>
- <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v214/ext/resources/css/ext-plugin-gray.css" />
- <script src="http://dhis2-cdn.org/v214/ext/ext-all.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+ <script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
- <script src="http://dhis2-cdn.org/v214/openlayers/OpenLayers.js"></script>
- <script src="http://dhis2-cdn.org/v214/plugin/map.js"></script>
+ <script src="http://dhis2-cdn.org/v215/openlayers/OpenLayers.js"></script>
+ <script src="http://dhis2-cdn.org/v215/plugin/map.js"></script>
<script>
var base = "http://apps.dhis2.org/demo";
@@ -2422,11 +2422,11 @@
});
function setLinks() {
- DHIS.getMap({ url: base, el: "mapA1", id: "ytkZY3ChM6J" });
+ DHIS.getMap({ url: base, el: "map1", id: "ytkZY3ChM6J" });
DHIS.getMap({
url: base,
- el: "mapB1",
+ el: "map2",
mapViews: [{
columns: [{dimension: "in", items: [{id: "Uvn6LCg7dVU"}]}], // data
rows: [{dimension: "ou", items: [{id: "LEVEL-3"}, {id: "ImspTQPwCqd"}]}], // organisation units,
@@ -2444,8 +2444,8 @@
</head>
<body>
- <div id="mapA1"></div>
- <div id="mapB1"></div>
+ <div id="map1"></div>
+ <div id="map2"></div>
</body>
</html></screen></para>
<para>Four files and Google Maps are included in the header section of the HTML
@@ -2453,11 +2453,11 @@
delivery network in this case) and its stylesheet. The third file is the OpenLayers
javascript mapping framework (<ulink url="http://openlayers.org"/>) and finally we include
the GIS map plug-in. Make sure the path is pointing to your DHIS server installation.</para>
- <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v214/ext/resources/css/ext-plugin-gray.css" />
-<script src="http://dhis2-cdn.org/v214/ext/ext-all.js"></script>
+ <screen><link rel="stylesheet" type="text/css" href="http://dhis2-cdn.org/v215/ext/resources/css/ext-plugin-gray.css" />
+<script src="http://dhis2-cdn.org/v215/ext/ext-all.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
-<script src="http://dhis2-cdn.org/v214/openlayers/OpenLayers.js"></script>
-<script src="http://dhis2-cdn.org/v214/plugin/map.js"></script></screen>
+<script src="http://dhis2-cdn.org/v215/openlayers/OpenLayers.js"></script>
+<script src="http://dhis2-cdn.org/v215/plugin/map.js"></script></screen>
<para>To authenticate with the DHIS server we use the same approach as in the previous section. In the header of the HTML document we include the following Javascript inside a script element. The <emphasis role="italic">setLinks</emphasis> method will be implemented later. Make sure the <emphasis role="italic">base</emphasis> variable is pointing to your DHIS installation.</para>
<screen>Ext.onReady( function() {
@@ -2654,11 +2654,11 @@
</table>
<para>We continue by adding one pre-defined and one dynamically configured map to our HTML document. You can browse the list of available maps using the Web API here: <ulink url="http://apps.dhis2.org/demo/api/maps"/>.</para>
<screen>function setLinks() {
- DHIS.getMap({ url: base, el: "mapA1", id: "ytkZY3ChM6J" });
+ DHIS.getMap({ url: base, el: "map1", id: "ytkZY3ChM6J" });
DHIS.getMap({
url: base,
- el: "mapB1",
+ el: "map2",
mapViews: [
columns: [ // Chart series
columns: [{dimension: "in", items: [{id: "Uvn6LCg7dVU"}]}], // data
@@ -2679,8 +2679,8 @@
});
}</screen>
<para>Finally we include some <emphasis role="italic">div</emphasis> elements in the body section of the HTML document with the identifiers referred to in the plug-in Javascript.</para>
- <screen><div id="mapA1"></div>
-<div id="mapB1"></div>
+ <screen><div id="map1"></div>
+<div id="map2"></div>
</screen>
<para>To see a complete working example please visit <ulink url="http://apps.dhis2.org/portal/map.html"/>.</para>
</section>
