I'm using jqPlot and I need to turn this JSON which I receive from a WCF service:
[{ "x": 2, "y": 3 }, { "x": 25, "y": 34 }]
into this array or arrays:
[[2,3],[25,34]]
I've tried JSON.parse & eval but to no avail.
thanks
You can use $.map() to do that:
var data = [{ "x": 2, "y": 3 }, { "x": 25, "y": 34 }]
var flattenedResult = $.map(data, function(point) {
return [[ point.x, point.y ]];
});
Parse the string into an array of objects:
var json = '[{ "x": 2, "y": 3 }, { "x": 25, "y": 34 }]';
var o = $.parseJSON(json);
Then replace each object in the array with an array:
for (var i=0; i<o.length; i++) o[i] = [o[i].x, o[i].y];
Related
I have an array of Vector3 that will make up/draw a path.
From every point onwards I want to see which direction the next point will be. Straight or left or right if the angle is steep enough.
What I tried
I creating an Object3D on every vector of the array and then pointing that (with lookAt) to the next vector. But the rotation of the tempObject is NaN when I do.
I created two Object3D to get the second object's world position.
What I expect
I want to store the angle in radians or degrees of every Object3D to determine its direction.
const path = [
{ "x": -2.47, "y": 0, "z": 7.61 },
{ "x": -2.14, "y": 0, "z": 6.63 },
{ "x": -1.09, "y": 0, "z": 2.33 },
{ "x": -1.06, "y": 0, "z": 0.8 },
{ "x": -1.83, "y": 0, "z": 0.71 },
{ "x": -9.12, "y": 0, "z": 0.39 },
{ "x": -9.48, "y": 0, "z": -0.66 }
];
if (path.length > 2) {
let index = 0;
const pathSegments = Math.floor(path.length / 2);
for (let i = 0; i<pathSegments; i++) {
const v1 = path[index];
const v2 = path[index+1];
// Fake object
const tempObject = new THREE.Object3D();
tempObject.position.set(v1);
tempObject.lookAt(v2);
console.log(tempObject.rotation);
}
}
I might be going about this the wrong way. Any help or points would be great!
The objects in your path array have to be of type THREE.Vector3. Beside, Vector3.set() does not accept an instance of THREE.Vector3 as an argument. So use the following or THREE.Vector3.copy():
tempObject.position.set(v1.x, v1.y, v1.z);
This should solve the NaN issue.
I am having trouble reformatting an Object array in Javascript. I have an array that looks like this:
[
{
"deviceid": 42,
"x": "2022-03-26T00:00:18",
"y": 17.8,
},
{
"deviceid": 42,
"x": "2022-03-26T00:01:18",
"y": 17.8,
},
{
"deviceid": 43,
"x": "2022-03-26T00:02:18",
"y": 17.8,
{
"deviceid": 43,
"x": "2022-03-26T00:02:18",
"y": 17.8,
}]
I want to re-shape it so the new form will be one record per device id and all x and y values in the same row.
[
{
"deviceid": 42,
"x": ["2022-03-26T00:00:18","2022-03-27T00:00:18"],
"y": [17.8, 15.6],
},
{
"deviceid": 43,
"x": ["2022-03-26T00:01:18","2022-03-27T00:00:18"],
"y": [17.8, 19.1],
}]
How can I make this happen?
You can use reduce() to do the reduction of your values using a JavaScript object. After the reduction get the values of the object using Object.values().
const data = [
{
deviceid: 42,
x: "2022-03-26T00:00:18",
y: 17.8,
},
{
deviceid: 42,
x: "2022-03-26T00:01:18",
y: 15.6,
},
{
deviceid: 43,
x: "2022-03-26T00:02:18",
y: 17.8,
},
{
deviceid: 43,
x: "2022-03-26T00:02:18",
y: 19.1,
},
];
const result = data.reduce((devices, device) => {
// check if we have encountered this decive before using the deviceId
if (!devices.hasOwnProperty(device.deviceid)) {
// we have not: create an key-value pair using device ID as key and device info as value
// use an array for x and y
devices[device.deviceid] = {
deviceId: device.deviceid,
x: [device.x],
y: [device.y],
};
} else {
// we have seen this device before
// get the device value using the key (deviceId) and push new x and y values to it
const curDev = devices[device.deviceid];
curDev.x.push(device.x);
curDev.y.push(device.y);
}
// return JS object of devices for next iteration/ result
return devices;
}, {});
console.log(Object.values(result));
Please note: I think the input you have provided in your question contains some errors probably from copy/ pasting as the expected output contains values that are not in the input at all. I have changed values of y in the input to show you that output is actually what you expect.
I have the Following JavaScript Object JSON1
{
"1": {
"Average": 32.31,
"Count": 19,
"Sum": 32.6,
"Color": "red"
},
"2": {
"Average": 32.72,
"Count": 18,
"Sum": 32.96,
"Color": "blue"
},
"3": {
"Average": 31.4,
"Count": 18,
"Sum": 31.48,
"Color": "green"
}
}
and I want to convert into the following format using javascript ES6 methods. JSON2
[{
"title": "Average",
"val1": 32.31,
"val2": 32.72,
"val3": 31.4
}, {
"title": "Count",
"val1": 19,
"val2": 18,
"val3": 18
}, {
"title": "Sum",
"val1": 32.6,
"val2": 32.96,
"val3": 31.48
}, {
"title": "Color",
"val1": "red",
"val2": "blue",
"val3": "green"
}]
Object.keys(json1).forEach((item, index) => {
let statsList = [];
Object.keys(json1[item]).forEach(objItem => {
statsList.push({
title: objItem,
val1: boxObj[1][objItem],
val2: boxObj[2][objItem],
val3: boxObj[3][objItem]
});
});
console.log(statsList)
});
var json1 = {
"1": {
"Average": 32.31,
"Count": 19,
"Sum": 32.6,
"Color": "red"
},
"2": {
"Average": 32.72,
"Count": 18,
"Sum": 32.96,
"Color": "blue"
},
"3": {
"Average": 31.4,
"Count": 18,
"Sum": 31.48,
"Color": "green"
}
};
Object.keys(json1).forEach((item, index) => {
let statsList = [];
Object.keys(json1[item]).forEach(objItem => {
statsList.push({
title: objItem,
val1: boxObj[1][objItem],
val2: boxObj[2][objItem],
val3: boxObj[3][objItem]
});
});
console.log(statsList)
});
Here in the JSON1, the Number of objects can be any number. It has to format it Dynamically. In the JSON2, Instead of val1,val2 anything can be used uniquely identifiable keys in all the objects present in the array. I have tried using forEach, I was able to achieve it with static keys provided, and with the multiple looping statements. I just want with dynamic keys and avoiding multiple loops and I want to know what is the best and easiest way to do this formatting in Javascript. Advance Thanks for your help.
You may traverse source Object.values() with Array.prototype.reduce() to make up an object that will map each category to all possible values.
Then, you may Array.prototype.map() resulting Object.entries() to return an array of objects with desired structure:
const src = {"1":{"Average":32.31,"Count":19,"Sum":32.6,"Color":"red"},"2":{"Average":32.72,"Count":18,"Sum":32.96,"Color":"blue"},"3":{"Average":31.4,"Count":18,"Sum":31.48,"Color":"green"}},
resultMap = Object
.values(src)
.reduce((r,o,i) => (
Object
.entries(o)
.forEach(([key,value]) =>
(r[key]=r[key]||{}, r[key][`value${i+1}`] = value))
,r),{}),
result = Object
.entries(resultMap)
.map(([name,{...values}]) => ({name,...values}))
console.log(result)
.as-console-wrapper{min-height:100%;}
If only unique items in each category are required, you may somewhat modify above solution, making use of Set():
const src = {"1":{"Average":32.31,"Count":19,"Sum":32.6,"Color":"red"},"2":{"Average":32.72,"Count":18,"Sum":32.96,"Color":"blue"},"3":{"Average":31.4,"Count":18,"Sum":31.48,"Color":"green"}},
resultMap = Object
.values(src)
.reduce((r,o,i) => (
Object
.entries(o)
.forEach(([key,value]) =>
(r[key]=r[key]||(new Set()), r[key].add(value)))
,r),{}),
result = Object
.entries(resultMap)
.map(([name,values]) => ({
name,
...([...values].reduce((r,v,i) => (r[`value${i+1}`]=v, r),{}))
}))
console.log(result)
.as-console-wrapper{min-height:100%;}
You may see your data as a matrix: each row is a feature and each column a dimension
What you have is the data expressed a rows
And what you would like is the data expressed as columns
So what you want is the transpose of your matrix
Let's recall that taking the transpose can be done as: T[j][i] = M[i][j] forall i,j
In your case
for each index of row i in M
for each index of column j in M
// T[j] is your aggregated record
// i being the index of the row has to be renamed 'val'+i
// and you add the property: title: columnOfJ to record T[j]
T[j]['val' + i] = M[i][j]
T[j].title = col corresponding to index j
const M = {"1":{"Average":32.31,"Count":19,"Sum":32.6,"Color":"red"},"2":{"Average":32.72,"Count":18,"Sum":32.96,"Color":"blue"},"3":{"Average":31.4,"Count":18,"Sum":31.48,"Color":"green"}}
const T = []
Object.entries(M).forEach(([i, Mi]) => {
Object.keys(Mi).forEach((col, j) => {
T[j] = T[j] || {}
T[j].title = col // we just put the title before so it is the first entry in your record...
T[j]['val' + i] = Mi[col]
})
})
console.log(T)
I have a small issue with the parameter direction of the function getConnectedNodes() based on the Vis.js documentation (search for "getConnectedNodes" in the link)
Any idea to get the direction of the edges using the parameter (i don't know how to)?
JSON Example
[
{ "x": 0, "y": 0, "id": "0", "connections": [ 2 ] // i think here should be a from?},
{ "x": 200, "y": 0, "id": "1", "connections": [ 3, 2 ] },
{ "x": 500, "y": 500, "id": "2", "connections": [ 0, 1 ] },
{ "x": 300, "y": -200, "id": "3", "connections": [ 1 ] }
]
Here part of the code
google.script.run.withSuccessHandler(([nodes, edges]) => new vis.Network(container, {nodes: nodes, edges: edges}, options)).sample();
let network;
function init() {
container = document.getElementById('mynetwork');
exportArea = document.getElementById('input_output');
network = google.script.run.withSuccessHandler(([nodes, edges]) => {network = new vis.Network(container, {nodes: nodes, edges: edges}, options);}).sample();
};
function addConnections(elem, index) {
elem.connections = network.getConnectedNodes(index); < I THINK THE PROBLEM IS HERE
}
function exportNetwork() {
var nodes = objectToArray(network.getPositions());
nodes.forEach(addConnections);
var exportValue = JSON.stringify(nodes, undefined, 2);
exportArea.innerHTML = exportValue;
}
function objectToArray(obj) {
return Object.keys(obj).map(function(key) {
obj[key].id = key;
return obj[key];
});
}
Before hand, thanks a lot!
index is the index of the array like 0, 1, 2,,,. The start index is 0. On the other hand, elem is the object like {x: ###, y: ###, id: ###}. From these situation, I thought that index of getConnectedNodes(index) might be elem.id. So how about the following modification?
From:
elem.connections = network.getConnectedNodes(index);
To:
elem.connections = network.getConnectedNodes(elem.id, "from");
From the document, if you want to retrieve "parent", you can retrieve it by adding from to the argument.
For a node id, returns an array with the id's of the connected nodes.
If optional parameter direction is set to string 'from', only parent nodes are returned.
If direction is set to 'to', only child nodes are returned.
Any other value or undefined returns both parent and child nodes.
When you want to retrieve "child", please add to to the argument instead of from.
I am trying to write a function that can take a field name as an argument and return an array of corresponding values from a bit of JSON.
Example object:
var myObject = [
{"x": 10, "y": 10},
{"x": 20, "y": 10},
{"x": 20, "y": 20},
{"x": 10, "y": 20}
];
My function looks something like this:
function getValues(desiredValue) {
var values = [];
for (i = 0; i < myObject.length; i++) {
values[i] = myObject[i].desiredValue;
}
return values;
}
getValues(x);
Ideally, I would have the argument x passed to the getValues which, instead of looking for a field name called desiredValue would look for a field name called x.
The returned array should look like this:
[10,20,20,10]
As the problem with this code is obvious, how can I get the desired result?
Also, I am trying to avoid unnecessary dependencies, so please don’t give me any JQuery unless absolutely necessary.
You can use map() to return desired result.
var myObject = [
{"x": 10, "y": 10},
{"x": 20, "y": 10},
{"x": 20, "y": 20},
{"x": 10, "y": 20}
];
function getValues(desiredValue) {
return myObject.map(e => e[desiredValue]);
}
console.log(getValues('x'))
You actually need to parse the given JSON string (not the array that you have given here) by using JSON.parse(). See: http://jsbin.com/kevoqe/edit?js,console
a simple utility
//also accepts a path like "foo.bar.baz"
//returns undefined if path can't be resolved
function fetch(path){
var keys = path.split(".");
return function( target ){
for(var t = target, i = 0; i < keys.length; t = t[ keys[ i++ ] ])
if(t == null) return void 0;
return t;
}
}
and it's usage
var myObject = [
{"x": 10, "y": 10},
{"x": 20, "y": 10},
{"x": 20, "y": 20},
{"x": 10, "y": 20}
];
var result = myObject.map( fetch("y") );
this version is a bit more flexible than one hardwired with Array.map() because it can easily be composed with other functions.
Although, especially in this particular case, this already is a little bit of overkill. here you can easily write:
var result = myObject.map(pt => pt.y);
you can't get any shorter and simpler. Or if for some reason the property really is dynamic, you'll have some variable containing it:
var dynamicPropertyName = "y";
//...
var result = myObject.map(pt => pt[ dynamicPropertyName ]);
Use array map method to do manipulation in an array of objects.
Try this code :
var myObject = [
{"x": 10, "y": 10},
{"x": 20, "y": 10},
{"x": 20, "y": 20},
{"x": 10, "y": 20}
];
var output = getValues("x");
console.log(output);
function getValues(desiredValue) {
return myObject.map(function(item) {
return item[desiredValue];
});
}
Output :
Working fiddle : https://jsfiddle.net/ffyjyzjb/