@mithun wrote:
Hi,
We have a situation where we need multiple types of templates for different nodes.
But these templates can share a similar behavior.Is it possible to define a base template and can we inherit this template into other templates and override some of the behavior?
Thanks in advance.
Posts: 2
Participants: 2
@jubin wrote:
Hi
I am upgrading gojs version (from 1.8.x to 2.x.x). I observed an issue with segmentOffset of links.
Below code is used for binding segmentOffset.panel.bind(new Binding("segmentOffset", "", ((link: SequenceFlow) => { return link.edge? new Point(link.edge.xConditionOffset, link.edge.yConditionOffset) : new Point(0, 0); })).makeTwoWay((value: Point, link: SequenceFlow) => { console.log(`${value.x} and ${value.y}`) link.edge.xConditionOffset = value.x; link.edge.yConditionOffset = value.y; }));Moving this panel in same direction in 1.8.x and 2.x.x version results in different values,
in 1.8.x version we get point with x= -X, y=-Y values and in 2.x.x version these values are x=+X, y=-Y.
Can you please let us know why the change in behavior?
Posts: 1
Participants: 1
@nachoxxhh wrote:
I need that when I hover over a link, show information.
example:
I try:
but I don’t bet anything.
Posts: 1
Participants: 1
@simon wrote:
Changes for 2.1.2
- Fixed a regression in 2.1.1 with the timing of
InitialAnimationStartingthat would prevent custom initial animations.- CTRL + Mouse-wheel will still stop the event from bubbling, even if CommandHandler.canIncreaseZoom or CommandHandler.canDecreaseZoom are false. These are potentially false if a Diagram.minScale or Diagram.maxScale are set. This change stops the entire page from accidentally zooming during a zoom-wheel operation.
- Fixed a measuring bug with Link Geometry when the Link is smaller than the Link.toShortLength or Link.fromShortLength.
Changes for 2.0.20
- CTRL + Mouse-wheel will still stop the event from bubbling, even if CommandHandler.canIncreaseZoom or CommandHandler.canDecreaseZoom are false. These are potentially false if a Diagram.minScale or Diagram.maxScale are set. This change stops the entire page from accidentally zooming during a zoom-wheel operation.
- Fixed a measuring bug with Link Geometry when the Link is smaller than the Link.toShortLength or Link.fromShortLength.
For previous releases, see: GoJS 2.1.1 and 2.0.19 Released
Posts: 2
Participants: 1
@zoom73 wrote:
i have some workflows working well like this:
but this in particular are not working, its a big workflow
what can be wrong?
i have this libraries
thanks you very much guys
Posts: 2
Participants: 2
@Dominic.Lerbs wrote:
Hi,
we have a diagram with isGridSnapEnabled = true.
Is it possible to disable the snapping for a certain category of nodes but keep it for all other nodes?Can I just change the isGridSnapEnabled in the SelectionChanged event or what would be the suggested way?
Posts: 1
Participants: 1
@ciprianmocanu_servicenow wrote:
I need to filter out nodes from a graph based on the value of links coming out of that node and the value of those nodes. And, I need to iterate in fashion where I start from one node and then go through each node going out, but, and this is very important, I need to be able to not go through some nodes if they don’t match my condition.
Example:
If I have the graph like this:
A -> B -> D -> E
A -> C
I want to start from A, then check if B and C match my link and node conditions and if they do, move forward to the either B, C or both. If none of them match my condition, I want to stop there and never visit that node again, even if I get to it form a different link.Basically, I want to filter a graph by traversing each node/link once and checking if they match my conditions, but the thing is that my condition is related to the other sibling nodes (coming out of the node I’m analyzing). So, if I’m at node A, I want to only go through the biggest value node (be that B or C), so I need to know both B and C, compare them and only navigate forward with the biggest one.
Is there an easy way to do this? Or should I just iterate through all the nodes, get all the nodes coming out of each of them, do my comparison, remember the nodes that don’t match my condition, then when I get to them (cause I iterate through all of them) just ignore them. The problem with this approach is that I iterate through all the nodes, allthough I don’t need to, cause maybe I choose C instead of B, then I skip the nodes D and E.
Posts: 1
Participants: 1
@robinvanbrakel wrote:
Goodday, Im using GoJS Autolayout and its great so far, but one thing that bothers me atm and something i cant seem to fix is that the lines are not drawn properly when autolayouting.
See screenshot to know what I mean.
Configuration:
layout: $(go.LayeredDigraphLayout, { direction: 90, layerSpacing: 50, this.diagram.linkTemplate = $(go.Link, { routing: go.Link.AvoidsNodes, curve: go.Link.JumpGap, }, $(go.Shape), $(go.Shape, { toArrow: 'Standard' }) );Is there a way to keep the lines as straight as possible and only reroute when its necessary?
thanks in advance!
Posts: 1
Participants: 1
@nibinki wrote:
Hi
I got 2 subtrees where 1 node in a subtree is connected to another node in a subtree as shown in diagram . check the node which is expanded
if i collapse that node , gray node remains in its position with there is no link to its parent
How can i solve this and what is the reason for this
Thanks
Nibin
Posts: 3
Participants: 2
@drf wrote:
Starting with a go.Point in document coordinates (one like 153, 57, for example), I need to get the correspondent go.Spot inside a Panel (from 0,0 to 1,1), How can I do this?
Posts: 2
Participants: 2
@tomr wrote:
Hello, I am using GoJS with the angular framework.
I want to create a diagram that contains another diagram as a node.
My purpose finally is when I will click on the “node”, the other diagram will be shown.
How can it be done?Thank you.
Posts: 2
Participants: 2
@lutz wrote:
I want the group nodes to surround the nodes evenly.
Similar satellite map.
But I can’t hold down the line of the node.
Posts: 2
Participants: 2
@mithun wrote:
Hi,
I am changing my layouts dynamically within transactions.
But my problem is when I change the layout from Circular to ForcedDirectedLayout or from LayeredDigraphLayout to ForcedDirectedLayout, all the nodes do no rearrange from the top or the nodes do not get distributed, instead they rearrange closer to the existing position only.I have tried arrangesToOrigin, but no luck.
Thanks
MIthun
Posts: 2
Participants: 2
@dlee wrote:
https://gojs.net/latest/projects/floorplanner/FloorPlanner.html#
For the floor planner example above, is it possible to have a readonly view? I was hoping for a flag for entire floorplan I could set but I don’t see any easy way of doing it. I want to be able to load the plan from database and only allow certain users to read and not edit it. Or is this something I’ll have to build on my own?I tried this and it sets all nodes to not movable, which is great but how do I also disable the adornments?
myFloorplan.nodes.each(function (n) { n.movable = false; })
Posts: 2
Participants: 2
@swang92 wrote:
Hello,
I am currently using GoJS with VueJS. I was able to implement a simple vuejs diagram where nodes are just linked from one to another. I want to implement the click and drag version into vue (https://github.com/NorthwoodsSoftware/GoJS/blob/master/samples/draggableLink.html)
Is there a way to store myDiagram globally in vue’s data like how i do for nodeDataArray and linkedDataArray? i.e:
data(){
return{
nodeDataArray[]: [],
linkedDataArray[]: [],
myDiagram: ??<- like this
}
}
}I tried setting myDiagram to an empty object but when I access it with this.myDiagram it throws unable to read properties of myDiagram of undefined.
Posts: 3
Participants: 2
@jubin wrote:
In version 1.8.x, we were using
findObjectto find panels inside itemArray. We upgraded gojs to 2.x version and findObject is no more working.
Is there anything changed related to this between these versions?Is there any api available to recurse through itemArray and give result?
If there is no direct api available, can you give us code snippet to do this?Thanks.
Posts: 1
Participants: 1
@Hochware wrote:
Hello
Since I am hitting a wall in this matter, I need your help for solving the following problem:
I got a node which contains a panel which contains an Image. The goal is to create a spinanimation on the image without changing the size of the panel. Refer to the image for better understanding:
The Object in the middle has the following structure:
var pumpTemplate = $(go.Node, "Table", { locationObjectName: "BODY", locationSpot: go.Spot.TopLeft, layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized, selectionObjectName: "BODY", contextMenu: nodeMenuPorts, resizable: true, selectable: _.editMode, resizeObjectName: "image", }, $(go.Panel, "Auto", { row: 1, column: 1, name: "BODY", }, $(go.Picture, { source: "off.svg", name: "image", width: 100, height: 100, }, new go.Binding("angle", "", (data) => { return data.controlSettings.rotation; }), new go.Binding("desiredSize", "size").makeTwoWay()) ), //Stuff below are the ports $(go.Panel, "Vertical", new go.Binding("itemArray", "leftArray"), { row: 1, column: 0, itemTemplate: $(go.Panel, { _side: "left", // internal property to make it easier to tell which side it's on fromSpot: go.Spot.Left, toSpot: go.Spot.Left, fromLinkable: true, toLinkable: true, cursor: "pointer", contextMenu: portMenu }, new go.Binding("portId", "portId"), $(go.Shape, "Rectangle", { stroke: null, strokeWidth: 0, desiredSize: portSize, margin: new go.Margin(1, 0) }, new go.Binding("desiredSize", "", (data) => { return _.portsVisible ? portSize : new go.Size(0, 0); }), new go.Binding("fill", "", (data) => { return _.portsVisible ? data.portColor : "transparent"; })) ) // end itemTemplate } ), $(go.Panel, "Horizontal", new go.Binding("itemArray", "topArray"), { row: 0, column: 1, itemTemplate: $(go.Panel, { _side: "top", fromSpot: go.Spot.Top, toSpot: go.Spot.Top, fromLinkable: true, toLinkable: true, cursor: "pointer", contextMenu: portMenu }, new go.Binding("portId", "portId"), $(go.Shape, "Rectangle", { stroke: null, strokeWidth: 0, desiredSize: portSize, margin: new go.Margin(0, 1) }, new go.Binding("desiredSize", "", (data) => { return _.portsVisible ? portSize : new go.Size(0, 0); }), new go.Binding("fill", "", (data) => { return _.portsVisible ? data.portColor : "transparent"; })) ) } ), $(go.Panel, "Vertical", new go.Binding("itemArray", "rightArray"), { row: 1, column: 2, itemTemplate: $(go.Panel, { _side: "right", fromSpot: go.Spot.Right, toSpot: go.Spot.Right, fromLinkable: true, toLinkable: true, cursor: "pointer", contextMenu: portMenu }, new go.Binding("portId", "portId"), $(go.Shape, "Rectangle", { stroke: null, strokeWidth: 0, desiredSize: portSize, margin: new go.Margin(1, 0) }, new go.Binding("desiredSize", "", (data) => { return _.portsVisible ? portSize : new go.Size(0, 0); }), new go.Binding("fill", "", (data) => { return _.portsVisible ? data.portColor : "transparent"; })) ) } ), $(go.Panel, "Horizontal", new go.Binding("itemArray", "bottomArray"), { row: 2, column: 1, itemTemplate: $(go.Panel, { _side: "bottom", fromSpot: go.Spot.Bottom, toSpot: go.Spot.Bottom, fromLinkable: true, toLinkable: true, cursor: "pointer", contextMenu: portMenu }, new go.Binding("portId", "portId"), $(go.Shape, "Rectangle", { stroke: null, strokeWidth: 0, desiredSize: portSize, margin: new go.Margin(0, 1) }, new go.Binding("desiredSize", "", (data) => { return _.portsVisible ? portSize : new go.Size(0, 0); }), new go.Binding("fill", "", (data) => { return _.portsVisible ? data.portColor : "transparent"; })) ) } ) );As you can see the structure has a table, containing multiple ports(red dots in top and bottom) and an auto panel(marked with number 5) in the middle. This auto panel then contains an image(marked with number 3) which has to rotate. Even though the image is round, it actually is a square (number 4) obviously.
My question now is: how can i configure the autopanel so that it does not change its size (the extra width and height indicated by 1 and 2) when its content is rotating? It is also important that the ports do not change position when rotating the image.
In case you need more information(video of the actual rotation) feel free to ask!
Edit: The location.spot.TopLeft is important for snapping to grid
Posts: 8
Participants: 2
@caeserbala wrote:
Another query i have panel and tree expander button need to show hover on both differently any idea how to achieve it
Posts: 2
Participants: 2
@ciprianmocanu_servicenow wrote:
I have a huge graph that uses the
LayeredDiagraphLayout. I would like it to only render the nodes that are visible. From this example I realised that I have to do it myself (which I don’t like, but that’s a different discussion).I can’t seem to understand which methods I have to overwrite and how. I’ve also checked this topic, but I don’t understand any of it.
So, I need to improve the performance of
LayeredDiagraphLayoutand I think making it virtual may improve it. Where do I even start? I don’t know howLayeredDiagraphLayoutworks (I don’t have the source code).
Posts: 3
Participants: 2
@dmarques wrote:
I’m trying to build a sankey diagram using the example on the GoJS web site as my starting point. I’ve used my own data for this diagram. The problem I’m encountering is that some of the links consistently crossover each other.
I’ve looked through the API documentation and forum for some hint as to how I might control that ordering but I don’t yet see anything that seems to address this directly.
Can anyone suggest an approach that might help resolve this?
I’m on GoJS 1.8.29
Thanks,
Davis
Posts: 5
Participants: 2
