Commit cc0a0122aef563d2bd08eab0c009e63f2fe343aa
1 parent
db65a851
new scatter + datalets bug fix
Showing
37 changed files
with
118 additions
and
1155 deletions
controllets/items-vslider-controllet/items-vslider-controllet.html
... | ... | @@ -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
... | ... | @@ -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
... | ... | @@ -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
... | ... | @@ -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
... | ... | @@ -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
datalets/areachart_stacked-datalet/areachart_stacked-datalet.html
... | ... | @@ -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
datalets/bubble3d-datalet/bubble3d-datalet.html deleted
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
15.8 KB
datalets/bubble3d-datalet/bubble3d-datalet.xml deleted
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
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
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
datalets/column3Dchart-datalet/column3Dchart-datalet.html deleted
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
99 KB
datalets/column3Dchart-datalet/demo/index.html deleted
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&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
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
datalets/columnchart_stacked-datalet/columnchart_stacked-datalet.html
... | ... | @@ -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
... | ... | @@ -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
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
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
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
26.4 KB
datalets/donutpie3dchart-datalet/donutpie3dchart-datalet.xml deleted
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
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
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
... | ... | @@ -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
datalets/piechart-datalet/piechart-datalet.png
datalets/scatterchart-datalet/scatterchart-datalet.html
... | ... | @@ -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
datalets/test-google-components/test.html deleted
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
locales/controllet_ln.js
... | ... | @@ -52,9 +52,9 @@ ln["barchart_stacked_en"] = "Stacked Bar"; |
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["FIRST_en"] = "FIRST of"; |
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
... | ... | @@ -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)"; | ... | ... |