Google charts api - joining 3 json strings using google.visualization.data.join - json

I want to parse 3 separate data sets to my chart.draw() function. I've read that this is not possible so I must use the google.visualization.data.join() function to join them together. How ever I seem to be having trouble joining 3 json strings.I've tried this (as the function only takes two variables):
var joinedData1 = google.visualization.data.join(json1, json2, 'full', [[0, 0]], [1], [1]);
var joinedData2 = google.visualization.data.join(joinedData1, json3, 'full', [[0, 0]], [1], [1]);
But when I draw the chart it seems to only draw the lines of "json1" and "json3".
How can I draw the 3 lines from separate datasets?
Any help would be really appreciated.

I ran into the same issue but i'm not using JSON strings. The problem here is
google.visualization.data.join(dt1, dt2, joinMethod, keys, dt1Columns, dt2Columns);
You have mentioned only one column of dt1(joinedData1) so only the first column of the joinedData1 is joined with json3
Current:-
var joinedData1 = google.visualization.data.join(json1, json2, 'full', [[0, 0]], [1], [1]);
var joinedData2 = google.visualization.data.join(joinedData1, json3, 'full', [[0, 0]], [1], [1]);
To be changed :-
var joinedData2 = google.visualization.data.join(joinedData1, json3, 'full', [[0, 0]], **[1,2]**, [1]);

Related

Highstock data input with csvURL only allows a limited number of rows

I want to import data in a highstock chart per csvURL and the chart works fine up to 250 rows: https://jsfiddle.net/Joh_Christ/qx6gad34/1/
data: {
csvURL: 'https://www.quandl.com/api/v3/datasets/FSE/VOW3_X.csv?api_key=FaKetdwzkQQPhX91Xrhx',
switchRowsAndColumns: false,
firstRowAsNames: true,
startRow: 0,
endRow: 250,
seriesMapping: [{
x: 0,
y: 4
},
{},
{},
{}]
}
When I increase the number of rows, nothing is displayed: https://jsfiddle.net/Joh_Christ/qx6gad34/4/
How can I show the total number of rows from the csv file?
In both charts you have Highcharts error #15:
Highcharts expects data to be sorted
This happens when creating a line
series or a stock chart where the data is not sorted in ascending X
order.
For performance reasons, Highcharts does not sort the data, instead it
requires that the implementer pre-sorts the data.
The difference is that in the second chart cropThreshold property is exceeded and that is why the series is not displayed.
API Reference: https://api.highcharts.com/highstock/series.line.cropThreshold

what is the best way to zip multiple lists in ImmutableJS

Assume i have a List of Lists. e.g:
const l : List<List<number>> = fromJS([[0,1,2,3],[4,5,6,7],[8,9,10,11]])
what is the best way (without using toJS()) to zip "l" so i'll get:
[[0,4,8],[1,5,9],[2,6,10],[3,7,11]]
I believe you want to use List#zip.
const l = Immutable.fromJS([
[0, 1, 2, 3],
[4, 5, 6, 7],
[8, 9, 10, 11]
]);
const zipped = l.get(0).zip(...l.rest());
console.log(zipped);
// [ [0,4,8], [1,5,9], [2,6,10], [3,7,11] ];
<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/4.0.0-rc.9/immutable.js"></script>
Note that this returns a list of Arrays. It's easy enough to turn them into Lists though:
const zippedLists = zipped.map(List);
You might also be interested in List#zipAll if you're zipping lists of different sizes.

OpenLayers 3: Geometric filters in method WFS GetFeature

OpenLayers 2 could generate geometric filter method WFS GetFeature.
Example JS:
var filter = new OpenLayers.Filter.Spatial({ type: OpenLayers.Filter.Spatial.INTERSECTS, value: geometry, projection: "EPSG:3067" });
var parser = new OpenLayers.Format.Filter.v1_1_0();
var filterAsXml = parser.write(filter);
var xml = new OpenLayers.Format.XML();
var filterAsString = xml.write( filterAsXml );
Example XML:
<wfs:GetFeature
xmlns:wfs="http://www.opengis.net/wfs"
service="WFS"
version="1.1.0"
outputFormat="json"
xsi:schemaLocation="http://www.opengis.net/wfs
http://schemas.opengis.net/wfs/1.1.0/wfs.xsd"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<wfs:Query typeName="LiVi:LIIKENNE_ELEMENTTI" srsName="EPSG:3067" xmlns:LiVi="http://site.ru/">
<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">
<ogc:Intersects>
<ogc:PropertyName>GEOMETRY</ogc:PropertyName>
<gml:Polygon xmlns:gml="http://www.opengis.net/gml" srsName="EPSG:3067">
<gml:exterior>
<gml:LinearRing>
<gml:posList>308082.07106781186 6833724.928932188 308082.07106781186 6833739.071067812 308067.92893218814 6833739.071067812 308067.92893218814 6833724.928932188 308082.07106781186 6833724.928932188</gml:posList>
</gml:LinearRing>
</gml:exterior>
</gml:Polygon>
</ogc:Intersects>
</ogc:Filter>
</wfs:Query>
</wfs:GetFeature>
They have a not working example:
var f = ol.format.wfs.filter;
var request = new ol.format.WFS().writeGetFeature({
srsName: 'urn:ogc:def:crs:EPSG::4326',
featureNS: 'http://www.openplans.org/topp',
featurePrefix: 'topp',
featureTypes: ['states'],
filter: f.and(
f.bbox('the_geom', [1, 2, 3, 4], 'urn:ogc:def:crs:EPSG::4326'),
f.like('name', 'New*')
)
});
Either he recently appeared... Judging by the projection - a blank for WFS 2.0.0.
How do I write a geometric filter in the OL3?
PS2
Sorry for my English.
There is a typo in the OpenLayers documentation, which will be fixed with https://github.com/openlayers/ol3/pull/5653.
To make the example work, change ol.format.wfs.filter to ol.format.ogc.filter:
var f = ol.format.ogc.filter;
var request = new ol.format.WFS().writeGetFeature({
srsName: 'urn:ogc:def:crs:EPSG::4326',
featureNS: 'http://www.openplans.org/topp',
featurePrefix: 'topp',
featureTypes: ['states'],
filter: f.and(
f.bbox('the_geom', [1, 2, 3, 4], 'urn:ogc:def:crs:EPSG::4326'),
f.like('name', 'New*')
)
});
However, the only geometry-like filter OpenLayers supports is BBOX. Other geometry filters, like the one in your WFS XML above, are not supported by OpenLayers 3. If you need full OGC filter support, you may want to have a look at https://github.com/highsource/ogc-schemas, which provides (among others) OGC filter bindings for Jsonix.

