I have D3 data graphic like here: https://www.metricsgraphicsjs.org/examples.htm#lines with example code
MG.data_graphic({
title: "Singleton",
description: "Handling a solitary data point.",
data: [{'date': new Date('2015-03-05T21:00:00Z'), 'value': 12000}],
width: 600,
height: 200,
right: 40,
target: '#singleton'
});
and difference is that I store data into database. But I have problem with displaying dates. My JSON data (pulled from MySQL) looks like this:
var data1 = [
[
{
"date": "2018-04-28T13:42:55Z",
"value": 20.8,
"added": "2018-04-28T13:42:55Z"
}
],
[
{
"date": "2018-04-28T13:42:55Z",
"value": 22.8,
"added": "2018-04-28T13:42:55Z"
}
],
[
{
"date": "2018-04-28T13:42:55Z",
"value": 23.9,
"added": "2018-04-28T13:42:55Z"
}
],
[
{
"date": "2018-04-28T13:42:55Z",
"value": 21.3,
"added": "2018-04-28T13:42:55Z"
}
]
];
When I try to display that data, it does not work, shows me errors like <path> attribute d: Expected number, "MNaN,86.570057581…"
But on other hand, if I set another variable for example
var data2 = [
[
{'date': new Date('2015-03-05T21:07:00Z'), 'value': 12000},
{'date': new Date('2015-03-05T21:10:00Z'), 'value': 5500},
{'date': new Date('2015-03-05T21:15:00Z'), 'value': 1000}
],
[
{'date': new Date('2015-03-05T21:05:00Z'), 'value': 18000},
{'date': new Date('2015-03-05T21:07:00Z'), 'value': 15000},
{'date': new Date('2015-03-05T21:15:00Z'), 'value': 7000}
]
];
This second example works and I was wondering what this "new Date()" does to data. How can I "fix" first data1 array and store it in another variable with correct dates? - I did try this type of date: Date Sat Apr 28 2018 13:56:55 GMT+0000 (UTC) but that did not help, did not work. Like this:
[
{'date': 'Apr 28 2018 13:57:55 GMT+0000 (UTC)', 'value': 18000},
{'date': 'Apr 28 2018 13:58:55 GMT+0000 (UTC)', 'value': 15000},
{'date': 'Apr 28 2018 13:59:55 GMT+0000 (UTC)', 'value': 7000}
]
This did not work. Does "new Date()" converts date and time to integer or string or something else?
I just want to find a way to change data1 variable and convert its dates to proper values to be able to show them on graph.
Thanks guys!
Related
I need some guidance please.
I have a data structure that looks like this (note that the certResults field is an array, in this case - apple.com and reuters.com, but typically there are more results within the certResults array):
{
"deviceTag": "",
"clientHostName": "555317e186a0",
"dataFormatVersion": 10,
"certResults":
[
{
"hostname": "apple.com",
"port": 443,
"startTime": "2022/07/01 03:50:57.867716",
"endTime": "2022/07/01 03:50:57.960064",
"queryTime": 92.35,
"certificateInfo":
{
"subject":
{
"countryName": "US",
"stateOrProvinceName": "California",
"localityName": "Cupertino",
"organizationName": "Apple Inc.",
"commonName": "apple.com"
},
"certificateIssuer":
{
"countryName": "US",
"organizationName": "Apple Inc.",
"commonName": "Apple Public EV Server ECC CA 1 - G1"
},
"version": 3,
"serialNumber": "6A1D3FA84A43C329F1051060FF4698BA",
"notBefore": "Apr 26 21:58:37 2022 GMT",
"notAfter": "May 26 21:58:36 2023 GMT",
"OCSP":
[
"http://ocsp.apple.com/ocsp03-apevsecc1g101"
],
"crlDistributionPoints":
[
"http://crl.apple.com/apevsecc1g1.crl"
],
"caIssuers":
[
"http://certs.apple.com/apevsecc1g1.der"
],
"subjectAltName":
{
"DNS0": "apple.com"
}
},
"timeLeft": "10 months, 25 days, 18 hours, 7 minutes, 39 seconds",
"percentageUtilization": 16.52
},
{
"hostname": "reuters.com",
"port": 443,
"startTime": "2022/07/01 03:50:57.962692",
"endTime": "2022/07/01 03:50:58.271235",
"queryTime": 308.54,
"certificateInfo":
{
"subject":
{
"commonName": "reuters.com"
},
"certificateIssuer":
{
"countryName": "US",
"organizationName": "Let's Encrypt",
"commonName": "R3"
},
"version": 3,
"serialNumber": "04203F2F15F8194772481DABC1061E213EAB",
"notBefore": "Jun 6 12:54:06 2022 GMT",
"notAfter": "Sep 4 12:54:05 2022 GMT",
"OCSP":
[
"http://r3.o.lencr.org"
],
"caIssuers":
[
"http://r3.i.lencr.org/"
],
"subjectAltName":
{
"DNS0": "reuters.com"
}
},
"timeLeft": "2 months, 3 days, 9 hours, 3 minutes, 7 seconds",
"percentageUtilization": 27.36
}
]
}
This data structure is similar in that it is executed every hour for the same hosts - i.e. each document is the same with updated results in the certResults array.
I'm struggling with the syntax for MongoDB aggregate function.
Using MongoDB's find function, I can collate entries for a specific host by first filtering the dataFormatVersion:10 and then looking at the certResults.hostname field for "reuters.com":
db.certCollection.find({ dataFormatVersion:10, certResults: {$elemMatch: {hostname: "reuters.com"}} }, {_id: 0, certResults: {"hostname.$": 1, "startTime": 1 , "port": 1, "percentageUtilization": 1 }} );
Which presents this information:
{ "certResults" : [ { "hostname" : "reuters.com", "port" : 443, "startTime" : "2022/06/28 16:31:49.919962", "percentageUtilization" : 24.61 } ] }
{ "certResults" : [ { "hostname" : "reuters.com", "port" : 443, "startTime" : "2022/06/28 16:34:55.868512", "percentageUtilization" : 24.61 } ] }
{ "certResults" : [ { "hostname" : "reuters.com", "port" : 443, "startTime" : "2022/06/28 16:57:38.926443", "percentageUtilization" : 24.63 } ] }
{ "certResults" : [ { "hostname" : "reuters.com", "port" : 443, "startTime" : "2022/06/28 17:00:02.359976", "percentageUtilization" : 24.63 } ] }
etc.
I'm not sure how to aggregate data for the percentageUtilization field.
I'd like to find out the average for the percentageUtilization field across the responding documents for this hostname "reuters.com" only. Is there a way to filter on startTime and endTime fields as well?
Similarly, I'd like to find out the average percentageUtilization across all host entries for all responding documents (i.e. reuters.com and apple.com) within a certain timeframe (based on startTime and endTime fields).
Any help would be greatly appreciated!
Thank you!
Aha! The trick I was looking for was to use $unwind for the certResults array.
I have data that looks like:
[
{
'_id': ObjectId('589ba2fb2742a35b47dad21c'),
'name': 'Iphone7',
'price': 14500,
'category': 'Phone',
'vendor': 'Apple',
'stock': [
10,
40,
],
'quantity': 10,
},
{
'_id': ObjectId('589ba2fb2742a35b47dad21d'),
'name': 'Samaung TV',
'price': 6500,
'category': 'TV',
'vendor': {
'name': 'Samaung',
'phone': '01061202200',
},
'stock': [
5,
70,
80,
34,
],
'quantity': 5,
},
];
I could get second "vendor" which contain phone as like:
db.products.find({"vendor.phone": {"$exists": true}}).pretty()
I'm searching for any other way to do get only the vendor that contains "phone" value. I'm new to mongo. thanks in advance.
I would argue $exists is the best. However if for some case you insist not to do so you could use $type to only find documents where vendor.phone is of a certain type.
Under the assumption that all phone numbers are type string you could use this query:
db.collection.find({
"vendor.phone": {
$type: 2
}
})
If vendor.phone can be multiple types you'll have to use an $or query to cover all those types like so: (in this example types 1 and 2 represent number and string)
db.collection.find({
$or: [
{
"vendor.phone": {
$type: 1
}
},
{
"vendor.phone": {
$type: 2
}
}
]
})
Mongo Playground
I am creating a Line Chart with d3 in Angular 8.
I following some example with TEMPERATURES. But my API is getting following format.
Data from API
{
"status": 200,
"data": {
"dashboard_data": [
[
2014-04-01,
2920.0,
239.44000000000003
],
[
2014-04-02,
2260.0,
185.32000000000002
],
[
2014-04-03,
156.0,
12.792
],
[
2014-04-04,
980.0,
80.36
],
[
2014-04-05,
1515.0,
124.22999999999999
],
],
}
}
Need data in this format
TEMPERATURES = [
{
'values': [
{'date': new Date('2012-09-05'), 'temperature': 77.7},
{'date': new Date('2012-09-06'), 'temperature': 74.2},
{'date': new Date('2012-09-07'), 'temperature': 76.0},
]
},
];
I am looking for solution, how I convert dashboard_data with values?
TIA
Try like this:
TEMPERATURES = [];
constructor() {
let obj = {};
obj["values"] = this.input.data.dashboard_data.map(item => ({
date: new Date(item[0]),
temperature : item[2]
}))
this.TEMPERATURES.push(obj)
}
Working Demo
It is not clear how to convert temperature. However, you can try the following approach:
let temperatures = [];
const result = obj.data.dashboard_data
.map(([d, h, t]) => ({date: new Date(d), temperature: t}));
temperatures.push({values: result});
An example:
let obj = {
"status": 200,
"data":
{
"dashboard_data": [
[
2014 - 04 - 01,
2920.0,
239.44000000000003
],
[
2014 - 04 - 02,
2260.0,
185.32000000000002
],
[
2014 - 04 - 03,
156.0,
12.792
],
[
2014 - 04 - 04,
980.0,
80.36
],
[
2014 - 04 - 05,
1515.0,
124.22999999999999
],
]
}
};
let temperatures = [];
const result = obj.data.dashboard_data
.map(([d, h, t]) => ({date: new Date(d), temperature: t}));
temperatures.push({values: result});
console.log(temperatures);
You have to iterate over each item in dashboard_data array and then pick date and temperature from it and push it to TEMPERATURE array:
dashboard_data.forEach((item)=>{
TEMPERATURES.push({'date': new Date(item[0]), 'temperature': item[2]});
}
)
let dashboard_data = [
[
'2014-04-01',
2920.0,
239.44000000000003
],
[
'2014-04-02',
2260.0,
185.32000000000002
],
[
'2014-04-03',
156.0,
12.792
],
[
'2014-04-04',
980.0,
80.36
],
[
'2014-04-05',
1515.0,
124.22999999999999
],
]
let TEMPERATURES = [];
dashboard_data.forEach((item)=>{
TEMPERATURES.push({'date': new Date(item[0]), 'temperature': item[2]});
}
)
console.log(TEMPERATURES);
I am getting json response from server as below.
[
[{
"ID": 1,
"Date": "11-09-2015",
"Balance": 1496693.00
}, {
"ID": 2,
"Date": "01-10-2015",
"Balance": 1496693.00
}],
[{
"ID": 1,
"Date": "03-09-2000",
"IntAmount": "003.00"
}],
[{
"EmployeeId": "000",
"DesignationName": "deg"
}],
[{
"LoanAmount": "00000.00",
"IntRate": "3.00",
"LoanNo": "56656"
}]
]
I can parse json array with name but in above json there are three arrays without name.
How to parse above json in three different arrays?
If you are positive that the data will always come in the stated format, then you can iterate through the result. See below for example:
main(List<String> args) {
// Define the array of data "object" like this
List<List<Map<String, dynamic>>> arrayOfData = [
[
{"ID": 1, "Date": "11-09-2015", "Balance": 1496693.00},
{"ID": 2, "Date": "01-10-2015", "Balance": 1496693.00}
],
[
{"ID": 1, "Date": "03-09-2000", "IntAmount": "003.00"}
],
[
{"EmployeeId": "000", "DesignationName": "deg"}
],
[
{"LoanAmount": "00000.00", "IntRate": "3.00", "LoanNo": "56656"}
]
];
/*
Iterate through the array of "objects" using forEach,
then, iterate through each resulting array using forEach
*/
arrayOfData.forEach((datasetArray) => datasetArray.forEach((dataset) => print(dataset)));
/*
============== RESULT ========
{ID: 1, Date: 11-09-2015, Balance: 1496693.0}
{ID: 2, Date: 01-10-2015, Balance: 1496693.0}
{ID: 1, Date: 03-09-2000, IntAmount: 003.00}
{EmployeeId: 000, DesignationName: deg}
{LoanAmount: 00000.00, IntRate: 3.00, LoanNo: 56656}
*/
}
I'm trying to group a collection by date in Meteor using Underscore's _.groupBy function.
Here is a sample of the code that outputs:
"Mon Dec 07 2015 00:00:00 GMT+0000 (GMT)":[
{
"_id":"q9TMi9ZyoRjmddzfY",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-07T00:00:00.000Z",
"start":"2015-12-07T08:00:00.000Z",
"end":"2015-12-07T09:00:00.000Z",
"teachers":[
],
"clients":[
{
"clientId":"M4DDCGWGMzX7bJRHa",
"manual":"true"
}
],
"clientLimit":99
}
],
"Tue Dec 08 2015 00:00:00 GMT+0000 (GMT)":[
{
"_id":"Jbchuc58zWDyEqnQZ",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-08T00:00:00.000Z",
"start":"2015-12-08T08:30:00.000Z",
"end":"2015-12-08T09:30:00.000Z",
"teachers":[
],
"clients":[
],
"clientLimit":15
},
{
"_id":"EsqygwCCPucGhx9nP",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-08T00:00:00.000Z",
"start":"2015-12-08T09:30:00.000Z",
"end":"2015-12-08T10:30:00.000Z",
"teachers":[
"eLExMRh3TT5eYWpki",
"wxFjH39M9kuBTv4zN"
],
"clients":[
],
"clientLimit":10
}
]
}
The problem is, I'm not really sure how I can output these in the front-end. Do I have to somehow convert it to normal arrays or a cursor? Or is there perhaps another way of grouping a collection by date headings?
I'm looking to output something like the following:
Saturday 21st September
- Item 1
- Item 2
Tuesday 24th September
- Item 3
Thanks for any ideas.
This is how I would do it:
loops.html
{{#each arrayify data}}
{{name}} <br>
<ul>
{{#each value}}
<li>ClientLimit: {{this.clientLimit}}</li>
{{/each}}
</ul>
{{/each}}
loops.js
Template.registerHelper('arrayify',function(obj){
result = [];
for (var key in obj) result.push({name:key,value:obj[key]});
return result;
});
Template.hello.helpers({
data: function() {
return {
"Mon Dec 07 2015 00:00:00 GMT+0000 (GMT)":[
{
"_id":"q9TMi9ZyoRjmddzfY",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-07T00:00:00.000Z",
"start":"2015-12-07T08:00:00.000Z",
"end":"2015-12-07T09:00:00.000Z",
"teachers":[
],
"clients":[
{
"clientId":"M4DDCGWGMzX7bJRHa",
"manual":"true"
}
],
"clientLimit":99
}
],
"Tue Dec 08 2015 00:00:00 GMT+0000 (GMT)":[
{
"_id":"Jbchuc58zWDyEqnQZ",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-08T00:00:00.000Z",
"start":"2015-12-08T08:30:00.000Z",
"end":"2015-12-08T09:30:00.000Z",
"teachers":[
],
"clients":[
],
"clientLimit":15
},
{
"_id":"EsqygwCCPucGhx9nP",
"title":"New event",
"type":"collectif",
"product":"passeport",
"date":"2015-12-08T00:00:00.000Z",
"start":"2015-12-08T09:30:00.000Z",
"end":"2015-12-08T10:30:00.000Z",
"teachers":[
"eLExMRh3TT5eYWpki",
"wxFjH39M9kuBTv4zN"
],
"clients":[
],
"clientLimit":10
}
]
}
});