Is it possible to create Manhattan Style edges in a space tree using inforVis/jit.
It is not an option on: http://philogb.github.com/jit/static/v20/Docs/files/Options/Options-Edge-js.html. But i see that custom edges are possible.
Has anyone already done this?
If you have not figured this out already (and for other readers)...
While passing constructor options, try specifying edge type as bent:line, somewhat like the following.
Edge: {
type: 'bent:line',
overridable: true,
color: "#000000",
lineWidth: 2
}
Use This
https://philogb.github.io/jit/static/v20/Docs/files/Visualizations/Spacetree-js.html#ST.Plot.EdgeTypes
ST.Plot.EdgeTypes
This class contains a list of Graph.Adjacence built-in types. Edge types implemented are ‘none’, ‘line’, ‘arrow’, ‘quadratic:begin’, ‘quadratic:end’, ‘bezier’.
You can add your custom edge types, customizing your visualization to the extreme.
Related
I have a symbol S1 with two shapes (lets say sh0 and sh1). On the stage I have an instance of another symbol mc. At run time, I will create an instance mc1 of the symbol S1. Using createjs, how can I use mc1 as a mask for mc?
I assume when you say "symbol", you mean a graphic or MovieClip in Adobe Animate. Unfortunately, you can only use a CreateJS "Shape" as a mask directly. There are a few options:
Combine the shapes into one yourself.
Combine the instructions. This is a bit dirty, but you could in theory concat the graphic instructions from one shape into another. I suspect this would have issues if the Shape instances have different x/y positions.
symbol.shape1.graphics._instructions.concat(symbol.shape2.graphics._instructions);
Cache the symbol as use it as a Mask with AlphaMaskFilter. The example in the documents should get you what you want.
var box = yourSymbol;
box.cache(0, 0, 100, 100);
var bmp = new createjs.Bitmap("path/to/image.jpg");
bmp.filters = [
new createjs.AlphaMaskFilter(box.cacheCanvas)
];
bmp.cache(0, 0, 100, 100);
The 3rd is probably your best option, but it is limiting and can be performance intensive due to the use of the filter (especially if content changes and you have to update it constantly).
Feel free to post more details on what you are working with in order to get a better recommendation.
Cheers.
In the concentric layout in cytoscape.js, it is possible to set which "layer" of the circle the nodes are in through the concentric variable of the layout:
concentric: function( node ){
return node.data("rank");
}
Is there a similar function to this in ipycytoscape?
not sure if I already replied to your question on github, but this is a known issue, we need to implement a specific case for the concentric style. You can follow the issue here:https://github.com/cytoscape/ipycytoscape/issues/238
Thanks!
I render a graph using visjs. The shape of the nodes are of type dot. Each node is given a custom size using the size attribute.
When the graph is rendered some of the nodes overlap. So the graph looks like in the following picture:
I expected a graph like the this picture is showing:
What am I doing wrong?
Try to use the physics configuration.
see this example of visjs.
GOOD LUCK.
To be more specific compared to the TERMIN's answer, in the physics configuration example you can see (at least for the barnesHut solver) that increasing avoidOverlap prevents overlapping even when springConstant is equal to zero and
var options = {
"physics": {
"barnesHut": {
"avoidOverlap": 0.2
}
}
}
is probably enough (but you may increase the value according to your needs).
Using Cytoscape.js, how can I constrain movement of a node to a single (i.e. either the x or y) axis? I'd like to be able to make it so a node can only be dragged vertically or horizontally, but not both. In other words, I'd like to lock a node, but only on a single axis. I'm not sure if this is possible, and wasn't able to find anything in the documentation that mentioned this specifically, so I figured I'd ask.
Thanks in advance!
Use the automove extension, which lets you set whatever restrictions on node positioning that you like. Constraining the x value is as easy as passing a (x, y) => { return { xConst, y }; } function to the extension.
I ended up coming up with a way to approximate the result that I wanted by listening for each node's free event, and setting its position to what I needed it to be. This doesn't restrict dragging of nodes to a single axis, but it does restrict dropping of nodes to a single axis, if that makes sense.
Here is the Cytoscape.js description of the free event:
free : when an element is freed (i.e. let go from being grabbed)
from: http://js.cytoscape.org/#events/collection-events
http://i.stack.imgur.com/kcOxx.jpg
Look at the picture, I want to achieve something like this in OGRE, but I have no idea about this.
I am trying to make a SLG game with OGRE now, and the first step is to show the mesh.
I am a Chinese student and it's... My English grade is not good, and in my country I can only find a little doc about OGRE. The internet is filled with Unity3D... I thank for everybody who has read my question.
One way
Add to your object's .material script one more pass.
material myMaterial
{
technique
{
pass solidPass
{
// sets your object's colour, texture etc.
// ... leave what you have here
polygon_mode solid // sets to render the object as a solid
}
pass wireframePass
{
diffuse 0 0 0 1.0 // the colour of the wireframe (white)
polygon_mode wireframe // sets to render the object as a wireframe
}
}
}
This of course renders the object twice, but I assume it's just for debugging purposes and the lines are quite slim, also the object overlaps the wireframe at some parts.
The usual way
Add another texture_unit to the object's .material script that contains thin white squares of size the same as in the UV mapping (which you can export with most modelling software) with a transparent background
Make sure the .material script has alpha enabled in the pass you created
scene_blend alpha_blend
scene_blend_op add
This lets you choose what kind of lines you want.
Source:
Also check the OGRE Manual under Material Scripts. It goes much more in depth about the material script itself