Lodash - filter by string 1,2 - filter

I have string
"1,2" // which is from the db.field
I am trying to filter with lodash and some thing like the following worked
_.filter(jsonArray, function(res) { return (res.id == 1 || res.id == 2); });
Please assume jsonArray as follows:
[
{ 'id': '1', 'age': 60 },
{ 'id': '2', 'age': 70 },
{ 'id': '3', 'age': 22 },
{ 'id': '4', 'age': 33 }
];
here the problem is I need to split the sting 1,2 and apply,
But note that 1,2 is not always 1,2 - it could be 1,2,3 and this string is dynamic from db.field.
Now I am searching if there is any way I can just use the string say like
-.filter(jsonArray, function(res){ return res.id <is equal to one of the value in 1,2,3,4 >})
I think its obvious the split this string into array and ... but I am not sure of doing it, help it out please.

You first need to split db.field to make it as array of ids that can be evaluated easily when matching items. Next, use the filter() that you've already constructed to check if such items match the ids using includes.
var ids = db.field.split(',').map(Number);
var result = _.filter(jsonArray, function(res) {
return _.includes(ids, res.id);
});
var db = { field: '1,2' };
var jsonArray = [
{ 'id': 1, 'age': 60 },
{ 'id': 2, 'age': 70 },
{ 'id': 3, 'age': 22 },
{ 'id': 4, 'age': 33 }
];
var ids = db.field.split(',').map(Number);
var result = _.filter(jsonArray, function(res) {
return _.includes(ids, res.id);
});
document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');
<script src="https://cdn.jsdelivr.net/lodash/4.12.0/lodash.min.js"></script>

Related

adding function to loops through

