I want to style a css list like this
[ 1 ][ 2 ]
[ 3 ][ 4 ]
[ 5 ][ 6 ]
Which is basically no problem when using float:left
But there is a problem, when [ 4 ] is heiger than 3 the following happens:
[ 1 ][ 2 ]
[ 3 ][ 4 ]
[ ]
[ 5 ][ 6 ]
But i want to behave it like this:
[ 1 ][ 2 ]
[ 3 ][ 4 ]
[ 5 ][ ]
[ 7 ][ 6 ]
Please take a look at the problem:
http://xbox360livegold.nl/gastenboek
I don't think you'll be able to do this in pure CSS unless you know ahead of time what each item is going to look like, and I'm assuming this is for the news feed section on the site you lined to. You might be able to use something like the JQuery Masonry library to accomplish it.
If you're okay with the items being displayed from top to bottom instead of left to right, i.e. like this:
[ 1 ][ 4 ]
[ 2 ][ ]
[ 3 ][ 5 ]
then you could use the CSS3 multi-column feature. Setting the column-count to 2 will automatically divide the items into two columns.
Related
So i have this Grafana dashboard that i'm making up using jq and different files. The problem i end up with is that when you export the json produced by Grafana, it will export it the way it sees it currently. Example:
[
{
"gridPos": {
"h": 1,
"w": 24,
"x": 0,
"y": 22
},
"panels": []
},
{
"gridPos": {
"h": 1,
"w": 24,
"x": 0,
"y": 43
},
"panels": []
},
{
"gridPos": {
"h": 1,
"w": 24,
"x": 0,
"y": 17
},
"panels": []
}
]
But the problem is that the grid positions need to be properly incremented (the Y's) so that when you reload the Grafana dashboards, the panels nested under row panels get set to their proper locations. If you have a sub panel that has a gridPos.y that is lower than the row panel's gridPos.y then it will appear in a weird location.
I tried using reduce and foreach but i'm not super good with these constructs yet. For example, i tried this:
[
1 as $currentY |
foreach .[] as $item (
[];
(. + [$item * {"gridPos": {"y": ($currentY + 1)}}]);
. | last
)
]
But i can't figure out how to increment $currentY within the loop to achieve proper incrementation. The objective would be to nest a second foreach/reduce to continue setting and incrementing $currentY in all panels and sub panels.
Can you help? Thanks!
Note: I know i should use reduce when using .|last, this was just the last try. Don't point that out, i want guidance on how to increment $currentY in the current approach.
With your existing approach as such, you need to reference the y field in each $item processed and increment its value, rather than the predefined value of $currentY, i.e.
[
1 as $currentY |
foreach .[] as $item (
[];
(. + [$item * {"gridPos": {"y": ($currentY + $item.gridPos.y )}}]);
last
)
]
which again could be written as
[
1 as $currentY |
foreach .[] as $item (
[];
(. + [ $item | .gridPos.y += $currentY ]);
last
)
]
which again could be written with a simple walk expression
1 as $currentY |
walk ( if type == "object" and has("gridPos") then .gridPos.y += $currentY else . end )
What would be the proper way to summarize 2 sets into 1 set by user?
For example, in the picture below:
I want to create a new set (the column that has the question mark) combining the X_locations and Y_Locations columns by User.
I did try strcat_array, but I am not sure those results will work, is anyone aware of a proper way to do this?, I envision something like this?:
| summarize whateverSetUnionFunctionHere(X_Locations,Y_Locations) by User
You can use the make_set() function, it will create a distinct set from all the sets in the input.
It seems you are looking for the combination of #Avnera & #Yoni K. answers
datatable(User:string, X_locations:dynamic, Y_locations:dynamic)
[
"user1", dynamic(["a"]), dynamic(["a"]),
"user2", dynamic(["b","c"]), dynamic(["c"]),
"user2", dynamic(["b"]), dynamic(["b","d"]),
]
| summarize make_set(set_union(X_locations, Y_locations)) by User
User
set_
user1
["a"]
user2
["b","c","d"]
Fiddle
P.S.
There are multiple variations for that, E.g. set_union could be replaced by array_concat
You can use the set_union() function.
For example:
datatable(User:string, X_locations:dynamic, Y_locations:dynamic)
[
"user1", dynamic(["a"]), dynamic(["a"]),
"user2", dynamic(["b"]), dynamic(["c"]),
"user2", dynamic(["b"]), dynamic(["b"]),
]
| extend result = set_union(X_locations, Y_locations)
User
X_locations
Y_locations
result
user1
[ "a"]
[ "a"]
[ "a"]
user2
[ "b"]
[ "c"]
[ "b", "c"]
user2
[ "b"]
[ "b"]
[ "b"]
I'm trying to send my child components in a reaction app an alternate color as a property, and I'm not really sure how to do it. The color of each CardSimpleRow component must alternate in 4 different colors and once the 4th color is there, it returns to the beginning of the color, let's say. I want to use map because my matrix is dynamic and writing each row of the matrix to render seems unnecessary.
export const FollowScreen = () => {
const alternatingColor = [ ["#d72226", "#a8232a"], ["#123", "#a33a"], ["#f3f3f3", "#a8232a"], ["#dd26", "#a8232a"] ]
return (
<>
{
data.map((elements, index) => {
return <CardSimpleRow
color={index % 4 ? alternatingColor[1] : alternatingColor[0]}
elements={elements}
/>
})
}
</>
)
It's a gradient so I need to send the 1st array, then the 2nd array, then the 3rd, then the 4th and after that go back to the 1st array>
Example if there are 8 CardSimpleRow, I need 4 cards with the array from 0 to 4 and then the other four with the array from 0 to 4 again
If I got it right, you need something like:
alternatingColor[0]
alternatingColor[1]
alternatingColor[2]
alternatingColor[4]
alternatingColor[0]
alternatingColor[1]
...
To obtain that you just need to change a single line:
...
color={alternatingColor[index % 4]}
...
this will access the correct element in alternatingColor by taking the integer remainder based on the index.
Index 0 => remainder of 0 / 4 == 0
Index 1 => remainder of 1 / 4 == 1
...
Index 5 => remainder of 5 / 4 == 1
I have table used Bootstrap 3.
That is option
$('#DT_NoticeList').DataTable({
"paging": true,
"lengthChange": false,
"searching": false,
"ordering": false,
"info": false,
"autoWidth": false,
"pageLength": 15
});
If there are 10 page, how to change the page number 1 to other?
I want to change the page directly in Javascript or code side.
that is mean move page 1 to other in javascript or anyway
like this [ (1) 2 3 4 5 ] -> [ 1 2 (3) 4 5 ]
how to do?
I have a file .txt with 3 columns: ID-polygon-1, ID-polygon-2 and distance.
When I import my file into Netlogo, I obtain 3 lists [[list1][list2][list3]] which corresponds with the 3 columns.
I used table:from-list list to create a table with the content of 3 lists.
I obtain {{table: [[1 1] [67 518] [815 127]]}} (The table displays the first two lines of my dataset).
For example, I would like to get the value of distance (list3) between ID-polygon-1 = 1 (list1) and ID-polygon-2 = 67 (list1), that is, 815.
How can I use table:get table key when I have need of 2 keys (ID-polygon-1 and ID-polygon-2) ?
Thanks very much your help.
Using table:from-list will not help you there: it expects "a list of two element lists, or pairs" where the "the first element in the pair is the key and the second element is the value." That's not what you have in your original list.
Furthermore, NetLogo tables (and associative arrays in general) cannot have two keys. They are always just key-value pairs. Nothing prevents the value from being another table, however, and in your case, that is what you need: a table of tables!
There is no primitive to build that directly, however. You will need to build it yourself:
extensions [ table ]
globals [ t ]
to setup
let lists [
[ 1 1 ] ; ID-polygon-1 column
[ 67 518 ] ; ID-polygon-2 column
[ 815 127 ] ; distance column
]
set t table:make
foreach n-values length first lists [ ? ] [
let id1 item ? (item 0 lists)
let id2 item ? (item 1 lists)
let dist item ? (item 2 lists)
if not table:has-key? t id1 [
table:put t id1 table:make
]
table:put (table:get t id1) id2 dist
]
end
Here is what you get when you print the resulting table:
{{table: [[1 {{table: [[67 815] [518 127]]}}]]}}
And here is a small reporter to make it convenient to get a distance from the table:
to-report get-dist [ id1 id2 ]
report table:get (table:get t id1) id2
end
Using get-dist 1 67 will give the 815 result you were looking for.