WebCompDev / COMPONENTS

Commit cc0a0122aef563d2bd08eab0c009e63f2fe343aa

Authored by Renato De Donato
1 parent db65a851

new scatter + datalets bug fix

Inline Side-by-side
Showing 37 changed files with 118 additions and 1155 deletions
controllets/items-vslider-controllet/items-vslider-controllet.html
  View file @cc0a012
... ... @@ -69,7 +69,8 @@
69 69 padding: 8px;
70 70 width: 124px;
71 71 color: #000000;
72   - background-color: rgba(158, 158, 158, 0.8);
  72 + background-color: rgba(158, 158, 158, 0.8);/*9E*/
  73 + /*background-color: rgba(182, 182, 182, 0.9);/!*B&*!/*/
73 74 z-index: 1;
74 75 font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
75 76 font-size: 16px;
... ... @@ -79,7 +80,9 @@
79 80  
80 81 .legend.selected {
81 82 background-color: #2196F3;
  83 + /*background-color: rgba(33, 150, 243, 0.8);*/
82 84 color: #FFFFFF;
  85 +
83 86 }
84 87  
85 88 #items_vslider_search{
... ... @@ -225,8 +228,8 @@
225 228 for(var i=0; i < this.datalets.length; i++){
226 229 var datalet = this.datalets[i];
227 230 var imageName = this._getChartName(datalet.imageName).toLowerCase();
228   - console.log(imageName);
229   - console.log(this.filter);
  231 +// console.log(imageName);
  232 +// console.log(this.filter);
230 233 if(imageName.indexOf(this.filter.toLowerCase()) > -1)
231 234 datalets.push(datalet);
232 235 }
... ...
controllets/select-visualization-controllet/demo/index.html
  View file @cc0a012
... ... @@ -20,7 +20,8 @@
20 20  
21 21 <body>
22 22  
23   -<select-visualization-controllet fields='["records,fields,annee", "records,fields,preteur", "records,fields,capital_restant_du"]' data-url="https://data.issy.com/api/records/1.0/search/?dataset=repartitiondeladetteparpreteursau3112n-feuille1&rows=56&sort=-annee" deep-url="http://172.16.15.38/DEEalerProvider/DEEP/" datalets-list-url="http://172.16.15.38/DEEalerProvider/DEEP/datalets-list"></select-visualization-controllet>
  23 +<!--<select-visualization-controllet fields='["records,fields,annee", "records,fields,preteur", "records,fields,capital_restant_du"]' data-url="https://data.issy.com/api/records/1.0/search/?dataset=repartitiondeladetteparpreteursau3112n-feuille1&rows=56&sort=-annee" deep-url="http://172.16.15.38/DEEalerProvider/DEEP/" datalets-list-url="http://172.16.15.38/DEEalerProvider/DEEP/datalets-list"></select-visualization-controllet>-->
  24 +<select-visualization-controllet fields='["result,records,x", "result,records,y", "result,records,cat"]' data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=b056c5e6-76af-4526-a35d-7dee664fb6ee&limit=99999" deep-url="http://172.16.15.38/DEEalerProvider/DEEP/" datalets-list-url="http://172.16.15.38/DEEalerProvider/DEEP/datalets-list"></select-visualization-controllet>
24 25 <!--<select-datalet-inputs_series></select-datalet-inputs_series>-->
25 26 <!--<select-datalet-options></select-datalet-options>-->
26 27  
... ...
controllets/select-visualization-controllet/select-datalet-inputs.html
  View file @cc0a012
