Highstock with datetime and multiple columns - javascript

I've been using HighCharts a lot in the past, but I don't remember how to render this kind of chart, with HighStocks:
I have a JSON like this:
[
{
timestamp: 'Sun Aug 16 2015 10:00:00 GMT+1000 (AEST)',
run: 2,
rest: 3
},
{
timestamp: 'Sun Aug 16 2015 10:01:00 GMT+1000 (AEST)',
run: 4,
rest: 1
},
{
timestamp: 'Sun Aug 16 2015 10:02:00 GMT+1000 (AEST)',
run: 2,
rest: 1
},
]
I would like to have a chart with two columns (run and rest) per timestamp. With HighStocks, so I can define my own scale with the mouse.
How can I write this in the chart configuration ?

To use Highstocks, you need to pass your date in milliseconds. So you can use (supposing we are looping through your JSON array):
var d = new Date(json[i].timestamp);
Then your series will have the format:
[d.getTime(), json[i].rest]
You can see a working JSFiddle here, which takes your json array as data.

Related

How to Update an object in an array

This is my Array
$scope.tooltipsArray = [
{
date: 2018-10-10T07:03:43.835Z,
text: 'name1'
},
{
date: 2018-09-29T18:30:00.000Z,
text: 'name2'
}
];
How can I update date to locale date format like this.
$scope.tooltipsArray = [
{
date: Wed Oct 10 2018 14:05:27 GMT+0530 (India Standard Time),
text: 'name1'
},
{
date: Sun Sep 30 2018 00:00:00 GMT+0530 (India Standard Time),
text: 'name2'
}
];
I have used map() to do that. But it does not work
var vector = $scope.tooltipsArray.map(function (el) { return new Date(el.date).toLocaleDateString(); });
Can anyone tell me how to do this from map() in JavaScript?
You can use the below code -
$scope.tooltipsArray = [
{
date: "2018-10-10T07:03:43.835Z",
text: 'name1'
},
{
date: "2018-09-29T18:30:00.000Z",
text: 'name2'
}
];
var vector = $scope.tooltipsArray.map(function(el) {return { 'date':new Date(el.date).toString(),'text':el.text}});
console.log(vector);
The output will be like below -
[
{date: "Wed Oct 10 2018 12:33:43 GMT+0530 (India Standard Time)", text: "name1"}
{date: "Sun Sep 30 2018 00:00:00 GMT+0530 (India Standard Time)", text: "name2"}
]
Why is there a .value key after tooltipsArray?
You assigned the array to tooltipsArray, so unless there's a Proxy involved, expect to access the array through $scope.tooltipsArray.
To fix it, just remove .value.
var vector = $scope.tooltipsArray.map(function (el) { return new Date(el.date).toLocaleDateString(); });
1- Remove .value why is there in the first place?
2- You need to change the date inside the object and then return el instead of date if you just want the date to be changed, likewise:
var vector = $scope.tooltipsArray.map(function(el) {
el.date = new Date(el.date).toLocaleDateString();
return el;
});
What map function does is going through array element one by one and run the callback function, so what you have to do is update the whole object or update one entry
el.date = new Date(el.date).toLocaleDateString();

Sorting array of objects based on multiple parameter (with one parameter as date) [duplicate]

This question already has answers here:
How to sort an array of objects by multiple fields?
(38 answers)
JavaScript sort array by multiple (number) fields
(3 answers)
Closed 5 years ago.
I have an array of JavaScript objects:
var objs = [
{ key: 10, date: Thu Nov 09 2017 22:30:08 GMT+0530 },
{ key: 10, date: Thu Oct 10 2017 22:30:08 GMT+0530 },
{ key: 20, date: Thu Dec 09 2017 22:30:08 GMT+0530 }
];
AND Trying to get the results like this
var objs = [
{ key: 20, date: Thu Dec 09 2017 22:30:08 GMT+0530 },
{ key: 10, date: Thu Oct 10 2017 22:30:08 GMT+0530 },
{ key: 10, date: Thu Nov 09 2017 22:30:08 GMT+0530 }
];
Array should sort based on both key and date, Key should sort based on descending order and date should sort based on ascending order if and only if key is same.
How I can achieve this?
Here date is the Date object, so need to consider date in millisecond not as string
To sort numbers in descending order, you would use a comparison function such as:
function (a, b) { return b - a; }
If you want a backup comparison, use || so that if the first comparison yields 0, you can use the backup comparison. To compare dates in ascending order, use a - b.
objs.sort(function (a, b) {
return b.key - a.key || a.date - b.date;
});

Manipulate JSON data into another object

