Commit cc0a0122aef563d2bd08eab0c009e63f2fe343aa

Authored by Renato De Donato
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
... ... @@ -80,10 +80,6 @@ Example:
80 80 min: 0,
81 81 title: {
82 82 text: this._component.yAxisLabel,
83   - align: 'high'
84   - },
85   - labels: {
86   - overflow: 'justify'
87 83 }
88 84 },
89 85 tooltip: {
... ...
datalets/areachart_stacked-datalet/areachart_stacked-datalet.html
... ... @@ -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
... ... @@ -80,10 +80,6 @@ Example:
80 80 min: 0,
81 81 title: {
82 82 text: this._component.xAxisLabel,
83   - align: 'high'
84   - },
85   - labels: {
86   - overflow: 'justify'
87 83 }
88 84 },
89 85 tooltip: {
... ...
datalets/bubble3d-datalet/bubble3d-datalet.html deleted
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

11.9 KB | W: | H:

790 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
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&amp;limit=10000"
17   - fields='["result,records,Lat","result,records,Lng"]'></column3Dchart-datalet>
18   -
19   -</body>
20   -</html>
21 0 \ No newline at end of file
datalets/column3Dchart-datalet/docs.html deleted
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
... ... @@ -82,10 +82,6 @@ Example:
82 82 min: 0,
83 83 title: {
84 84 text: this._component.yAxisLabel,
85   - align: 'high'
86   - },
87   - labels: {
88   - overflow: 'justify'
89 85 }
90 86 },
91 87 // tooltip: {
... ...
datalets/columnchart_stacked-datalet/columnchart_stacked-datalet.html
... ... @@ -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
... ... @@ -79,10 +79,6 @@ Example:
79 79 min: 0,
80 80 title: {
81 81 text: this._component.yAxisLabel,
82   - align: 'high'
83   - },
84   - labels: {
85   - overflow: 'justify'
86 82 }
87 83 },
88 84 tooltip: {
... ...
datalets/piechart-datalet/piechart-datalet.png

788 Bytes | W: | H:

747 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
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: ""