I have a nested json object which looks like---
[
{"key":"AXCG","values":[
{"interval":'1_to_2years',"value":34},
{"interval":'3_to_4years',"value":12},
{"interval":'5_to_6years',"value":45},
]},
{"key":"BDGT","values":[
{"interval":'1_to_2years',"value":194},
{"interval":'3_to_4years',"value":12},
{"interval":'5_to_6years',"value":45},
]},
{"key":"YTEF","values":[
{"interval":'1_to_2years',"value":0},
{"interval":'3_to_4years',"value":12},
{"interval":'5_to_6years',"value":15},
]}]
I want to find the min and max among the value. Like in this case it would be min 0 and 194 maximum. How should I do it?
Find below the code for your use-case,
'use strict'
const collection = [
{
"key": "AXCG", "values": [
{ "interval": '1_to_2years', "value": 34 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "BDGT", "values": [
{ "interval": '1_to_2years', "value": 194 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "YTEF", "values": [
{ "interval": '1_to_2years', "value": 0 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 15 },
]
}]
const list = []
collection.every(e => e.values.every(e2 => list.push(e2.value)));
console.log('Max Value:: ' + Math.max.apply(null, list)); // 194
console.log('Min Value:: ' + Math.min.apply(null, list)); // 0
var collection = [
{
"key": "AXCG", "values": [
{ "interval": '1_to_2years', "value": 34 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "BDGT", "values": [
{ "interval": '1_to_2years', "value": 194 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "YTEF", "values": [
{ "interval": '1_to_2years', "value": 0 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 15 },
]
}
];
var values = [];
collection.forEach(function (item) {
item.values.forEach(function (nestedItem) {
values.push(nestedItem.value);
});
});
console.log("Min:" + Math.min.apply(Math, values)); // Min:0
console.log("Max:" + Math.max.apply(Math, values)); // Max:194
Another variation on the simple idea of using Array.forEach:
var o = [
{
"key": "AXCG", "values": [
{ "interval": '1_to_2years', "value": 34 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "BDGT", "values": [
{ "interval": '1_to_2years', "value": 194 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 45 },
]
},
{
"key": "YTEF", "values": [
{ "interval": '1_to_2years', "value": 0 },
{ "interval": '3_to_4years', "value": 12 },
{ "interval": '5_to_6years', "value": 15 },
]
}];
var minimum = 9999;
var maximum = 0;
o.forEach(function (element) {
var inner = element.values;
inner.forEach(function (innerELement) {
if (innerELement.value < minimum) minimum = innerELement.value;
if (innerELement.value > maximum) maximum = innerELement.value;
});
});
console.log('Min is ' + minimum + ' and max is ' + maximum);
You can use array#reduce to get the minimum and maximum value of the value inside the values array. Iterate through each object of values array and compare the values with minimum and maximum value stored and when you encounter new minimum and maximum value update the stored value.
var collection = [{ "key": "AXCG", "values": [{ "interval": '1_to_2years', "value": 34 }, { "interval": '3_to_4years', "value": 12 }, { "interval": '5_to_6years', "value": 45 }, ] }, { "key": "BDGT", "values": [{ "interval": '1_to_2years', "value": 194 }, { "interval": '3_to_4years', "value": 12 }, { "interval": '5_to_6years', "value": 45 }, ] }, { "key": "YTEF", "values": [{ "interval": '1_to_2years', "value": 0 }, { "interval": '3_to_4years', "value": 12 }, { "interval": '5_to_6years', "value": 15}, ] } ],
result = collection.reduce((r,{values}) => {
values.forEach(({value}) => {
r.min = r.min > value ? value : r.min;
r.max = r.max < value ? value : r.max;
});
return r;
},{min: Number.MAX_SAFE_INTEGER, max: Number.MIN_SAFE_INTEGER});
console.log(result);
Related
I am trying to split this array into two different arrays using the values inside the first array.
This is my initial array:
"carList": [
{
"brand": [
{
"model": [
{ "motor": { "id": 1 }, "color": 10 },
{ "motor": { "id": 2 }, "color": 20 },
{ "motor": { "id": 3 }, "color": 30 },
{ "motor": { "id": 4 }, "color": 40 }
]
}
]
},
{ "brand": [{ "model": [{ "size": 400 }] }] },
{ "brand": [{ "model": [{ "size": 500 }] }] }
],
The first array must contain the model with the motor and the colors. The second should only contain the brand with the size (I can have an indeterminate number of brands).
I would like this as an output:
"carList": [
{
"brand": [
{
"model": [
{ "motor": { "id": 1 }, "color": 10 },
{ "motor": { "id": 2 }, "color": 20 },
{ "motor": { "id": 3 }, "color": 30 },
{ "motor": { "id": 4 }, "color": 40 }
]
}
]
},
],
"carList": [
{ "brand": [{ "model": [{ "size": 400 }] }] },
{ "brand": [{ "model": [{ "size": 500 }] }] }
],
When trying to split the array, I tried to create the array only with size, but I get the carList global:
const carList1 = carList.filter((x) =>
x.brand.filter((y) => y.model.filter((z) => z.size)
);
How I can split my array and get this output?
UPDATE
This is my more genral exemple test I can have many brand and model,
"carList": [
{
"brand": [
{
"model": [
{ "motor": { "id": 1 }, "color": 10 },
{ "motor": { "id": 2 }, "color": 20 },
{ "motor": { "id": 3 }, "color": 30 },
{ "motor": { "id": 4 }, "color": 40 }
]
},
{
"model": [
{ "motor": { "id": 1 }, "color": 11 },
{ "motor": { "id": 2 }, "color": 22 },
{ "motor": { "id": 3 }, "color": 33 },
{ "motor": { "id": 4 }, "color": 44 }
]
}
]
},
{ "brand": [
{
"model": [
{ "size": 400 },
]
},
{
"model": [
{ "size": 401 }
]
},
{ "brand": [{ "model": [{ "size": 500 }] }] }
],
This would be one way of doing it:
const data={"carList":[
{"brand":[{"model": [{ "motor": { "id": 1 }, "color": 10 },
{ "motor": { "id": 2 }, "color": 20 },
{ "motor": { "id": 3 }, "color": 30 },
{ "motor": { "id": 4 }, "color": 40 }]},
{"model": [{ "motor": { "id": 1 }, "color": 11 },
{ "motor": { "id": 2 }, "color": 22 },
{ "motor": { "id": 3 }, "color": 33 },
{ "motor": { "id": 4 }, "color": 44 }]}
]},
{"brand":[{"model": [{ "size": 400 }]},
{"model": [{ "size": 401 }]}]},
{"brand":[{"model": [{ "size": 500 }]}]}
]}
const [mo,si]=["motor","size"].map(p=>data.carList.filter(e=>
e.brand.find(b=>b.model.find(m=>m[p]))));
console.log(JSON.stringify(mo));
console.log(JSON.stringify(si));
I applied the snippet now to the updated data. The result arrays motor and sizes are calculated by applying a .filter() on the data array.
In this updated version of the script I assign a brand to the mo or si array if it somehow contains the property motor or size`.
I was working on something but stuck at a point where I have inputs as -
var definition = [
{
"name": "objA",
"type": "object",
"items": [
{
"value": "",
"name": "A"
},
{
"value": "",
"name": "B"
},
{
"value": "",
"name": "C"
}
]
},
{
"name": "objX",
"type": "object",
"items": [
{
"value": "",
"name": "X"
},
{
"value": "",
"name": "Y"
},
{
"value": "",
"name": "Z"
}
]
}
];
var data = {
"objA": {
"A": "ValA",
"B": "ValB",
"C": "ValC"
},
"objX": {
"X": "ValX",
"Y": "ValY",
"Z": "ValZ"
}
};
const updateSchema = (data, definition) => {
definition.forEach((subDef) => {
var node = data[subDef.name];
subDef.items.forEach((sub)=> {
sub.value = node[sub.name]
});
});
return definition;
}
console.log(updateSchema(data,definition))
The output I need is
[
{
"name": "objA",
"type": "object",
"items": [
{
"value": "valA",
"name": "A"
},
{
"value": "valB",
"name": "B"
},
{
"value": "valC",
"name": "C"
}
]
},
{
"name": "objX",
"type": "object",
"items": [
{
"value": "valX",
"name": "X"
},
{
"value": "valY",
"name": "Y"
},
{
"value": "valZ",
"name": "Z"
}
]
}
]
But it gives the output as -
[
{
"name": "objA",
"type": "object",
"items": [
{
"value": "ValX",
"name": "A"
},
{
"value": "ValY",
"name": "B"
},
{
"value": "ValY",
"name": "C"
}
]
},
{
"name": "objX",
"type": "object",
"items": [
{
"value": "ValX",
"name": "X"
},
{
"value": "ValY",
"name": "Y"
},
{
"value": "ValZ",
"name": "Z"
}
]
}
]
I am not able to know where I am doing wrong.
I am using React with typescript. I need to perform the above operation based on some API response.
I am prepopulating some value in the form based on the API response.
Try:
subDef.items.forEach((sub)=> {
sub.value = node[sub.name].charAt(0).toLowerCase() + node[sub.name].slice(1);
});
https://jsfiddle.net/j8nwpf6m/
I am trying to plot chart using Amchart and Angular js.
My Data array object contains date in form of a string.
Problem is the amchart's dataDateFormat is not working as required.
For example -
in my data object
{
"date": "2012-07-27 11:33",
"value": 18
}
In amchart code
"dataDateFormat": "JJ:NN" or "dataDateFormat": "YYYY-MM-DD JJ:NN"
shows a single line as graph.
Below is the js code
angular.module("ctrl", ['ui.bootstrap']).controller("mindCtrl",
function($scope) {
$scope.makaDaCharto = function(index) {
$scope.chart = AmCharts.makeChart("chartdiv" + index, {
"type": "serial",
"theme": "light",
"marginRight": 40,
"marginLeft": 40,
"autoMarginOffset": 20,
"mouseWheelZoomEnabled": true,
"dataDateFormat": "JJ:NN",
"valueAxes": [{
"id": "v1",
"axisAlpha": 0,
"position": "left",
"ignoreAxisWidth": true
}],
"balloon": {
"borderThickness": 1,
"shadowAlpha": 0
},
"graphs": [{
"id": "g1",
"balloon": {
"drop": true,
"adjustBorderColor": false,
"color": "#ffffff"
},
"bullet": "round",
"bulletBorderAlpha": 1,
"bulletColor": "#FFFFFF",
"bulletSize": 5,
"hideBulletsCount": 50,
"lineThickness": 2,
"title": "red line",
"useLineColorForBulletBorder": true,
"valueField": "value",
"balloonText": "<span style='font-size:18px;'>[[value]]</span>"
}],
"chartScrollbar": {
"graph": "g1",
"oppositeAxis": false,
"offset": 30,
"scrollbarHeight": 80,
"backgroundAlpha": 0,
"selectedBackgroundAlpha": 0.1,
"selectedBackgroundColor": "#888888",
"graphFillAlpha": 0,
"graphLineAlpha": 0.5,
"selectedGraphFillAlpha": 0,
"selectedGraphLineAlpha": 1,
"autoGridCount": true,
"color": "#AAAAAA"
},
"chartCursor": {
"pan": true,
"valueLineEnabled": true,
"valueLineBalloonEnabled": true,
"cursorAlpha": 1,
"cursorColor": "#258cbb",
"limitToGraph": "g1",
"valueLineAlpha": 0.2,
"valueZoomable": true
},
"valueScrollbar": {
"oppositeAxis": false,
"offset": 50,
"scrollbarHeight": 10
},
"categoryField": "date",
"categoryAxis": {
"parseDates": true,
"dashLength": 1,
"minorGridEnabled": true
},
"export": {
"enabled": true
},
"dataProvider": [{
"date": "2012-07-27 11:22",
"value": 13
}, {
"date": "2012-07-27 11:23",
"value": 11
}, {
"date": "2012-07-27 11:24",
"value": 15
}, {
"date": "2012-07-27 11:25",
"value": 16
}, {
"date": "2012-07-27 11:26",
"value": 18
}, {
"date": "2012-07-27 11:27",
"value": 13
}, {
"date": "2012-07-27 11:28",
"value": 22
}, {
"date": "2012-07-27 11:29",
"value": 23
}, {
"date": "2012-07-27 11:30",
"value": 20
}, {
"date": "2012-07-27 11:31",
"value": 17
}, {
"date": "2012-07-27 11:32",
"value": 16
}, {
"date": "2012-07-27 11:33",
"value": 18
}, {
"date": "2012-07-27 11:34",
"value": 21
}, {
"date": "2012-07-27 11:35",
"value": 26
}, {
"date": "2012-07-27 11:36",
"value": 24
}, {
"date": "2012-07-27 11:37",
"value": 29
}, {
"date": "2012-07-27 11:38",
"value": 32
}, {
"date": "2012-07-27 11:39",
"value": 18
}, {
"date": "2012-07-27 11:40",
"value": 24
}, {
"date": "2012-07-27 11:41",
"value": 22
}, {
"date": "2012-07-27 11:42",
"value": 18
}, {
"date": "2012-07-27 11:43",
"value": 19
}, {
"date": "2012-07-27 11:44",
"value": 14
}, {
"date": "2012-07-27 11:45",
"value": 15
}, {
"date": "2012-07-27 11:46",
"value": 12
}, {
"date": "2012-07-27 11:47",
"value": 8
}, {
"date": "2012-07-27 11:48",
"value": 9
}, {
"date": "2012-07-27 11:49",
"value": 8
}, {
"date": "2012-07-27 11:50",
"value": 7
}, {
"date": "2012-07-27 11:51",
"value": 5
}, {
"date": "2012-07-27 11:52",
"value": 11
}, {
"date": "2012-07-27 11:53",
"value": 13
}, {
"date": "2012-07-27 11:54",
"value": 18
}]
});
$scope.chart.addListener("rendered", zoomChart);
zoomChart();
function zoomChart() {
$scope.chart.zoomToIndexes($scope.chart.dataProvider.length - 40,
$scope.chart.dataProvider.length - 1);
}
};
});
Amchart Curve by editing fiddle
Existing Example fiddle at http://jsfiddle.net/v917yya3/68/
Fiddle I Created to depict the issue http://jsfiddle.net/phex4qg5/
PS - I already tried
amCharts with AngularJS
JSON with parsed time or timestamp to amCharts
Almost all formats explained here http://www.amcharts.com/kbase/formatting-dates/
AmCharts assumes your data is in daily intervals by default. Since your data is in minute intervals, you need to adjust the category axis' minPeriod to accommodate this. In your case, set minPeriod: "mm", along with setting dataDateFormat: "YYYY-MM-DD JJ:NN" will fix your chart.
Updated fiddle: http://jsfiddle.net/phex4qg5/10/
I'm use amChartSerialChart.
"categoryField": "ymd",
"categoryAxis": {
"dateFormats": [{
"period": "DD",
"format": "DD"
}, {
"period": "WW",
"format": "MMM DD"
}, {
"period": "MM",
"format": "MMM"
}, {
"period": "YYYY",
"format": "YYYY"
}],
"parseDates": true,
"minPeriod": "WW",
"dataProvider": [{
"date": "2016-11-14",
"value": 1
}, {
"date": "2016-11-14",
"value": 2
}, {
"date": "2016-11-15",
"value": 3
}, {
"date": "2012-11-15",
"value": 4
}
If there are multiple data of the same date, I would like to obtain the total result.
i hope result value is 10.
What kind of solution is there?
Reduce
Map
dataProvider= [{
"date": "2016-11-14",
"value": 1
}, {
"date": "2016-11-14",
"value": 2
}, {
"date": "2016-11-15",
"value": 3
}, {
"date": "2012-11-15",
"value": 4
}]
var result=dataProvider.map(function(arr){return arr.value;
}).reduce((a, b) => a + b, 0);;
console.log(result);
The chart doesn't automatically sum up values of the same date, nor does it support duplicate dates. You need to pre-process your data before assigning it to the chart's dataProvider.
var rawData = [{
"date": "2016-11-14",
"value": 1
}, {
"date": "2016-11-14",
"value": 2
}, {
"date": "2016-11-15",
"value": 3
}, {
"date": "2012-11-15",
"value": 4
}]
//aggregate and sum all elements with the same date key
var aggregatedTotals = rawData.reduce(function(accumulator, data) {
if (accumulator.hasOwnProperty(data.date)) {
accumulator[data.date] += data.value;
} else {
accumulator[data.date] = data.value;
}
return accumulator;
}, {});
//create a brand new array containing the summed up values
var chartData = Object.keys(aggregatedTotals).map(function(date) {
return {
"date": date,
"value": aggregatedTotals[date]
};
});
var rawData = [{
"date": "2016-11-15",
"value": 4
}, {
"date": "2016-11-15",
"value": 1
}, {
"date": "2016-11-16",
"value": 3
}, {
"date": "2016-11-16",
"value": 4
}, {
"date": "2016-11-17",
"value": 3
}, {
"date": "2016-11-17",
"value": 3
}, {
"date": "2016-11-18",
"value": 5
}, {
"date": "2016-11-18",
"value": 1
}, {
"date": "2016-11-19",
"value": 4
}, {
"date": "2016-11-19",
"value": 1
}, {
"date": "2016-11-20",
"value": 4
}, {
"date": "2016-11-20",
"value": 3
}, {
"date": "2016-11-21",
"value": 3
}, {
"date": "2016-11-21",
"value": 3
}, {
"date": "2016-11-22",
"value": 5
}, {
"date": "2016-11-22",
"value": 3
}, {
"date": "2016-11-23",
"value": 4
}, {
"date": "2016-11-23",
"value": 4
}, {
"date": "2016-11-24",
"value": 4
}, {
"date": "2016-11-24",
"value": 2
}, {
"date": "2016-11-25",
"value": 5
}, {
"date": "2016-11-25",
"value": 4
}, {
"date": "2016-11-26",
"value": 5
}, {
"date": "2016-11-26",
"value": 1
}, {
"date": "2016-11-27",
"value": 5
}, {
"date": "2016-11-27",
"value": 3
}, {
"date": "2016-11-28",
"value": 5
}, {
"date": "2016-11-28",
"value": 1
}, {
"date": "2016-11-29",
"value": 3
}, {
"date": "2016-11-29",
"value": 3
}, {
"date": "2016-11-30",
"value": 4
}, {
"date": "2016-11-30",
"value": 3
}, {
"date": "2016-12-01",
"value": 4
}, {
"date": "2016-12-01",
"value": 2
}, {
"date": "2016-12-02",
"value": 4
}, {
"date": "2016-12-02",
"value": 1
}, {
"date": "2016-12-03",
"value": 4
}, {
"date": "2016-12-03",
"value": 3
}, {
"date": "2016-12-04",
"value": 3
}, {
"date": "2016-12-04",
"value": 1
}, {
"date": "2016-12-05",
"value": 5
}, {
"date": "2016-12-05",
"value": 2
}, {
"date": "2016-12-06",
"value": 3
}, {
"date": "2016-12-06",
"value": 3
}, {
"date": "2016-12-07",
"value": 5
}, {
"date": "2016-12-07",
"value": 1
}, {
"date": "2016-12-08",
"value": 4
}, {
"date": "2016-12-08",
"value": 1
}, {
"date": "2016-12-09",
"value": 3
}, {
"date": "2016-12-09",
"value": 4
}, {
"date": "2016-12-10",
"value": 5
}, {
"date": "2016-12-10",
"value": 2
}, {
"date": "2016-12-11",
"value": 5
}, {
"date": "2016-12-11",
"value": 1
}, {
"date": "2016-12-12",
"value": 3
}, {
"date": "2016-12-12",
"value": 2
}];
//aggregate and sum all elements with the same date key
var aggregatedTotals = rawData.reduce(function(accumulator, data) {
if (accumulator.hasOwnProperty(data.date)) {
accumulator[data.date] += data.value;
} else {
accumulator[data.date] = data.value;
}
return accumulator;
}, {});
//create a brand new array containing the summed up values
var chartData = Object.keys(aggregatedTotals).map(function(date) {
return {
"date": date,
"value": aggregatedTotals[date]
};
});
var chart = AmCharts.makeChart("chartdiv", {
"type": "serial",
"dataProvider": chartData,
"graphs": [{
"bullet": "round",
"valueField": "value"
}],
"dataDateFormat": "YYYY-MM-DD",
"categoryField": "date",
"categoryAxis": {
"dateFormats": [{
"period": "DD",
"format": "DD"
}, {
"period": "WW",
"format": "MMM DD"
}, {
"period": "MM",
"format": "MMM"
}, {
"period": "YYYY",
"format": "YYYY"
}],
"parseDates": true,
"minPeriod": "7DD",
}
});
#chartdiv {
width: 100%;
height: 300px;
}
<script type="text/javascript" src="//www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="//www.amcharts.com/lib/3/serial.js"></script>
<div id="chartdiv"></div>
Note that WW is an invalid minPeriod. If you want to group your data in weeks, use 7DD instead. API documentation for minPeriod
Hello I want to create a JSON Object for storage resources in a post request in java script I have an input array value disk sizes for example below:
request1
input = [10, 20, 30]
"storageResources": [
{
"stats": [
{
"name": "diskSize",
"units": "GB",
"value": 10
},
{
"name": "diskIopsConsumed",
"value": 0
},
{
"name": "diskConsumedFactor",
"value": 1
}
]
},
{
"stats": [
{
"name": "diskSize",
"units": "GB",
"value": 20
},
{
"name": "diskIopsConsumed",
"value": 1
},
{
"name": "diskConsumedFactor",
"value": "NaN"
}
]
},
{
"stats": [
{
"name": "diskSize",
"units": "GB",
"value": 30
},
{
"name": "diskIopsConsumed",
"value": 0
},
{
"name": "diskConsumedFactor",
"value": 1
}
]
},
],
request2:
input [10,20]
"storageResources": [
{
"stats": [
{
"name": "diskSize",
"units": "GB",
"value": 10
},
{
"name": "diskIopsConsumed",
"value": 0
},
{
"name": "diskConsumedFactor",
"value": 1
}
]
},
{
"stats": [
{
"name": "diskSize",
"units": "GB",
"value": 20
},
{
"name": "diskIopsConsumed",
"value": 1
},
{
"name": "diskConsumedFactor",
"value": "NaN"
}
]
}
],
Is the best way to do this with a function or can you send it by properties?
Use Array.prototype.map to return a modified response
$$text.oninput = evt => {
let json = JSON.parse($$text.value)
let result = json.storageResources.map(resource =>
resource.stats.find(e => e.name == 'diskSize').value
)
console.log(result)
}
$$text.oninput()
<textarea id="$$text">{"storageResources":[{"stats":[{"name":"diskSize","units":"GB","value":10},{"name":"diskIopsConsumed","value":0},{"name":"diskConsumedFactor","value":1}]},{"stats":[{"name":"diskSize","units":"GB","value":20},{"name":"diskIopsConsumed","value":1},{"name":"diskConsumedFactor","value":"NaN"}]},{"stats":[{"name":"diskSize","units":"GB","value":30},{"name":"diskIopsConsumed","value":0},{"name":"diskConsumedFactor","value":1}]}]}</textarea>