... ... @@ -272,7 +272,7 @@
272 272  
273 273 this.async(function () {
274 274 //reset ddl
275   - var ddls = document.getElementsByTagName("paper-dropdown-menu");
  275 + var ddls = this.$.inputs_container.getElementsByTagName("paper-dropdown-menu");
276 276 for (var i = 0; i < ddls.length; i++)
277 277 $(ddls[i]).find("paper-menu")[0].select(-1);
278 278 this.$.group_by.setAttribute("disabled", "");
... ...
controllets/select-visualization-controllet/select-datalet-inputs_series.html
  View file @cc0a012
... ... @@ -108,7 +108,7 @@
108 108 <paper-dropdown-menu id="group_by" disabled>
109 109 <paper-menu class="dropdown-content">
110 110 <template is="dom-repeat" items={{groupableFields}}>
111   - <paper-item id={{index}} on-tap="_setAggregators">{{_fieldName(item)}}</paper-item>
  111 + <paper-item id={{index}} on-tap="_setAggregatorsFields">{{_fieldName(item)}}</paper-item>
112 112 </template>
113 113 </paper-menu>
114 114 </paper-dropdown-menu>
... ... @@ -237,7 +237,7 @@
237 237  
238 238 this.async(function () {
239 239 //reset ddl
240   - var ddls = document.getElementsByTagName("paper-dropdown-menu");
  240 + var ddls = this.$.inputs_series_container.getElementsByTagName("paper-dropdown-menu");
241 241 for (var i = 0; i < ddls.length; i++)
242 242 $(ddls[i]).find("paper-menu")[0].select(-1);
243 243 this.$.group_by.setAttribute("disabled", "");
... ... @@ -310,6 +310,17 @@
310 310 this._setAggregators();
311 311 },
312 312  
  313 + _setAggregatorsFields : function(e){
  314 + this.async(function() {
  315 + var c_menu = $("#calculate_0").find("paper-menu")[0];
  316 + var selected = c_menu.selected > 0 ? c_menu.selected : 0;
  317 + c_menu.select(-1);
  318 + c_menu.select(selected);
  319 +
  320 + this._setAggregators();
  321 + }, 0);
  322 + },
  323 +
313 324 _setAggregators : function(){
314 325 this.async(function() {
315 326 this.aggregators = [];
... ...
controllets/select-visualization-controllet/select-datalet-options.html
  View file @cc0a012
... ... @@ -197,12 +197,13 @@
197 197  
198 198 setOptions : function(options) {
199 199 this.options = [];
  200 + this.params = [];
200 201 this.async(function() {
201 202 this.options = options;
202 203 }, 0);
203 204  
204   - this.params["title"] = "";
205   - this.params["description"] = "";
  205 +// this.params["title"] = "";
  206 +// this.params["description"] = "";
206 207 },
207 208  
208 209 ceckOptions : function(options) {
... ...
datalets/areachart-datalet/areachart-datalet.html
  View file @cc0a012
... ... @@ -80,10 +80,6 @@ Example:
80 80 min: 0,
81 81 title: {
82 82 text: this._component.yAxisLabel,
83   - align: 'high'
84   - },
85   - labels: {
86   - overflow: 'justify'
87 83 }
88 84 },
89 85 tooltip: {
... ...
datalets/areachart_stacked-datalet/areachart_stacked-datalet.html
  View file @cc0a012
... ... @@ -73,13 +73,13 @@ Example:
73 73 xAxis: {
74 74 categories: this.properties.categories.value,
75 75 title: {
76   - text: this._component.yAxisLabel
  76 + text: this._component.xAxisLabel
77 77 }
78 78 },
79 79 yAxis: {
80 80 min: 0,
81 81 title: {
82   - text: this._component.xAxisLabel,
  82 + text: this._component.yAxisLabel,
83 83 },
84 84 },
85 85 tooltip: {
... ...
datalets/barchart-datalet/barchart-datalet.html
  View file @cc0a012
... ... @@ -80,10 +80,6 @@ Example:
80 80 min: 0,
81 81 title: {
82 82 text: this._component.xAxisLabel,
83   - align: 'high'
84   - },
85   - labels: {
86   - overflow: 'justify'
87 83 }
88 84 },
89 85 tooltip: {
... ...
datalets/bubble3d-datalet/bubble3d-datalet.html deleted
View file @db65a85
1   -<!--
2   -@license
3   - The MIT License (MIT)
4   -
5   - Copyright (c) 2015 Dipartimento di Informatica - Universit๏ฟฝ di Salerno - Italy
6   -
7   - Permission is hereby granted, free of charge, to any person obtaining a copy
8   - of this software and associated documentation files (the "Software"), to deal
9   - in the Software without restriction, including without limitation the rights
10   - to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11   - copies of the Software, and to permit persons to whom the Software is
12   - furnished to do so, subject to the following conditions:
13   -
14   - The above copyright notice and this permission notice shall be included in
15   - all copies or substantial portions of the Software.
16   -
17   - THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18   - IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19   - FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20   - AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21   - LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22   - OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
23   - THE SOFTWARE.
24   --->
25   -
26   -<!--
27   -* Developed by :
28   -* ROUTE-TO-PA Project - grant No 645860. - www.routetopa.eu
29   -*
30   --->
31   -
32   -<link rel="import" href="../highcharts-datalet/highcharts-datalet.html">
33   -<script src="http://code.highcharts.com/highcharts-more.js"></script>
34   -
35   -<!--
36   -`bubble3d-datalet` is a 3D bubbles datalet based on highcharts project <http://www.highcharts.com/>
37   -
38   -Examples:
39   -
40   - An example to create a 3d Bubble chart with multiple series specified (fields4)
41   -
42   - <bubble3d-datalet
43   - data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=#"
44   - fields='["field1","field2","field3","field4"]'>
45   - </bubble3d-datalet>
46   -
47   - An example to create a 3d Bubble chart with x and y values, and a size value (field3)
48   -
49   - <bubble3d-datalet
50   - data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=#"
51   - fields='["field1","field2","field3"]'>
52   - </bubble3d-datalet>
53   -
54   -@element bubble3d-datalet
55   -@status v0.1
56   -@demo demo/index.html
57   -@group datalets
58   --->
59   -
60   -<dom-module name="bubble3d-datalet">
61   - <template>
62   - <highcharts-datalet id="charts" data-url="{{dataUrl}}" fields="{{fields}}" data="{{data}}" title="{{title}}" description="{{description}}"></highcharts-datalet>
63   - </template>
64   - <script>
65   -
66   - var Bubble3dBehavior = {
67   - /**
68   - * Build Highchart object
69   - *
70   - * @method presentData
71   - */
72   - presentData: function() {
73   - var categoryName = [];
74   - var color = {};
75   - var bubble3DSeriesData = {};
76   - var b3dserie = [];
77   -
78   - Bubble3DArr = [];
79   - var dataTmp = [];
80   - //Example 1: No Series name is specified in the query
81   - if(this.data.length == 3){
82   - for (var i = 0; i < this.data[0].data.length; i++) {
83   - Bubble3DArr = [this.data[0].data[i], parseFloat(this.data[1].data[i]), parseFloat(this.data[2].data[i])];
84   - dataTmp.push(Bubble3DArr)
85   - }
86   - color = {
87   - fillColor: {
88   - radialGradient: {cx: 0.4, cy: 0.3, r: 0.7},
89   - stops: [
90   - [0, 'rgba(255,255,255,0.5)']
91   - ]
92   - }
93   - }
94   - //add data to the series
95   - bubble3DSeriesData = {
96   - name: "Series",
97   - data: dataTmp,
98   - marker: color
99   - }
100   - b3dserie.push(bubble3DSeriesData);
101   - }
102   - //Example 2: A multi-series 3d bubble charts
103   - else{
104   - var categoryNameDuplicateValue = [];
105   - for (i = 0; i < this.data[0].data.length; i++) {
106   - categoryNameDuplicateValue.push(this.data[3].data[i]);
107   - }
108   - categoryName = categoryNameDuplicateValue.filter(function (itm, i, categoryNameDuplicateValue) {
109   - return i == categoryNameDuplicateValue.indexOf(itm);
110   - });
111   - for (var index = 0; index < categoryName.length; index++) {
112   - for (var i = 0; i < this.data[0].data.length; i++) {
113   - if (this.data[3].data[i] == categoryName[index]) {
114   - Bubble3DArr = [this.data[0].data[i], this.data[1].data[i], parseFloat(this.data[2].data[i])];
115   - dataTmp.push(Bubble3DArr);
116   - //A different color for each series
117   - color = {
118   - fillColor: {
119   - radialGradient: {cx: 0.4, cy: 0.3, r: 0.7},
120   - stops: [
121   - [0, 'rgba(255,255,255,0.5)'],
122   - [1, Highcharts.Color(Highcharts.getOptions().colors[index]).setOpacity(0.5).get('rgba')]
123   - ]
124   - }
125   - }
126   - }
127   - }
128   - //add data to the series
129   - bubble3DSeriesData = {
130   - name: "Series: " + categoryName[index],
131   - data: dataTmp,
132   - marker: color
133   - }
134   -
135   - b3dserie.push(bubble3DSeriesData);
136   - dataTmp = [];
137   - }
138   - }
139   - $(this._component.$.charts.$.container).highcharts({
140   - chart: {
141   - type: 'bubble',
142   - plotBorderWidth: 1,
143   - zoomType: 'xy'
144   - },
145   -
146   - legend: {
147   - enabled: true
148   - },
149   -
150   - title: {
151   - text: "" + this._component.title
152   - },
153   - xAxis: {
154   - categories: this.properties.categories.value,
155   - title: {
156   - text: this._component.xAxisLabel
157   - }
158   - },
159   -
160   - yAxis: {
161   - categories: this.properties.categories.value,
162   - title: {
163   - text: this._component.yAxisLabel
164   - }
165   - },
166   - title: {
167   - text: this._component.title
168   - },
169   - subtitle: {
170   - text: this._component.title
171   - },
172   - //A custom tooltip
173   - tooltip: {
174   - shared: true,
175   - useHTML: true,
176   - headerFormat:
177   - '<table ><tr><td style="color: {series.color}">{series.name}</td></tr>' +
178   - '<tr><td <b> {point.key}</b> , <b>{point.y}</b></tr>',
179   - pointFormat:
180   - '<td style="text-align: right"><b>{point.z}</b></td></tr>',
181   - footerFormat: '</table>',
182   - followPointer: true
183   - },
184   - plotOptions: {
185   - series: {
186   - dataLabels: {
187   - enabled: false, //enable for label for each bubble
188   - format: '{point.z}'
189   - }
190   - }
191   - },
192   - //hide link HighChart
193   - credits: {
194   - enabled: false
195   - },
196   - series: b3dserie
197   - });
198   - }
199   - };
200   - /**
201   - * Element registration
202   - */
203   - Bubble3dDatalet = Polymer({
204   - is: 'bubble3d-datalet',
205   - properties: {
206   - /**
207   - * It's the label for X axis
208   - *
209   - * @attribute xAxisLabel
210   - * @type String
211   - * @default ''
212   - */
213   - xAxisLabel: {
214   - type: String,
215   - value: ""
216   - },
217   - /**
218   - * It's the label for Y axis
219   - *
220   - * @attribute yAxisLabel
221   - * @type String
222   - * @default ''
223   - */
224   - yAxisLabel: {
225   - type: String,
226   - value: ""
227   - },
228   - /**
229   - * It's the component behavior
230   - *
231   - * @attribute behavior
232   - * @type Object
233   - * @default {}
234   - */
235   - behavior : {
236   - type : Object,
237   - value : {}
238   - }
239   - },
240   - /**
241   - * 'ready' callback extend the Bubble3dBehavior with HighchartsComponentBehavior and Bubble3dBehavior
242   - * and run the Datalet workcycle.
243   - *
244   - * @method ready
245   - */
246   - ready: function(){
247   - this.behavior = $.extend(true, {}, HighchartsComponentBehavior, Bubble3dBehavior);
248   - this.async(function(){this.behavior.init(this)},0);
249   - }
250   - });
251   - </script>
252   -</dom-module>
253 0 \ No newline at end of file
datalets/bubble3d-datalet/bubble3d-datalet.png deleted
View file @db65a85

15.8 KB
datalets/bubble3d-datalet/bubble3d-datalet.xml deleted
View file @db65a85
1   -<component>
2   - <name>bubble3d-datalet</name>
3   - <attributes>
4   - <attribute>
5   - <name>data-url</name>
6   - </attribute>
7   - <attribute>
8   - <name>fields</name>
9   - </attribute>
10   - </attributes>
11   - <idm>
12   - <inputs>
13   - <input>
14   - <name>Categories</name>
15   - <description>The chart categories. Its values will be put in the horizontal axis. You need one value for each series.</description>
16   - <scale>nominal</scale>
17   - <role>domain</role>
18   - <selection>11</selection>
19   - </input>
20   - <input>
21   - <name>Y values</name>
22   - <description>The chart plots y values. Its values will be put in the vertical axis.</description>
23   - <scale>nominal</scale>
24   - <role>domain</role>
25   - <selection>11</selection>
26   - </input>
27   - <input>
28   - <name>Z values</name>
29   - <description>The chart plots z value. Its values represent the size of the bubble.</description>
30   - <scale>nominal</scale>
31   - <role>domain</role>
32   - <selection>11</selection>
33   - </input>
34   - <input>
35   - <name>Series</name>
36   - <description>The chart series. Its values visualize multi- series bubbles chart.</description>
37   - <scale>nominal</scale>
38   - <role>domain</role>
39   - <selection>11</selection>
40   - </input>
41   - <layouts>
42   - <input>
43   - <name>title</name>
44   - <description>The label for the title of the chart</description>
45   - </input>
46   - <input>
47   - <name>x-axis-label</name>
48   - <description>The label for the X axis</description>
49   - </input>
50   - <input>
51   - <name>y-axis-label</name>
52   - <description>The label for the Y axis</description>
53   - </input>
54   - <input>
55   - <name>suffix</name>
56   - <description>The values suffix(eg units, dollars, euro, ...)</description>
57   - </input>
58   - <input>
59   - <name>comment</name>
60   - <description>The values suffix(eg units, dollars, euro, ...)</description>
61   - </input>
62   - </layouts>
63   - </inputs>
64   - </idm>
65   -</component>
66 0 \ No newline at end of file
datalets/bubble3d-datalet/demo/index.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <meta charset="UTF-8">
5   - <title></title>
6   -
7   - <script>
8   - </script>
9   -
10   -</head>
11   -<body>
12   -
13   -<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
14   -<link rel="import" href="../bubble3d-datalet.html" />
15   -<bubble3d-datalet data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=0cb600fc-19ad-4aaf-9794-1e6ea851840a"
16   - fields='["result,records,risorsa","result,records,capitolo","result,records,movimento", "result,records,categoria"]'></bubble3d-datalet>
17   -
18   -</body>
19   -</html>
datalets/bubble3d-datalet/docs.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <link rel="import" href="../../bower_components/iron-component-page/iron-component-page.html">
5   - <meta charset="UTF-8">
6   -</head>
7   -<body>
8   -
9   -<iron-component-page src="bubble3d-datalet.html"></iron-component-page>
10   -
11   -</body>
12   -</html>
13 0 \ No newline at end of file
datalets/bubblechart-datalet/bubblechart-datalet.png 100755 โ†’ 100644
View file @cc0a012

11.9 KB | W: | H:

790 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
datalets/column3Dchart-datalet/column3Dchart-datalet.html deleted
View file @db65a85
1   -<!--
2   -@license
3   - The MIT License (MIT)
4   -
5   - Copyright (c) 2015 Dipartimento di Informatica - Universit๏ฟฝ di Salerno - Italy
6   -
7   - Permission is hereby granted, free of charge, to any person obtaining a copy
8   - of this software and associated documentation files (the "Software"), to deal
9   - in the Software without restriction, including without limitation the rights
10   - to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11   - copies of the Software, and to permit persons to whom the Software is
12   - furnished to do so, subject to the following conditions:
13   -
14   - The above copyright notice and this permission notice shall be included in
15   - all copies or substantial portions of the Software.
16   -
17   - THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18   - IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19   - FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20   - AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21   - LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22   - OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
23   - THE SOFTWARE.
24   --->
25   -
26   -<!--
27   -* Developed by :
28   -* ROUTE-TO-PA Project - grant No 645860. - www.routetopa.eu
29   -*
30   --->
31   -
32   -
33   -<link rel="import" href="../highcharts-datalet/highcharts-datalet.html">
34   -<script src="http://code.highcharts.com/highcharts-3d.js"></script>
35   -
36   -
37   -<!--
38   -
39   -`column3Dchart-datalet` is a column3Dchart datalet based on highcharts project <http://www.highcharts.com/>
40   -
41   -Example:
42   -
43   - <column3dchart-datalet
44   - data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=#"
45   - fields='["field1","field2"]'>
46   - </column3dchart-datalet>
47   -
48   -@element column3Dchart-datalet
49   -@status v0.1
50   -@demo demo/index.html
51   -@group datalets
52   --->
53   -
54   -
55   -<dom-module name="column3Dchart-datalet">
56   -
57   - <template>
58   - <table>
59   - <tr><td>Alpha Angle</td><td><input id="R0" type="range" min="0" max="45" value="15"/> <span id="R0-value" class="value"></span></td></tr>
60   - <tr><td>Beta Angle</td><td><input id="R1" type="range" min="0" max="45" value="15"/> <span id="R1-value" class="value"></span></td></tr>
61   - </table>
62   - <highcharts-datalet id="charts" data-url="{{dataUrl}}" fields="{{fields}}" data="{{data}}" title="{{title}}" description="{{description}}"></highcharts-datalet>
63   - </template>
64   -
65   - <script>
66   -
67   - var chart = null;
68   -
69   - var column3DchartBehavior = {
70   -
71   - /**
72   - * Bluid Highchart object
73   - *
74   - * @method transformData
75   - */
76   - presentData: function(){
77   - chart = new Highcharts.Chart({
78   - chart: {
79   - renderTo: this._component.$.charts.$.container,
80   - borderColor: '#EBBA95',
81   - borderWidth: 2,
82   - zoomType : 'xy',
83   - type: 'line',
84   - type: 'column',
85   - margin: 75,
86   - options3d: {
87   - enabled: true,
88   - alpha: 15,
89   - beta: 15,
90   - depth: 50,
91   - viewDistance: 25
92   - }
93   - },
94   - title: {
95   - text: this._component.title
96   - },
97   - xAxis: {
98   - categories: this.properties.categories.value,
99   - title: {
100   - text: this._component.xAxislabel
101   - }
102   - },
103   - title: {
104   - text: this.properties.title
105   - },
106   - subtitle: {
107   - text: this._component.title
108   - },
109   - plotOptions: {
110   - column: {
111   - depth: 25
112   - }
113   - },
114   -
115   - series: this.properties.series.value
116   - });
117   -
118   - // Activate the sliders
119   - $('#R0').on('change', function () {
120   - chart.options.chart.options3d.alpha = this.value;
121   - chart.redraw(false);
122   - });
123   -
124   - $('#R1').on('change', function () {
125   - chart.options.chart.options3d.beta = this.value;
126   - chart.redraw(false);
127   - });
128   - }
129   - };
130   -
131   - //element registration
132   - column3DchartDatalet = Polymer({
133   - is: 'column3Dchart-datalet',
134   -
135   - properties: {
136   - /**
137   - * It's the label for X axis
138   - *
139   - * @attribute xAxisLabel
140   - * @type String
141   - * @default ''
142   - */
143   - xAxisLabel: {
144   - type: String,
145   - value: ""
146   - },
147   - /**
148   - * It's the label for Y axis
149   - *
150   - * @attribute yAxisLabel
151   - * @type String
152   - * @default ''
153   - */
154   - yAxisLabel: {
155   - type: String,
156   - value: ""
157   - },
158   - /**
159   - * It's the component behavior
160   - *
161   - * @attribute behavior
162   - * @type Object
163   - * @default {}
164   - */
165   - behavior : {
166   - type : Object,
167   - value : {}
168   - }
169   - },
170   -
171   - /**
172   - * 'ready' callback extend the column3DchartComponentBehavior with HighchartsComponentBehavior and column3DchartBehavior
173   - * and run the Datalet workcycle.
174   - *
175   - * @method ready
176   - */
177   - ready: function(){
178   - this.behavior = $.extend(true, {}, HighchartsComponentBehavior, column3DchartBehavior);
179   - this.async(function(){this.behavior.init(this)},0);
180   - }
181   - });
182   - </script>
183   -</dom-module>
184 0 \ No newline at end of file
datalets/column3Dchart-datalet/column3Dchart-datalet.png deleted
View file @db65a85

99 KB
datalets/column3Dchart-datalet/demo/index.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <meta charset="UTF-8">
5   - <title></title>
6   -
7   - <script>
8   - </script>
9   -
10   -</head>
11   -<body>
12   -
13   -<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
14   -<link rel="import" href="../column3Dchart-datalet.html" />
15   -
16   -<column3Dchart-datalet data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=73e02092-85a1-434e-85fe-0c9a43aa9a52&amp;limit=10000"
17   - fields='["result,records,Lat","result,records,Lng"]'></column3Dchart-datalet>
18   -
19   -</body>
20   -</html>
21 0 \ No newline at end of file
datalets/column3Dchart-datalet/docs.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <link rel="import" href="../../bower_components/iron-component-page/iron-component-page.html">
5   - <meta charset="UTF-8">
6   -</head>
7   -<body>
8   -
9   -<iron-component-page src="column3Dchart-datalet.html"></iron-component-page>
10   -
11   -</body>
12   -</html>
13 0 \ No newline at end of file
datalets/columnchart-datalet/columnchart-datalet.html
  View file @cc0a012
... ... @@ -82,10 +82,6 @@ Example:
82 82 min: 0,
83 83 title: {
84 84 text: this._component.yAxisLabel,
85   - align: 'high'
86   - },
87   - labels: {
88   - overflow: 'justify'
89 85 }
90 86 },
91 87 // tooltip: {
... ...
datalets/columnchart_stacked-datalet/columnchart_stacked-datalet.html
  View file @cc0a012
... ... @@ -73,13 +73,13 @@ Example:
73 73 xAxis: {
74 74 categories: this.properties.categories.value,
75 75 title: {
76   - text: this._component.yAxisLabel
  76 + text: this._component.xAxisLabel
77 77 }
78 78 },
79 79 yAxis: {
80 80 min: 0,
81 81 title: {
82   - text: this._component.xAxisLabel,
  82 + text: this._component.yAxisLabel,
83 83 },
84 84 },
85 85 tooltip: {
... ...
datalets/datasetexplorer-datalet/js/buildtreemap2.js
  View file @cc0a012
... ... @@ -50,6 +50,7 @@ function build2(root, meta, place_holder, select_listener, width, height) {
50 50 var data = ["top", "", "#000000", "", "", "", ""];
51 51 //data[3] = OW.getLanguageText('ode', 'back');
52 52 data[3] = datasetexplorer_ln["ode+back_"+datasetexplorer_ln["ln"]];
  53 + /*error*/data[3] = "<< Click to navigate back to the top level.";
53 54  
54 55 return "showTooltip(evt, '" + data + "')";
55 56 })
... ...
datalets/donutpie3dchart-datalet/demo/index.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <meta charset="UTF-8">
5   - <title></title>
6   -
7   - <script>
8   - </script>
9   -
10   -</head>
11   -<body>
12   -
13   -<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script>
14   -<link rel="import" href="../donutpie3dchart-datalet.html" />
15   -<donutpie3dchart-datalet data-url="https://data.issy.com/api/records/1.0/search?dataset=flux-rss-des-offres-demplois-a-issy-les-moulineaux&sort=published&facet=published&refine.published=2015%2F10"
16   - fields='["facet_groups,facets,facets,path","facet_groups,facets,facets,count"]'></donutpie3dchart-datalet>
17   -</body>
18   -</html>
19   -
datalets/donutpie3dchart-datalet/docs.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <link rel="import" href="../../bower_components/iron-component-page/iron-component-page.html">
5   - <meta charset="UTF-8">
6   -</head>
7   -<body>
8   -
9   -<iron-component-page src="donutpie3dchart-datalet.html"></iron-component-page>
10   -
11   -</body>
12   -</html>
datalets/donutpie3dchart-datalet/donutpie3dchart-datalet.html deleted
View file @db65a85
1   -<!--
2   -@license
3   - The MIT License (MIT)
4   -
5   - Copyright (c) 2015 Dipartimento di Informatica - Universit๏ฟฝ di Salerno - Italy
6   -
7   - Permission is hereby granted, free of charge, to any person obtaining a copy
8   - of this software and associated documentation files (the "Software"), to deal
9   - in the Software without restriction, including without limitation the rights
10   - to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11   - copies of the Software, and to permit persons to whom the Software is
12   - furnished to do so, subject to the following conditions:
13   -
14   - The above copyright notice and this permission notice shall be included in
15   - all copies or substantial portions of the Software.
16   -
17   - THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18   - IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19   - FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20   - AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21   - LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22   - OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
23   - THE SOFTWARE.
24   --->
25   -
26   -<!--
27   -* Developed by :
28   -* ROUTE-TO-PA Project - grant No 645860. - www.routetopa.eu
29   -*
30   --->
31   -<link rel="import" href="../../bower_components/polymer/polymer.html">
32   -<link rel="import" href="../highcharts-datalet/highcharts-datalet.html">
33   -<script src="https://code.highcharts.com/highcharts-3d.js"></script>
34   -
35   -
36   -
37   -<!--
38   -`donutpie3dchart-datalet` is a donutpie3dchart datalet based on highcharts project <http://www.highcharts.com/>
39   -
40   -Example:
41   -
42   - <donutpie3dchart-datalet>
43   - data-url="http://ckan.routetopa.eu/api/action/datastore_search?resource_id=#"
44   - fields='["field1","field2"]'>
45   - </donutpie3dchart-datalet>
46   -
47   -@element donut3dchart-datalet
48   -@status v0.1
49   -@demo demo/index.html
50   -@group datalets
51   --->
52   -<dom-module id="donutpie3dchart-datalet">
53   - <template>
54   - <highcharts-datalet id="charts" data-url="{{dataUrl}}" fields="{{fields}}" data="{{data}}" title="{{title}}" description="{{description}}"></highcharts-datalet>
55   - </template>
56   - <script>
57   -
58   - var DonutPiechartBehavior = {
59   - /**
60   - * Build Highchart object
61   - *
62   - * @method presentData
63   - */
64   - presentData: function(){
65   -
66   - var DonutPie3DSeries = [{"name": this.data[1].name, "data":[]}];
67   -
68   - for(var i=0; i<this.data[0].data.length; i++)
69   - {
70   - var DonutPie3DArr = [this.data[0].data[i], this.data[1].data[i]];
71   - DonutPie3DSeries[0].data.push(DonutPie3DArr);
72   - }
73   -
74   - //Build Highchart element
75   - $(this._component.$.charts.$.container).highcharts({
76   - chart: {
77   - type: 'pie',
78   - options3d: {
79   - enabled: true,
80   - alpha: 45
81   - }
82   - },
83   - title: {
84   - text: "" + this._component.title
85   - },
86   - plotOptions: {
87   - pie: {
88   - innerSize: 100,
89   - depth: 45,
90   - allowPointSelect: true,
91   - cursor: 'pointer',
92   - dataLabels: {
93   - enabled: true,
94   - formatter: function() {
95   - if (this.point.name.length > 10) {
96   - return this.point.name.substr(0, 10) + "...";
97   - } else {
98   - return this.point.name;
99   - }
100   - }
101   - },
102   - showInLegend: true
103   - }
104   - },
105   - //hide link HighChart
106   - credits: {
107   - enabled: false
108   - },
109   - series: DonutPie3DSeries//this.properties.series.value
110   - });
111   - }
112   - };
113   -
114   -
115   - DonutPiechartDatalet = Polymer({
116   - is: 'donutpie3dchart-datalet',
117   -
118   - properties: {
119   - /**
120   - * It's the component behavior
121   - *
122   - * @attribute behavior
123   - * @type Object
124   - * @default {}
125   - */
126   - behavior : {
127   - type : Object,
128   - value : {}
129   - }
130   - },
131   -
132   - /**
133   - * 'ready' callback extend the DonutPiechartComponentBehavior with HighchartsComponentBehavior and DonutPiechartBehavior
134   - * and run the Datalet workcycle.
135   - *
136   - * @method ready
137   - */
138   - ready: function(){
139   - this.behavior = $.extend(true, {}, HighchartsComponentBehavior, DonutPiechartBehavior);
140   - this.async(function(){this.behavior.init(this)},0);
141   - }
142   - });
143   - </script>
144   -</dom-module>
145 0 \ No newline at end of file
datalets/donutpie3dchart-datalet/donutpie3dchart-datalet.png deleted
View file @db65a85

26.4 KB
datalets/donutpie3dchart-datalet/donutpie3dchart-datalet.xml deleted
View file @db65a85
1   -<component>
2   -<name>donutpie3dchart-datalet</name>
3   -<attributes>
4   -<attribute>
5   - <name>data-url</name>
6   -</attribute>
7   -<attribute>
8   - <name>fields</name>
9   -</attribute>
10   -</attributes>
11   -<idm>
12   -<inputs>
13   - <input>
14   - <name>Series</name>
15   - <description>The chart series. Its values will be put on slice of each series.</description>
16   - <scale>nominal</scale>
17   - <role>domain</role>
18   - <selection>11</selection>
19   - </input>
20   - <input>
21   - <name>Size </name>
22   - <description>The size for each series to create a concentric rings</description>
23   - <scale>nominal</scale>
24   - <role>domain</role>
25   - <selection>11</selection>
26   - </input>
27   - <layouts>
28   - <input>
29   - <name>title</name>
30   - <description>The label for the title of the chart</description>
31   - </input>
32   - </layouts>
33   -</inputs>
34   -</idm>
35   -</component>
36 0 \ No newline at end of file
datalets/donutpie3dchart-datalet/info.xml deleted
View file @db65a85
1   -<component>
2   - <name>donutpie3dchart-datalet</name>
3   - <attributes>
4   - <attribute>
5   - <name>data-url</name>
6   - </attribute>
7   - <attribute>
8   - <name>fields</name>
9   - </attribute>
10   - </attributes>
11   - <idm>
12   - <inputs>
13   - <input>
14   - <name>Series</name>
15   - <description>The chart series. Its values will be put on slice of each series.</description>
16   - <scale>nominal</scale>
17   - <role>domain</role>
18   - <selection>11</selection>
19   - </input>
20   - <input>
21   - <name>Size </name>
22   - <description>The size for each series to create a concentric rings</description>
23   - <scale>nominal</scale>
24   - <role>domain</role>
25   - <selection>11</selection>
26   - </input>
27   - <layouts>
28   - <input>
29   - <name>title</name>
30   - <description>The label for the title of the chart</description>
31   - </input>
32   - </layouts>
33   - </inputs>
34   - </idm>
35   -</component>
36 0 \ No newline at end of file
datalets/google-map/google-map-datalet.html deleted
View file @db65a85
1   -<link rel="import" href="../../bower_components/polymer/polymer.html">
2   -<link rel="import" href="../base-csv-datalet/base-csv-datalet.html">
3   -<link rel="import" href="http://www.vm.webcomponents.com/webComp/COMPONENTS/bower_components/google-map/google-map.html">
4   -
5   -<dom-module id="google-map-datalet">
6   - <template>
7   -
8   - <google-map id="map" fit-to-markers>
9   - <template is="dom-repeat" items="{{markers}}">
10   - <google-map-marker latitude="{{item.Lat}}" longitude="{{item.Lng}}">
11   - </google-map-marker>
12   - </template>
13   - </google-map>
14   -
15   - <base-datalet data_url="{{data_url}}" query="{{query}}"></base-datalet>
16   -
17   - </template>
18   -
19   - <script src="../shared_js/papa_parse/papaparse.min.js"></script>
20   -
21   - <script>
22   - var googleMapBehavior = {
23   -
24   - selectData: function(e){
25   - },
26   -
27   - transformData: function(){
28   -
29   - var behavior = this;
30   -
31   - Papa.parse(this.properties.csv_results.value, {
32   - header:true,
33   - skipEmptyLines:true,
34   - complete: function(results, file) {
35   - behavior.properties.data.value = results;
36   - behavior._component.markers = googleMapComponentBehavior.properties.data.value.data;
37   - }
38   - });
39   - }
40   - };
41   -
42   - var googleMapComponentBehavior = $.extend(true, {}, BaseDataletBehavior, WorkcycleBehavior, CVSDataRequestBehavior, googleMapBehavior);
43   -
44   - Polymer({
45   - is : 'google-map-datalet' ,
46   -
47   - ready: function(){
48   - googleMapComponentBehavior.init(this);
49   - },
50   -
51   - //markers : null
52   -
53   - properties : {
54   - markers :
55   - {
56   - type : Array,
57   - value : []
58   - }
59   - }
60   - });
61   - </script>
62   -</dom-module>
63   -
datalets/heatmap-datalet/heatmap-datalet.html
  View file @cc0a012
... ... @@ -200,7 +200,7 @@ Example:
200 200 */
201 201 ready: function(){
202 202 this.behavior = $.extend(true, {}, HighchartsComponentBehavior, HeatMapBehavior);
203   - this.async(function(){this.behavior.init(this)},1000);
  203 + this.async(function(){this.behavior.init(this)},0);
204 204 }
205 205 });
206 206 </script>
... ...
datalets/linechart-datalet/linechart-datalet.html
  View file @cc0a012
... ... @@ -79,10 +79,6 @@ Example:
79 79 min: 0,
80 80 title: {
81 81 text: this._component.yAxisLabel,
82   - align: 'high'
83   - },
84   - labels: {
85   - overflow: 'justify'
86 82 }
87 83 },
88 84 tooltip: {
... ...
datalets/piechart-datalet/piechart-datalet.png
View file @cc0a012

788 Bytes | W: | H:

747 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
datalets/scatterchart-datalet/scatterchart-datalet.html
  View file @cc0a012
... ... @@ -62,91 +62,58 @@ Example:
62 62 * @method presentData
63 63 */
64 64 presentData: function(){
65   - var categoryName = [];
66   - var color = {};
67   - var scatterSeriesData = {};
68   - var scattserie = [];
69   -
70   - ScatterArr = [];
71   - var dataTmp = [];
72   - //Example 1: No Series name is specified in the query
73   - if(this.data.length == 2){
74   - for (var i = 0; i < this.data[0].data.length; i++) {
75   - ScatterArr = [parseFloat(this.data[0].data[i]), parseFloat(this.data[1].data[i])];
76   - dataTmp.push(ScatterArr)
  65 + var x = this.data[0]["data"];
  66 +
  67 + var categories = x.filter(function(item, pos) {
  68 + return x.indexOf(item) == pos;
  69 + });
  70 +
  71 + var scatterSeries = [];
  72 + var series = [];
  73 + var point = [];
  74 +
  75 + for (var i = 0; i < categories.length; i++) {
  76 + for (var j = 0; j < x.length; j++) {
  77 + if (this.data[0].data[j] == categories[i]) {
  78 + point = [this.data[1].data[j], this.data[2].data[j]];
  79 + series.push(point);
77 80 }
78   - //add data to the series
79   - scatterSeriesData = {
80   - name: "Series",
81   - data: dataTmp,
82   - marker: color
83 81 }
84   - scattserie.push(scatterSeriesData);
85   - }
86   - //Example 2: multi-series charts
87   - else{
88   - var categoryNameDuplicateValue = [];
89   - for (i = 0; i < this.data[0].data.length; i++) {
90   - categoryNameDuplicateValue.push(this.data[0].data[i]);
91   - }
92   - categoryName = categoryNameDuplicateValue.filter(function (itm, i, categoryNameDuplicateValue) {
93   - return i == categoryNameDuplicateValue.indexOf(itm);
94   - });
95   - for (var index = 0; index < categoryName.length; index++) {
96   - for (var i = 0; i < this.data[0].data.length; i++) {
97   - if (this.data[0].data[i] == categoryName[index]) {
98   - ScatterArr = [this.data[1].data[i], this.data[2].data[i]];
99   - dataTmp.push(ScatterArr);
100   - }
101   - }
102   - //add data to the series
103   - scatterSeriesData = {
104   - name: "Series: " + categoryName[index],
105   - data: dataTmp,
106   - marker: color
107   - }
108 82  
109   - scattserie.push(scatterSeriesData);
110   - dataTmp = [];
111   - }
  83 + scatterSeries.push({name: categories[i], data: series});
  84 + series = [];
112 85 }
113   -
114   - $(this._component.$.charts.$.container).highcharts({
  86 +
  87 + this.properties.series = scatterSeries;
  88 +
  89 + options = {
115 90 chart: {
116 91 type: 'scatter',
117 92 zoomType: 'xy'
118 93 },
119 94 title: {
120   - text: "" + this._component.title
  95 + text: this._component.title
121 96 },
122   - plotOptions: {
123   - scatter: {
124   - marker: {
125   - radius: 5,
126   - states: {
127   - hover: {
128   - enabled: true,
129   - lineColor: 'rgb(100,100,100)'
130   - }
131   - }
132   - },
133   - /*tooltip: {
134   - headerFormat: '<b>{series.name}</b><br>',
135   - pointFormat: '{point.x} ab, {point.y} kmq',
136   - valueSuffix: ' ' + this._component.suffix
137   - }*/
138   - tooltip: {
139   - headerFormat: '<b>{series.name}</b><br>',
140   - pointFormat: '{point.x}' + this._component.xAxisLabel + ', {point.y}' + this._component.yAxisLabel,
141   - valueSuffix: ' ' + this._component.suffix
142   - }
  97 + xAxis: {
  98 + title: {
  99 + text: this._component.yAxisLabel
  100 + }
  101 + },
  102 + yAxis: {
  103 + title: {
  104 + text: this._component.xAxisLabel,
143 105 }
144 106 },
145 107 credits: {
146 108 enabled: false
147 109 },
148   - series: scattserie
149   - });
  110 + series: this.properties.series
  111 + };
  112 +
  113 + if(this._component.theme != "themeBase" && this._component.theme != "")
  114 + jQuery.extend(true, options, Highcharts[this._component.theme]);
  115 +
  116 + $(this._component.$.charts.$.container).highcharts(options);
150 117 }
151 118 };
152 119  
... ... @@ -154,35 +121,22 @@ Example:
154 121 scatterchartDatalet = Polymer({
155 122 is: 'scatterchart-datalet',
156 123 properties: {
157   - /**
158   - * It's the label for X axis
159   - *
160   - * @attribute xAxisLabel
161   - * @type String
162   - * @default ''
163   - */
164 124 xAxisLabel: {
165 125 type: String,
166 126 value: ""
167 127 },
168   - /**
169   - * It's the label for Y axis
170   - *
171   - * @attribute yAxisLabel
172   - * @type String
173   - * @default ''
174   - */
175 128 yAxisLabel: {
176 129 type: String,
177 130 value: ""
178 131 },
179   - /**
180   - * It's the component behavior
181   - *
182   - * @attribute behavior
183   - * @type Object
184   - * @default {}
185   - */
  132 + suffix : {
  133 + type : String,
  134 + value : ""
  135 + },
  136 + theme : {
  137 + type : String,
  138 + value : ""
  139 + },
186 140 behavior : {
187 141 type : Object,
188 142 value : {}
... ... @@ -197,7 +151,7 @@ Example:
197 151 */
198 152 ready: function(){
199 153 this.behavior = $.extend(true, {}, HighchartsComponentBehavior, scatterchartBehavior);
200   - this.async(function(){this.behavior.init(this)},1000);
  154 + this.async(function(){this.behavior.init(this)},0);
201 155 }
202 156 });
203 157 </script>
... ...
datalets/scatterchart-datalet/scatterchart-datalet.png 100755 โ†’ 100644
View file @cc0a012

3.63 KB | W: | H:

876 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
datalets/test-google-components/test.html deleted
View file @db65a85
1   -<!DOCTYPE html>
2   -<html lang="en">
3   -<head>
4   - <meta charset="UTF-8">
5   - <title>Google spreadsheet and document test page</title>
6   -
7   - <script type="text/javascript" src="../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
8   - <script type="text/javascript" src="../shared_js/jquery-1.11.2.min.js"></script>
9   -
10   - <link rel="import" href="../../bower_components/google-sheets/google-sheets.html">
11   - <link rel="import" href="../../bower_components/iron-flex-layout/iron-flex-layout.html">
12   - <link rel="import" href="../../bower_components/iron-icons/iron-icons.html">
13   - <link rel="import" href="../../bower_components/paper-fab/paper-fab.html">
14   - <link rel="import" href="../linechart-datalet/linechart-datalet.html">
15   -
16   - <style>
17   - #sheet{
18   - height: 400px;
19   - width: 40%;
20   - margin: 40px;
21   - }
22   -
23   - #showVisualization{
24   - background-color: #2196F3;
25   - color: #ffffff;
26   - margin-left: 50px;
27   - }
28   -
29   -
30   - #datalet_placeholder{
31   - height: 400px;
32   - width: 40%;
33   - margin: 40px;/
34   - }
35   -
36   - #doc{
37   - height: 400px;
38   - width: 100%;
39   - }
40   - </style>
41   -
42   - <script>
43   -
44   - getData = function()
45   - {
46   - var sheet = document.querySelector('google-sheets');
47   -
48   - sheet.addEventListener('google-sheet-data', function(e)
49   - {
50   - var data = [];
51   - //get the keys
52   - for(var key in this.rows[0]) {
53   - if (key.match(/gsx\$*/)) {
54   - data.push({name: key.replace("gsx$", ""), data: []});
55   - }
56   - }
57   - //fill the structure with values
58   - for(var row in this.rows){
59   - var i = 0;
60   - for(var key in this.rows[row]){
61   - if(key.match(/gsx\$*/)){
62   - data[i++].data.push(this.rows[row][key].$t.replace("'",""));
63   - }
64   - }
65   -
66   - }
67   -
68   - $("#datalet_placeholder").html('<linechart-datalet ' +
69   - 'data-url="https://docs.google.com/spreadsheets/d/1EYJ88pOsbc0GkUTTdPhuReUjHewk1fhis9VZBXes_Ao" ' +
70   - //'fields=\'[]\'' +
71   - 'title="Google spreadsheet realtime data visualization"' +
72   - 'data=\'' + JSON.stringify(data) + '\'>' +
73   - '</linechart-datalet>');
74   -
75   - $("#spreadsheet_url").html('<a href="' + this.openInGoogleDocsUrl + '" target="_blank">' + this.openInGoogleDocsUrl + '</a>');
76   -
77   - });
78   -
79   - sheet.addEventListener('error', function(e) {
80   - // e.detail.response
81   - });
82   -
83   - }
84   -
85   - refresh = function(){
86   - $("#sheet-component").html('<google-sheets key="1EYJ88pOsbc0GkUTTdPhuReUjHewk1fhis9VZBXes_Ao" published></google-sheets>');
87   - getData();
88   - }
89   -
90   - $( document ).ready(function() {
91   - getData();
92   - });
93   -
94   - </script>
95   -
96   -</head>
97   -<body is="dom-bind">
98   - <div class="layout vertical">
99   - <div class="layout vertical">
100   - <div class="layout horizontal" style="width: 100%;">
101   - <h1>Google Spreadsheet realtime visualization with Datalet</h1>
102   - <paper-fab id="showVisualization" icon="refresh" onClick="refresh()"></paper-fab>
103   - </div>
104   - <div class="layout horizontal" style="width: 100%;">
105   - <h3 id="spreadsheet_url"></h3>
106   - </div>
107   - <div class="layout horizontal">
108   - <iframe id="sheet" src="https://docs.google.com/spreadsheets/d/1EYJ88pOsbc0GkUTTdPhuReUjHewk1fhis9VZBXes_Ao/edit?usp=sharing?embedded=true"></iframe>
109   - <div id="datalet_placeholder"></div>
110   - </div>
111   - </div>
112   -
113   - <div class="layout vertical">
114   - <h1 style="width: 100%;margin-top: 100px;">Google Docs realtime visualization with Datalet</h1>
115   - <iframe id="doc" src="https://docs.google.com/document/d/1IIfmqTGBpTkEMHPnuxJeoOJI3u-8wQu9dkf49X2T6SE/edit?usp=sharing?embedded=true"></iframe>
116   - </div>
117   - </div>
118   -
119   - <div id="sheet-component">
120   - <google-sheets key="1EYJ88pOsbc0GkUTTdPhuReUjHewk1fhis9VZBXes_Ao" published></google-sheets>
121   - </div>
122   -
123   -</body>
124   -</html>
125 0 \ No newline at end of file
datalets/treemap-datalet/treemap-datalet.png 100755 โ†’ 100644
View file @cc0a012

1.58 KB | W: | H:

515 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
locales/controllet_ln.js
  View file @cc0a012
... ... @@ -52,9 +52,9 @@ ln[&quot;barchart_stacked_en&quot;] = &quot;Stacked Bar&quot;;
52 52 ln["columnchart_stacked_en"] = "Stacked Column";
53 53 ln["areachart_stacked_en"] = "Stacked Area";
54 54 ln["piechart_en"] = "Pie";
55   -//ln["scatterchart_en"] = "Scatter";
56   -//ln["bubblechart_en"] = "Bubble";
57   -//ln["treemap_en"] = "Tree Map";
  55 +ln["scatterchart_en"] = "Scatter";
  56 +ln["bubblechart_en"] = "Bubble";
  57 +ln["treemap_en"] = "Tree Map";
58 58 ln["leafletjs_en"] = "Map";
59 59  
60 60 //inputs
... ... @@ -74,13 +74,16 @@ ln[&quot;FIRST_en&quot;] = &quot;FIRST of&quot;;
74 74 ln["LAST_en"] = "LAST of";
75 75  
76 76 ln["XAxis_en"] = "X AXIS";
77   -ln["YAxis_en"] = "Y AXIS (numeric)";
  77 +ln["YAxis_en"] = "Y AXIS";
  78 +ln["numericXAxis_en"] = "X AXIS (numeric)";
  79 +ln["numericYAxis_en"] = "Y AXIS (numeric)";
78 80 ln["Column_en"] = "COLUMN";
79 81 ln["SliceLabels_en"] = "LABELS";
80 82 ln["SliceSizes_en"] = "SIZES (numeric)";
81 83 ln["Latitude_en"] = "LATITUDE";
82 84 ln["Longitude_en"] = "LONGITUDE";
83 85 ln["BalloonContent_en"] = "BALLOON CONTENT";
  86 +ln["Categories_en"] = "CATEGORIES";
84 87  
85 88 //options
86 89 ln["title_en"] = "Title"
... ...
locales/datasetexplorer_ln.js
  View file @cc0a012
... ... @@ -3,47 +3,47 @@ datasetexplorer_ln = [];
3 3 /*EN*/
4 4 datasetexplorer_ln["ode+back_en"] = "<< Click to navigate back to the top level.";
5 5  
6   -datasetexplorer_ln["openwall+provider_1_en"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
7   -datasetexplorer_ln["openwall+provider_2_en"] = "data.issy.com (from OpenDataSoft France)";
8   -datasetexplorer_ln["openwall+provider_3_en"] = "Open data Regione Lazio (Italy)";
9   -datasetexplorer_ln["openwall+provider_4_en"] = "data.gov.uk (UK)";
10   -datasetexplorer_ln["openwall+provider_5_en"] = "Dataportaal van de Nederlandse overheid (Netherland)";
11   -datasetexplorer_ln["openwall+provider_6_en"] = "French Open Data Portal (France)";
12   -datasetexplorer_ln["openwall+provider_7_en"] = "Ireland\\'s Open Data Portal (Ireland)";
13   -datasetexplorer_ln["openwall+provider_8_en"] = "TET v.0.1 @ Galway (Ireland)";
  6 +//datasetexplorer_ln["openwall+provider_1_en"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
  7 +//datasetexplorer_ln["openwall+provider_2_en"] = "data.issy.com (from OpenDataSoft France)";
  8 +//datasetexplorer_ln["openwall+provider_3_en"] = "Open data Regione Lazio (Italy)";
  9 +//datasetexplorer_ln["openwall+provider_4_en"] = "data.gov.uk (UK)";
  10 +//datasetexplorer_ln["openwall+provider_5_en"] = "Dataportaal van de Nederlandse overheid (Netherland)";
  11 +//datasetexplorer_ln["openwall+provider_6_en"] = "French Open Data Portal (France)";
  12 +//datasetexplorer_ln["openwall+provider_7_en"] = "Ireland\\'s Open Data Portal (Ireland)";
  13 +//datasetexplorer_ln["openwall+provider_8_en"] = "TET v.0.1 @ Galway (Ireland)";
14 14  
15 15 /*IT*/
16 16 datasetexplorer_ln["ode+back_it"] = "<< Clicca qui per tornare al livello precedente.";
17 17  
18   -datasetexplorer_ln["openwall+provider_1_it"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
19   -datasetexplorer_ln["openwall+provider_2_it"] = "data.issy.com (from OpenDataSoft France)";
20   -datasetexplorer_ln["openwall+provider_3_it"] = "Open data Regione Lazio (Italy)";
21   -datasetexplorer_ln["openwall+provider_4_it"] = "data.gov.uk (UK)";
22   -datasetexplorer_ln["openwall+provider_5_it"] = "Dataportaal van de Nederlandse overheid (Netherland)";
23   -datasetexplorer_ln["openwall+provider_6_it"] = "French Open Data Portal (France)";
24   -datasetexplorer_ln["openwall+provider_7_it"] = "Ireland\\'s Open Data Portal (Ireland)";
25   -datasetexplorer_ln["openwall+provider_8_it"] = "TET v.0.1 @ Galway (Ireland)";
  18 +//datasetexplorer_ln["openwall+provider_1_it"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
  19 +//datasetexplorer_ln["openwall+provider_2_it"] = "data.issy.com (from OpenDataSoft France)";
  20 +//datasetexplorer_ln["openwall+provider_3_it"] = "Open data Regione Lazio (Italy)";
  21 +//datasetexplorer_ln["openwall+provider_4_it"] = "data.gov.uk (UK)";
  22 +//datasetexplorer_ln["openwall+provider_5_it"] = "Dataportaal van de Nederlandse overheid (Netherland)";
  23 +//datasetexplorer_ln["openwall+provider_6_it"] = "French Open Data Portal (France)";
  24 +//datasetexplorer_ln["openwall+provider_7_it"] = "Ireland\\'s Open Data Portal (Ireland)";
  25 +//datasetexplorer_ln["openwall+provider_8_it"] = "TET v.0.1 @ Galway (Ireland)";
26 26  
27 27 /*FR*/
28 28 datasetexplorer_ln["ode+back_fr"] = "<< Click to navigate back to the top level.";
29 29  
30   -datasetexplorer_ln["openwall+provider_1_fr"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
31   -datasetexplorer_ln["openwall+provider_2_fr"] = "data.issy.com (from OpenDataSoft France)";
32   -datasetexplorer_ln["openwall+provider_3_fr"] = "Open data Regione Lazio (Italy)";
33   -datasetexplorer_ln["openwall+provider_4_fr"] = "data.gov.uk (UK)";
34   -datasetexplorer_ln["openwall+provider_5_fr"] = "Dataportaal van de Nederlandse overheid (Netherland)";
35   -datasetexplorer_ln["openwall+provider_6_fr"] = "French Open Data Portal (France)";
36   -datasetexplorer_ln["openwall+provider_7_fr"] = "Ireland\\'s Open Data Portal (Ireland)";
37   -datasetexplorer_ln["openwall+provider_8_fr"] = "TET v.0.1 @ Galway (Ireland)";
  30 +//datasetexplorer_ln["openwall+provider_1_fr"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
  31 +//datasetexplorer_ln["openwall+provider_2_fr"] = "data.issy.com (from OpenDataSoft France)";
  32 +//datasetexplorer_ln["openwall+provider_3_fr"] = "Open data Regione Lazio (Italy)";
  33 +//datasetexplorer_ln["openwall+provider_4_fr"] = "data.gov.uk (UK)";
  34 +//datasetexplorer_ln["openwall+provider_5_fr"] = "Dataportaal van de Nederlandse overheid (Netherland)";
  35 +//datasetexplorer_ln["openwall+provider_6_fr"] = "French Open Data Portal (France)";
  36 +//datasetexplorer_ln["openwall+provider_7_fr"] = "Ireland\\'s Open Data Portal (Ireland)";
  37 +//datasetexplorer_ln["openwall+provider_8_fr"] = "TET v.0.1 @ Galway (Ireland)";
38 38  
39 39 /*NL*/
40   -datasetexplorer_ln["ode+back_en"] = "<< Click to navigate back to the top level.";
41   -
42   -datasetexplorer_ln["openwall+provider_1_nl"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
43   -datasetexplorer_ln["openwall+provider_2_nl"] = "data.issy.com (from OpenDataSoft France)";
44   -datasetexplorer_ln["openwall+provider_3_nl"] = "Open data Regione Lazio (Italy)";
45   -datasetexplorer_ln["openwall+provider_4_nl"] = "data.gov.uk (UK)";
46   -datasetexplorer_ln["openwall+provider_5_nl"] = "Dataportaal van de Nederlandse overheid (Netherland)";
47   -datasetexplorer_ln["openwall+provider_6_nl"] = "French Open Data Portal (France)";
48   -datasetexplorer_ln["openwall+provider_7_nl"] = "Ireland\\'s Open Data Portal (Ireland)";
49   -datasetexplorer_ln["openwall+provider_8_nl"] = "TET v.0.1 @ Galway (Ireland)";
  40 +datasetexplorer_ln["ode+back_nl"] = "<< Click to navigate back to the top level.";
  41 +
  42 +//datasetexplorer_ln["openwall+provider_1_nl"] = "Example CKAN with data from out pilots (Pratos - Groiningen - Den Haag)";
  43 +//datasetexplorer_ln["openwall+provider_2_nl"] = "data.issy.com (from OpenDataSoft France)";
  44 +//datasetexplorer_ln["openwall+provider_3_nl"] = "Open data Regione Lazio (Italy)";
  45 +//datasetexplorer_ln["openwall+provider_4_nl"] = "data.gov.uk (UK)";
  46 +//datasetexplorer_ln["openwall+provider_5_nl"] = "Dataportaal van de Nederlandse overheid (Netherland)";
  47 +//datasetexplorer_ln["openwall+provider_6_nl"] = "French Open Data Portal (France)";
  48 +//datasetexplorer_ln["openwall+provider_7_nl"] = "Ireland\\'s Open Data Portal (Ireland)";
  49 +//datasetexplorer_ln["openwall+provider_8_nl"] = "TET v.0.1 @ Galway (Ireland)";
... ...