Bar chart with two series of different date/values ranges

I am using jqplot through Primefaces and Have input to Bar Chart like this:
Series 1:
label: "Company 1"
data: {"01-05-2015": 10, "06-05-2015": 3}
Series 2:
label: "Company 2"
data: {"03-05-2015": 10, "06-05-2015": 3}
When I pass this data as BarChartModel, I got data wrongly drawn on the chart.
The data follows the first series, as the Series 2 is drawn after the Series 1 dates. I've to convert the data to be as follows in order to get the chart drawn fine:
Series 1:
label: "Company 1"
data: {"01-05-2015": 10, *"03-05-2015": 0*, "06-05-2015": 3}
Series 2:
label: "Company 2"
data: { *"01-05-2015": 0* , "03-05-2015": 10, "06-05-2015": 3}
Notice the data items between * and *.
Any advice here? (if using DateAxis helps?)
I had the same problem with LinearChartModel when I has not using DateAxis.
As a workaround, I filled my series with all possible data and then reordered the list. Urg!
Should work with BarChartModel too.
Using DateAxis you just need to add your date axis with the timestamp, like this:
serie.set(new Date().getTime(), new Double(123));
or this
serie.set("2015-09-08", new Double(123));
Put the DateAxis in your LineChartModel like this:
DateAxis axis = new DateAxis("Data da inspeção");
linearModel.setZoom(true);
linearModel.getAxes().put(AxisType.X, axis);
linearModel.setExtender("linhaSetor");
And format your date in the extender.js:
function linhaSetor() {
this.cfg.axes.xaxis.tickOptions = {
show : true,
angle : 45,
formatString : '%d/%m/%y %Hh'
};
}
You don't even need to put the data in order.

How to get only unique values of a 2d array

I need to get the following 2d array from:
[[Option 10, 2.0], [Option 10, 2.0], [Option 9, 1.0], [Option 7, 1.0]]
to
[[Option 10, 2.0], [Option 9, 1.0], [Option 7, 1.0]]
I found this post (Splitting a 2D array using some() , by date, avoiding duplicates. Just want 1 unique email, not row. Where am i wrong here?) that has a very efficient way of getting unique values, but I cannot figure out how to apply it to my situation.
Your use case is simpler than the one you refer to.
try this for example :
function myFunction() {
var source = [['Option 10', 2], ['Option 10', 2], ['Option 9', 1], ['Option 7', 1]];
var dest = [];
dest.push(source[0]);
for(var n = 1 ; n< source.length ; n++){
if(dest.join().indexOf(source[n].join()) == -1){dest.push(source[n])};
}
Logger.log(dest);
}
Because 'unique' is not always simple to describe, I often use a pattern which is is, in effect, a variation of Serge's correct answer using ES5 array map/filter functions.
An edited version:
function hash(arr) {
// in this case the hash method is the same as Serge's Array.join() method,
but could be customised to suit whatever condition you need to generate
bespoke comparators such as where `1 + 3` should match `2 + 2`, or where
particular columns in the array can be omitted
return arr.join();
}
function myFunction() {
var source = [['Option 10', 2], ['Option 10', 2], ['Option 9', 1], ['Option 7', 1]];
var hash = source.map(
function (row) {
return hash(row);
}
);
source = source.filter(
function (filterRow, i) {
return hash.slice(0, i).indexOf(hash(filterRow)) < 0;
}
);
Logger.log(source);
}
I only include this as there are times when your comparison may need to flex a little. In your example this isn't important which is why Serge's is correct, but I share to show a potential expansion food for thought for when unique needs to be 'tweaked'