SGH / 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,7 +69,8 @@
69 padding: 8px; 69 padding: 8px;
70 width: 124px; 70 width: 124px;
71 color: #000000; 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 z-index: 1; 74 z-index: 1;
74 font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif; 75 font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
75 font-size: 16px; 76 font-size: 16px;
@@ -79,7 +80,9 @@ @@ -79,7 +80,9 @@
79 80
80 .legend.selected { 81 .legend.selected {
81 background-color: #2196F3; 82 background-color: #2196F3;
  83 + /*background-color: rgba(33, 150, 243, 0.8);*/
82 color: #FFFFFF; 84 color: #FFFFFF;
  85 +
83 } 86 }
84 87
85 #items_vslider_search{ 88 #items_vslider_search{
@@ -225,8 +228,8 @@ @@ -225,8 +228,8 @@
225 for(var i=0; i < this.datalets.length; i++){ 228 for(var i=0; i < this.datalets.length; i++){
226 var datalet = this.datalets[i]; 229 var datalet = this.datalets[i];
227 var imageName = this._getChartName(datalet.imageName).toLowerCase(); 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 if(imageName.indexOf(this.filter.toLowerCase()) > -1) 233 if(imageName.indexOf(this.filter.toLowerCase()) > -1)
231 datalets.push(datalet); 234 datalets.push(datalet);
232 } 235 }
controllets/select-visualization-controllet/demo/index.html
  View file @cc0a012