I am trying to figure out how to manipulate my JSON data and create a separated object with the manipulated data.
To be more precise, I am using this JSON file: https://jsonblob.com/57a70ca4e4b0dc55a4eb1f73
I am trying to convert [dataset][data] into this format:
[Date.UTC(2013,5,2),0.7695],
[Date.UTC(2013,5,3),0.7648],
[Date.UTC(2013,5,4),0.7645],
[Date.UTC(2013,5,5),0.7638],
[Date.UTC(2013,5,6),0.7549]
So I need to use the fields [dataset][data][i][0] (Date) and [dataset][data][i][4] (Value) and somehow put it in a new JSON formatted object but I have no idea how to do it.
Someone can help me with this situation?
$(function () {
$.getJSON('json/AAPL.json', function (data) {
// Data manipulation into a new object??
});
});
This should do it:
$(function () {
$.getJSON('json/AAPL.json', function (data) {
var correctFormat = data.dataset.data.map(function(item) {
return [new Date(item[0]), item[4]];
});
});
});
Your problem is just map one :
You have an array of elements (arrays themselves) and you want to keep and modify just first and fifth element of each sub-array
So you can do it like this
var data = [
[
"2016-08-02",
106.05,
106.07,
104,
104.48,
32731069,
0,
1,
106.05,
106.07,
104,
104.48,
32731069
],
[
"2016-08-01",
104.41,
106.15,
104.41,
106.05,
37141424,
0,
1,
104.41,
106.15,
104.41,
106.05,
37141424
],
[
"2016-07-29",
104.19,
104.55,
103.68,
104.19,
27076805,
0,
1,
104.19,
104.55,
103.68,
104.19,
27076805
]
];
var result = data.map(x => [Date(x[0]), x[4]]);
console.log(result); // [ [ 'Sun Aug 07 2016 14:29:22 GMT+0200 (Paris, Madrid (heure d’été))',104.48 ],
// [ 'Sun Aug 07 2016 14:29:22 GMT+0200 (Paris, Madrid (heure d’été))',106.05 ],
// [ 'Sun Aug 07 2016 14:29:22 GMT+0200 (Paris, Madrid (heure d’été))',104.19 ] ]

How to ignore time-zone on new Date()?

I have JavaScript function called updateLatestDate that receive as parameter array of objects.
One of the properties of the object in array is the MeasureDate property of date type.
The function updateLatestDate returns the latest date existing in array.
Here is the function:
function updateLatestDate(sensorsData) {
return new Date(Math.max.apply(null, sensorsData.map(function (e) {
return new Date(e.MeasureDate);
})));
}
And here is the example of parameter that function receive:
[{
"Address": 54,
"AlertType": 1,
"Area": "North",
"MeasureDate": "2009-11-27T18:10:00",
"MeasureValue": -1
},
{
"Address": 26,
"AlertType": 1,
"Area": "West",
"MeasureDate": "2010-15-27T15:15:00",
"MeasureValue": -1
},
{
"Address": 25,
"AlertType": 1,
"Area": "North",
"MeasureDate": "2012-10-27T18:10:00",
"MeasureValue": -1
}]
The function updateLatestDate will return MeasureDate value of last object in the array.
And it will look like that:
var latestDate = Sat Oct 27 2012 21:10:00 GMT+0300 (Jerusalem Daylight Time)
As you can see the time of the returned result is different from the time of the input object.The time changed according to GMT.
But I don't want the time to be changed according to GMT.
The desired result is:
var latestDate = Sat Oct 27 2012 18:10:00
Any idea how can I ignore time zone when date returned from updateLatestDate function?
As Frz Khan pointed, you can use the .toISOString() function when returning the date from your function, but if you're seeking the UTC format, use the .toUTCString(), it would output something like Mon, 18 Apr 2016 18:09:32 GMT
function updateLatestDate(sensorsData) {
return new Date(Math.max.apply(null, sensorsData.map(function (e) {
return new Date(e.MeasureDate).toUTCString();
})));
}
The Date.toISOString() function is what you need
try this:
var d = new Date("2012-10-27T18:10:00");
d.toISOString();
result:
"2012-10-27T18:10:00.000Z"
If you use moment it will be
moment('Sat Oct 27 2012 21:10:00 GMT+0300', 'ddd MMM DD DDDD HH:mm:SS [GMT]ZZ').format('ddd MMM DD YYYY HH:mm:SS')

Find the last item in array in mongo document and check if its field is a certain value

I got this document:
{
_id: "ZApHZeqw98uhwqaey",
borrowerId: "DmGQyqenbNt4eBMia",
isSeenByOther: 1,
lenderId: "JsJyvseqiiazGxRuq",
messages: [{
date: Sun Oct 25 2015 19:40:25 GMT+0100 (CET),
from: "JsJyvseqiiazGxRuq",
text: "Hi there"
},{
date: Sun Oct 25 2015 19:40:35 GMT+0100 (CET),
from: "DmGQyqenbNt4eBMia",
text: "Hey!"
}]
}
What I'm trying to do is to just get a boolean value stating whether or not the value of the field from of the last object item in the array: messages is the current user.
I have tried a lot of different mongodb projections such as $slice and $position which essentially inserts in the beginning of the array but not ideal for my case.
You can use underscore's _.last() function as follows:
var doc = MyCollection.findOne({ _id: "ZApHZeqw98uhwqaey" });
var lastElement = _.last(doc.messages);
if ( lastElement.from === Meteor.userId() ){
... do your thing
}

Categories