I need to search in a big json nested collection which have unique IDs recursively. The collection contains key values or nested arrays which contains keys. Keys can be anywhere in the object. Keys can be number or string.
Please note: Key values are unique if they are not in array. If they are in array, the key duplicates per items in array. For example,
"WebData": {
WA1: 3, //not in array so unique
WA3: 2, so unique
WA3: "NEO",
WebGroup : [
{ Web1: 1, //duplicate Web1
Web2: 2
},
{ Web1: 2, //duplicate Web2
Web2: 2
}]
}
What I want:
I will pass an array of keys in different variations for example
Not in Arrays: I will pass key return either their values or sum for example:
function(["WA1",""WA3", "RAE1"],"notsum")
If I pass (not sum)
["WA1",""WA3", "RAE1"]
and the operation is not "sum", it should return an array of their values from the collection
[3,2,1]
If I pass the same but operation is sum)
function(["WA1",""WA3", "RAE1"],"sum")
["WA1",""WA3", "RAE1"]
it should return sum from the collection
return 6
If in Array: If the value to search are in the array means they duplicate, then it should return me sum or their individual values again For example
["WEB1","Web2"]
. It could either return me,
[7,1] //Again total of 3+4, 0+1 //see in example
or
[[3,4],[0,1]] //Because values are duplicate and in array, just collect them
I need to do in an elegant way:
Full example of JSON:
{
version: "1.0"
submission : "editing"
"WebData": {
WA1: 3,
WA3: 2,
WA3: "NEO",
WebGroup : [
{ Web1: 3,
Web2: 0
},
{ Web1: 4,
Web2: 1
}]
},
"NonWebData": {
NWA1: 3,
NWA2: "INP",
NWA3: 2,
},
"FormInputs": {
FM11: 3,
FM12: 1,
FM13: 2,
"RawData" : {
"RawOverview": {
"RAE1" : 1,
"RAE2" : 1,
},
"RawGroups":[
{
"name": "A1",
"id": "1",
"data":{
"AD1": 'period',
"AD2": 2,
"AD3": 2,
"transfers": [
{
"type": "in",
"TT1": 1,
"TT2": 2,
},
{
"type": "out",
"TT1": 1,
"TT2": 2,
}
]
}
},
{
"name": "A2",
"id": "2",
"data":{
"AD1": 'period',
"AD2": 2,
"AD3": 2,
"transfers": [
{
"type": "in",
"TT1": 1,
"TT2": 2,
},
{
"type": "out",
"TT1": 1,
"TT2": 2,
}
]
}
}
]
},
"Other":
{ O1: 1,
O2: 2,
O3: "hello"
},
"AddedBy": "name"
"AddedDate": "11/02/2019"
}
I am not able to write a function here, which can do this for me, my code is simply searching in this array, and I loop through to find it, which is I am sure not the correct way.
My code is not elegant, and I am using somehow repetitive functions. This is just one snippet, to find out the keys in one level. I want only 1 or 2 functions to do all this
function Search(paramKey, formDataArray) {
var varParams = [];
for (var key in formDataArray) {
if (formDataArray.hasOwnProperty(key)) {
var val = formDataArray[key];
for (var ikey in val) {
if (val.hasOwnProperty(ikey)) {
if (ikey == paramKey)
varParams.push(val[ikey]);
}
}
}
}
return varParams;
}
One more test case if in Array: to Return only single array of values, without adding. (Update - I achieved this through editing the code following part)
notsumsingle: function (target, key, value) {
if (target[key] === undefined) {
target[key] = value;
return;
}
target.push(value);
},
"groupData": [
{
"A1G1": 1,
"A1G2": 22,
"AIG3": 4,
"AIG4": "Rob"
},
{
"A1G1": 1,
"A1G2": 41,
"AIG3": 3,
"AIG4": "John"
},
{
"A1G1": 1,
"A1G2": 3,
"AIG3": 1,
"AIG4": "Andy"
}
],
perform(["AIG2",""AIG4"], "notsum")
It is returning me
[
[
22,
41,
3
]
],
[
[
"",
"Ron",
"Andy"
]
]
Instead, can I add one more variation "SingleArray" like "sum" and "notsum" and get the result as single Array.
[
22,
41,
3
]
[
"",
"Ron",
"Andy"
]
4th one, I asked, is it possible the function intelligent enough to pick up the sum of arrays or sum of individual fields automatically. for example, in your example, you have used "sum" and "total" to identify that.
console.log(perform(["WA1", "WA3", "RAE1"], "total")); // 6
console.log(perform(["Web1", "Web2"], "sum")); // [7, 1]
Can the function, just use "sum" and returns single or array based on if it finds array, return [7,1] if not return 6
5th : I found an issue in the code, if the json collection is added this way
perform(["RAE1"], "notsum") //[[1,1]]
perform(["RAE1"], "sum") //2
It returns [1, 1], or 2 although there is only one RAE1 defined and please note it is not an array [] so it should not be encoded into [[]] array, just the object key
"RawData" : {
"RawOverview": {
"RAE1" : 1,
"RAE2" : 1,
}
For making it easier, and to take the same interface for getting sums or not sums and a total, without any array, you could introduce another operation string total for getting the sum of all keys.
This approach takes an object for getting a function which either add an value to an array at the same index or stores the value at an specified index, which match the given keys array of the function.
For iterating the object, you could take the key/value pairs and iterate until no more object is found.
As result, you get an array, or the total sum of all items.
BTW, the keys of an object are case sensitive, for example 'WEB1' does not match 'Web1'.
function perform(keys, operation) {
function visit(object) {
Object
.entries(object)
.forEach(([k, v]) => {
if (k in indices) return fn(result, indices[k], v);
if (v && typeof v === 'object') visit(v);
});
}
var result = [],
indices = Object.assign({}, ...keys.map((k, i) => ({ [k]: i }))),
fn = {
notsum: function (target, key, value) {
if (target[key] === undefined) {
target[key] = value;
return;
}
if (!Array.isArray(target[key])) {
target[key] = [target[key]];
}
target[key].push(value);
},
sum: function (target, key, value) {
target[key] = (target[key] || 0) + value;
}
}[operation === 'total' ? 'sum' : operation];
visit(data);
return operation === 'total'
? result.reduce((a, b) => a + b)
: result;
}
var data = { version: "1.0", submission: "editing", WebData: { WA1: 3, WA3: 2, WAX: "NEO", WebGroup: [{ Web1: 3, Web2: 0 }, { Web1: 4, Web2: 1 }] }, NonWebData: { NWA1: 3, NWA2: "INP", NWA3: 2 }, FormInputs: { FM11: 3, FM12: 1, FM13: 2 }, RawData: { RawOverview: { RAE1: 1, RAE2: 1 }, RawGroups: [{ name: "A1", id: "1", data: { AD1: 'period', AD2: 2, AD3: 2, transfers: [{ type: "in", TT1: 1, TT2: 2 }, { type: "out", TT1: 1, TT2: 2 }] } }, { name: "A2", id: "2", data: { AD1: 'period', AD2: 2, AD3: 2, transfers: [{ type: "in", TT1: 1, TT2: 2 }, { type: "out", TT1: 1, TT2: 2 }] } }] }, Other: { O1: 1, O2: 2, O3: "hello" }, AddedBy: "name", AddedDate: "11/02/2019" };
console.log(perform(["WA1", "WA3", "RAE1"], "notsum")); // [3, 2, 1]
console.log(perform(["WA1", "WA3", "RAE1"], "total")); // 6
console.log(perform(["Web1", "Web2"], "sum")); // [7, 1]
console.log(perform(["Web1", "Web2"], "notsum")); // [[3, 4], [0, 1]]
.as-console-wrapper { max-height: 100% !important; top: 0; }

How to validate if sum of values are equal in Validation

I have this accounting project where I need to validate if debit and credit are equal before saving to the database.
e.g
accounts: [
{
id: 1,
account_id: 1,
debit: 1000
},
{
id: 2,
account_id: 5,
credit: 1500
},
{
id: 3,
account_id: 8,
debit: 500
}
]
By the way I am using axios and lodash.
axios.post('/api/journals', {
accounts : map(this.accounts, function(account) {
account_id: account.account_id,
debit: account.debit,
credit: account.credit
})
}
Can anyone suggest how to implement this validation rule.
The validation rule has nothing to do with Laravel or VueJS. All you need is to use lodash to iterate through your accounts array, sum the debit and credit numbers separately, and compare them thereafter:
var debitSum = _.reduce(data.accounts, function(sum, account) {
return (account.debit || 0) + sum;
}, 0);
var creditSum = _.reduce(data.accounts, function(sum, account) {
return (account.credit || 0) + sum;
}, 0);
console.log('Debit: ' + debitSum + '; Credit: ' + creditSum);
if (debitSum !== creditSum) {
// Debit and credit sums do not match
} else {
// Debit and credit sums match
}
The code above uses the _.reduce() method to calculate the sum of debit/credit amounts. Since debit and credit keys are not guanranteed to be present all the time, we use the || operator to assign a value of 0 when it is falsy (e.g. undefined, null, 0, empty string, etc.)
Here's a proof-of-concept example:
var data = { accounts: [{
id: 1,
account_id: 1,
debit: 1000
},
{
id: 2,
account_id: 5,
credit: 1500
},
{
id: 3,
account_id: 8,
debit: 500
}
]};
var debitSum = _.reduce(data.accounts, function(sum, account) {
return (account.debit || 0) + sum;
}, 0);
var creditSum = _.reduce(data.accounts, function(sum, account) {
return (account.credit || 0) + sum;
}, 0);
console.log('Debit: ' + debitSum + '; Credit: ' + creditSum);
if (debitSum !== creditSum) {
console.log('Debit and credit are not equal!');
} else {
console.log('All ok');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>

C3.js combination chart with time series - tooltip not functional

I've been trying for 3 days to get this chart to display the way I want it to. Everything was working 100% until I realized the grouped bar chart numbers were off.
Example: When the bottom bar value equals 10 and the top bar value equals 20, the top of the grouped bar read 30. This is the default behavior, but not how I want to represent my data. I want the top of the grouped bar to read whatever the highest number is, which lead me to this fiddle representing the data exactly how I wanted to.
After refactoring my logic, this is what I have so far. As you can see the timeseries line is broken up and the tooltip is not rendering the group of data being hovered over.
My questions:
1) How to get the tooltip to render all three data points (qty, price, searches)
2) How to solidify the timeseries line so it's not disconnected
Any help would be greatly appreciated so I can move on from this 3 day headache!
Below is most of my code - excluding the JSON array for brevity, which is obtainable at my jsfiddle link above. Thank you in advance for your time.
var chart = c3.generate({
bindto: '#chart',
data: {
x: 'x-axis',
type: 'bar',
json: json,
xFormat: '%Y-%m-%d',
keys: {
x: 'x-axis',
y: 'searches',
value: ['qty', 'searches', 'price']
},
types: {
searches: 'line'
},
groups: [
['qty', 'price']
],
axes: {
qty: 'y',
searches: 'y2'
},
names: {
qty: 'Quantity',
searches: 'Searches',
price: 'Price ($)'
},
colors: {
price: 'rgb(153, 153, 153)',
qty: 'rgb(217, 217, 217)',
searches: 'rgb(255, 127, 14)'
}
},
bar: {
width: {
ratio: 0.60
}
},
axis: {
x: {
type: 'timeseries',
label: { text: 'Timeline', position: 'outer-right' },
tick: {
format: '%Y-%m-%d'
}
},
y: {
type: 'bar',
label: {
text: 'Quantity / Price',
position: 'outer-middle'
}
},
y2: {
show: true,
label: {
text: 'Searches',
position: 'outer-middle'
}
}
},
tooltip: {
grouped: true,
contents: function(d, defaultTitleFormat, defaultValueFormat, color) {
var data = this.api.data.shown().map(function(series) {
var matchArr = series.values.filter(function(datum) {
return datum.value != undefined && datum.x === d[0].x;
});
if (matchArr.length > 0) {
matchArr[0].name = series.id;
return matchArr[0];
}
});
return this.getTooltipContent(data, defaultTitleFormat, defaultValueFormat, color);
}
}
});
1) If I got it right, you want tooltip to show all values, even if some of them are null.
Null values are hidden by default. You can replace them with zero (if it is suitable for your task) and thus make them visible.
Also, it seems to me that there is a shorter way to get grouped values:
var data = chart.internal.api.data().map(function(item) {
var row = item.values[d[0].index]; // get data for selected index
if (row.value === null) row.value = 0; // make null visible
return row;
});
2) I think you are talking about line.connectNull option:
line: {
connectNull: true
}
UPDATE
Looks like having duplicate keys breaks work of api.data() method.
You need to change json structure to make keys unique:
Before:
var json = [
{"x-axis":"2017-07-17","qty":100},
{"x-axis":"2017-07-17","price":111},
{"x-axis":"2017-07-17","searches":1},
{"x-axis":"2017-07-18","qty":200},
{"x-axis":"2017-07-18","price":222},
{"x-axis":"2017-07-18","searches":2}
];
After:
var json = [
{"x-axis":"2017-07-17","qty":100,"price":111,"searches":1},
{"x-axis":"2017-07-18","qty":200,"price":222,"searches":2}
];
See fiddle.

jqGrid - formoptions rowpos and colpos is being used to create 3 column View form. How can you make 1 row's data field colspan the full width/

If I have configured the formoptions to create a form with 6 columns (3 for labels and 3 for data) and I want 1 row in the form to have 2 columns (1 for label and 1 for data that is the full width of the form), how can I do this?
I've tried using colSpan and looking at this example but could not get it to work.
Here's the structure of my jqGrid:
colModel :[ {
label: 'Row 1 Column 1',
name: 'a',
formoptions: {
colpos: 1, // the position of the column
rowpos: 1, // the position of the row
}
}, {
label: 'Row 1 Column 2',
name: 'b',
formoptions: {
colpos: 2, // the position of the column
rowpos: 1, // the position of the row
}
}, {
label: 'Row 1 Column 3',
name: 'c',
formoptions: {
colpos: 3, // the position of the column
rowpos: 1, // the position of the row
}
}, {
label: 'Row 2 Full Width',
name: 'd',
formoptions: {
colpos: 1, // the position of the column
rowpos: 2, // the position of the row
}],
and the configuration of the view form options
{
//edit options
},
{
//add options
},
{
//del options
},
{
//search options
},
{
//view options
width : 1000,
labelswidth :50,
viewPagerButtons : false,
closeOnEscape : true,
beforeShowForm: function(form) {
var dlgDiv = $("#viewmod" + mygrid[0].id);
var parentDiv = dlgDiv.parent();
var dlgWidth = dlgDiv.width();
var parentWidth = parentDiv.width();
var dlgHeight = dlgDiv.height();
var parentHeight = parentDiv.height();
dlgDiv[0].style.top = Math.round((parentHeight-dlgHeight)/2) + "px";
dlgDiv[0].style.left = Math.round((parentWidth-dlgWidth)/2) + "px";
var $tr = $("#trd_d"), // 'name' is the column name
$label = $tr.children("td.CaptionTD"),
$data = $tr.children("td.DataTD");
$data.attr("colspan", "5");
$data.children("input").css("width", "95%");
$label.hide();
}
};
You need to hide some unneeded columns in the second row of the View. The code of beforeShowForm could be like below
beforeShowForm: function ($form) {
var $captionTds = $("#trv_d>td.CaptionTD"),
$dataTds = $("#trv_d>td.DataTD");
$captionTds.filter(":gt(0)").hide();
$dataTds.filter(":gt(0)").hide();
$dataTds.first().attr("colspan", 5);
}
I'd recommend you additionally to use formViewing option to specify View options. It makes the code more readable. See https://jsfiddle.net/OlegKi/4xyf0adw/

Get specific object field with condition and make opertion on it

I have objects like this:
{
buildings: {
"1": {
"l": 0 ,
"r": 0 ,
"s": 0 ,
"type": "GoldMine" ,
"x": 2 ,
"y": 15
} ,
"10": {
"l": 0 ,
"r": 6 ,
"s": 2 ,
"type": "MagicMine" ,
"x": 26 ,
"y": 22
}
} ,
[...]
}
I want to get objects with buildings of type "GoldMine".
I tried something with map:
r.table("Characters").map(function(row) {
return row("planet")("buildings")
})
With keys() I can iterate it:
r.db("Unnyworld").table("Characters").map(function(row) {
return row("planet")("buildings").keys().map(function(key) {
return "need to get only buildings with type == GoldMine";
})
}).limit(2)
But it returns all buildings. I want to get only buildings with type == GoldMine and change field x.
Something like this may work:
r.table('Characters')
.concatMap(function(doc) {
return doc("planet")("buildings").keys().map(function(k) {
return {id: doc('id'), key: k, type: doc("planet")("buildings")(k)('type'), x: doc("planet")("buildings")(k)('x')}
})
})
.filter(function(building) {
return building('type').eq('GoldMine')
})
.forEach(function(doc) {
return r.table('Characters').get(doc('id'))
.update({
planet: {buildings: r.object(doc('key'), {x: 1111111})}
})
})
Basically create a flat array from building by using concatMap then filter it. With result data, we can iterator over it and update to value that we want.

Resources