@@ -20,7 +20,8 @@ @@ -20,7 +20,8 @@
20 20
21 <body> 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 <!--<select-datalet-inputs_series></select-datalet-inputs_series>--> 25 <!--<select-datalet-inputs_series></select-datalet-inputs_series>-->
25 <!--<select-datalet-options></select-datalet-options>--> 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,7 +272,7 @@
272 272
273 this.async(function () { 273 this.async(function () {
274 //reset ddl 274 //reset ddl
275 - var ddls = document.getElementsByTagName("paper-dropdown-menu"); 275 + var ddls = this.$.inputs_container.getElementsByTagName("paper-dropdown-menu");
276 for (var i = 0; i < ddls.length; i++) 276 for (var i = 0; i < ddls.length; i++)
277 $(ddls[i]).find("paper-menu")[0].select(-1); 277 $(ddls[i]).find("paper-menu")[0].select(-1);
278 this.$.group_by.setAttribute("disabled", ""); 278 this.$.group_by.setAttribute("disabled", "");
controllets/select-visualization-controllet/select-datalet-inputs_series.html
  View file @cc0a012
@@ -108,7 +108,7 @@ @@ -108,7 +108,7 @@
108 <paper-dropdown-menu id="group_by" disabled> 108 <paper-dropdown-menu id="group_by" disabled>
109 <paper-menu class="dropdown-content"> 109 <paper-menu class="dropdown-content">
110 <template is="dom-repeat" items={{groupableFields}}> 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 </template> 112 </template>
113 </paper-menu> 113 </paper-menu>
114 </paper-dropdown-menu> 114 </paper-dropdown-menu>
@@ -237,7 +237,7 @@ @@ -237,7 +237,7 @@
237 237
238 this.async(function () { 238 this.async(function () {
239 //reset ddl 239 //reset ddl
240 - var ddls = document.getElementsByTagName("paper-dropdown-menu"); 240 + var ddls = this.$.inputs_series_container.getElementsByTagName("paper-dropdown-menu");
241 for (var i = 0; i < ddls.length; i++) 241 for (var i = 0; i < ddls.length; i++)
242 $(ddls[i]).find("paper-menu")[0].select(-1); 242 $(ddls[i]).find("paper-menu")[0].select(-1);
243 this.$.group_by.setAttribute("disabled", ""); 243 this.$.group_by.setAttribute("disabled", "");
@@ -310,6 +310,17 @@ @@ -310,6 +310,17 @@
310 this._setAggregators(); 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 _setAggregators : function(){ 324 _setAggregators : function(){
314 this.async(function() { 325 this.async(function() {
315 this.aggregators = []; 326 this.aggregators = [];
controllets/select-visualization-controllet/select-datalet-options.html
  View file @cc0a012
@@ -197,12 +197,13 @@ @@ -197,12 +197,13 @@
197 197
198 setOptions : function(options) { 198 setOptions : function(options) {
199 this.options = []; 199 this.options = [];
  200 + this.params = [];
200 this.async(function() { 201 this.async(function() {
201 this.options = options; 202 this.options = options;
202 }, 0); 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 ceckOptions : function(options) { 209 ceckOptions : function(options) {
datalets/areachart-datalet/areachart-datalet.html
  View file @cc0a012
@@ -80,10 +80,6 @@ Example: @@ -80,10 +80,6 @@ Example:
80 min: 0, 80 min: 0,
81 title: { 81 title: {
82 text: this._component.yAxisLabel, 82 text: this._component.yAxisLabel,
83 - align: 'high'  
84 - },  
85 - labels: {  
86 - overflow: 'justify'  
87 } 83 }
88 }, 84 },
89 tooltip: { 85 tooltip: {
datalets/areachart_stacked-datalet/areachart_stacked-datalet.html
  View file @cc0a012
@@ -73,13 +73,13 @@ Example: @@ -73,13 +73,13 @@ Example:
73 xAxis: { 73 xAxis: {
74 categories: this.properties.categories.value, 74 categories: this.properties.categories.value,
75 title: { 75 title: {
76 - text: this._component.yAxisLabel 76 + text: this._component.xAxisLabel
77 } 77 }
78 }, 78 },
79 yAxis: { 79 yAxis: {
80 min: 0, 80 min: 0,
81 title: { 81 title: {
82 - text: this._component.xAxisLabel, 82 + text: this._component.yAxisLabel,
83 }, 83 },
84 }, 84 },
85 tooltip: { 85 tooltip: {
datalets/barchart-datalet/barchart-datalet.html
  View file @cc0a012
@@ -80,10 +80,6 @@ Example: @@ -80,10 +80,6 @@ Example:
80 min: 0, 80 min: 0,
81 title: { 81 title: {
82 text: this._component.xAxisLabel, 82 text: this._component.xAxisLabel,
83 - align: 'high'  
84 - },  
85 - labels: {  
86 - overflow: 'justify'  
87 } 83 }
88 }, 84 },
89 tooltip: { 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 \ No newline at end of file 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 \ No newline at end of file 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 \ No newline at end of file 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 \ No newline at end of file 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 \ No newline at end of file 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 \ No newline at end of file 0 \ No newline at end of file
datalets/columnchart-datalet/columnchart-datalet.html
  View file @cc0a012
@@ -82,10 +82,6 @@ Example: @@ -82,10 +82,6 @@ Example:
82 min: 0, 82 min: 0,
83 title: { 83 title: {
84 text: this._component.yAxisLabel, 84 text: this._component.yAxisLabel,
85 - align: 'high'  
86 - },  
87 - labels: {  
88 - overflow: 'justify'  
89 } 85 }
90 }, 86 },
91 // tooltip: { 87 // tooltip: {
datalets/columnchart_stacked-datalet/columnchart_stacked-datalet.html
  View file @cc0a012
@@ -73,13 +73,13 @@ Example: @@ -73,13 +73,13 @@ Example:
73 xAxis: { 73 xAxis: {
74 categories: this.properties.categories.value, 74 categories: this.properties.categories.value,
75 title: { 75 title: {
76 - text: this._component.yAxisLabel 76 + text: this._component.xAxisLabel
77 } 77 }
78 }, 78 },
79 yAxis: { 79 yAxis: {
80 min: 0, 80 min: 0,
81 title: { 81 title: {
82 - text: this._component.xAxisLabel, 82 + text: this._component.yAxisLabel,
83 }, 83 },
84 }, 84 },
85 tooltip: { 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,6 +50,7 @@ function build2(root, meta, place_holder, select_listener, width, height) {
50 var data = ["top", "", "#000000", "", "", "", ""]; 50 var data = ["top", "", "#000000", "", "", "", ""];
51 //data[3] = OW.getLanguageText('ode', 'back'); 51 //data[3] = OW.getLanguageText('ode', 'back');
52 data[3] = datasetexplorer_ln["ode+back_"+datasetexplorer_ln["ln"]]; 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 return "showTooltip(evt, '" + data + "')"; 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 \ No newline at end of file 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 \ No newline at end of file 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 \ No newline at end of file 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,7 +200,7 @@ Example:
200 */ 200 */
201 ready: function(){ 201 ready: function(){
202 this.behavior = $.extend(true, {}, HighchartsComponentBehavior, HeatMapBehavior); 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 </script> 206 </script>
datalets/linechart-datalet/linechart-datalet.html
  View file @cc0a012
@@ -79,10 +79,6 @@ Example: @@ -79,10 +79,6 @@ Example:
79 min: 0, 79 min: 0,
80 title: { 80 title: {
81 text: this._component.yAxisLabel, 81 text: this._component.yAxisLabel,
82 - align: 'high'  
83 - },  
84 - labels: {  
85 - overflow: 'justify'  
86 } 82 }
87 }, 83 },
88 tooltip: { 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,91 +62,58 @@ Example:
62 * @method presentData 62 * @method presentData
63 */ 63 */
64 presentData: function(){ 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 chart: { 90 chart: {
116 type: 'scatter', 91 type: 'scatter',
117 zoomType: 'xy' 92 zoomType: 'xy'
118 }, 93 },
119 title: { 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 credits: { 107 credits: {
146 enabled: false 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,35 +121,22 @@ Example:
154 scatterchartDatalet = Polymer({ 121 scatterchartDatalet = Polymer({
155 is: 'scatterchart-datalet', 122 is: 'scatterchart-datalet',
156 properties: { 123 properties: {
157 - /**  
158 - * It's the label for X axis  
159 - *  
160 - * @attribute xAxisLabel  
161 - * @type String  
162 - * @default ''  
163 - */  
164 xAxisLabel: { 124 xAxisLabel: {
165 type: String, 125 type: String,
166 value: "" 126 value: ""
167 }, 127 },
168 - /**  
169 - * It's the label for Y axis  
170 - *  
171 - * @attribute yAxisLabel  
172 - * @type String  
173 - * @default ''  
174 - */  
175 yAxisLabel: { 128 yAxisLabel: {
176 type: String, 129 type: String,
177 value: "" 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 behavior : { 140 behavior : {
187 type : Object, 141 type : Object,
188 value : {} 142 value : {}
@@ -197,7 +151,7 @@ Example: @@ -197,7 +151,7 @@ Example:
197 */ 151 */
198 ready: function(){ 152 ready: function(){
199 this.behavior = $.extend(true, {}, HighchartsComponentBehavior, scatterchartBehavior); 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 </script> 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 \ No newline at end of file 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,9 +52,9 @@ ln[&quot;barchart_stacked_en&quot;] = &quot;Stacked Bar&quot;;
52 ln["columnchart_stacked_en"] = "Stacked Column"; 52 ln["columnchart_stacked_en"] = "Stacked Column";
53 ln["areachart_stacked_en"] = "Stacked Area"; 53 ln["areachart_stacked_en"] = "Stacked Area";
54 ln["piechart_en"] = "Pie"; 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 ln["leafletjs_en"] = "Map"; 58 ln["leafletjs_en"] = "Map";
59 59
60 //inputs 60 //inputs
@@ -74,13 +74,16 @@ ln[&quot;FIRST_en&quot;] = &quot;FIRST of&quot;; @@ -74,13 +74,16 @@ ln[&quot;FIRST_en&quot;] = &quot;FIRST of&quot;;
74 ln["LAST_en"] = "LAST of"; 74 ln["LAST_en"] = "LAST of";
75 75
76 ln["XAxis_en"] = "X AXIS"; 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 ln["Column_en"] = "COLUMN"; 80 ln["Column_en"] = "COLUMN";
79 ln["SliceLabels_en"] = "LABELS"; 81 ln["SliceLabels_en"] = "LABELS";
80 ln["SliceSizes_en"] = "SIZES (numeric)"; 82 ln["SliceSizes_en"] = "SIZES (numeric)";
81 ln["Latitude_en"] = "LATITUDE"; 83 ln["Latitude_en"] = "LATITUDE";
82 ln["Longitude_en"] = "LONGITUDE"; 84 ln["Longitude_en"] = "LONGITUDE";
83 ln["BalloonContent_en"] = "BALLOON CONTENT"; 85 ln["BalloonContent_en"] = "BALLOON CONTENT";
  86 +ln["Categories_en"] = "CATEGORIES";
84 87
85 //options 88 //options
86 ln["title_en"] = "Title" 89 ln["title_en"] = "Title"
locales/datasetexplorer_ln.js
  View file @cc0a012
@@ -3,47 +3,47 @@ datasetexplorer_ln = []; @@ -3,47 +3,47 @@ datasetexplorer_ln = [];
3 /*EN*/ 3 /*EN*/
4 datasetexplorer_ln["ode+back_en"] = "<< Click to navigate back to the top level."; 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 /*IT*/ 15 /*IT*/
16 datasetexplorer_ln["ode+back_it"] = "<< Clicca qui per tornare al livello precedente."; 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 /*FR*/ 27 /*FR*/
28 datasetexplorer_ln["ode+back_fr"] = "<< Click to navigate back to the top level."; 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 /*NL*/ 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)";