@QooQooDaas wrote:
Hi, I’m using gojs on drawing a network diagram on Angular framework base project.
The problem is that it triggers change detection on every single mousemove event on diagram.
So I was wondering if there’s any way to disable mousemove event programmatically.Thank you.
Posts: 1
Participants: 1
@jothibaskaran wrote:
Hi,
I am trying to set the width and height to my custom shape. I have the following node structure.
const node = $(go.Node, 'Table', { linkConnected: this.updatePort, linkDisconnected: this.updatePort }, new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify), // the body $(go.Panel, 'Auto', { row: 1, column: 1, name: 'BODY' }, $(go.Shape, 'TriggerCompRect', { stroke: '#D7D7D7', fill: 'yellow', fromLinkable: true, toLinkable: true, width: 240, height: 120, stretch: go.GraphObject.Fill, minSize: new go.Size(240, 120) }, ), $(go.Panel, 'Table', { row: 0, column: 0, name: 'BODY', stretch: go.GraphObject.Fill, margin: new go.Margin(0, 0, 0, 25) },The shape itself is not changing as per the size 240x120. The container size is increasing while the shape itself remains the same, causing empty spaces in my node. Please see the result:
This is how i have generated the shape:
go.Shape.defineFigureGenerator('TriggerCompRect', function(shape, w, h) { const geo = go.Geometry.parse('M30.36.5H196c9.113,0,17.621-2.612,16.5,16.5V78.042c0,.276,3.145,26.137-12.838,26.458H30.36C-6.553,93.241-8.643,41.97,6.227,17,13.681,4.482,30.36.5,30.36.5Z', true); return geo; });I am unable to resize the shape. How can this be done?
Posts: 6
Participants: 2
@yang wrote:
Why I get a blank image?
<script src="https://cdnjs.cloudflare.com/ajax/libs/gojs/1.8.7/go.js"></script> <div id="sample"> <div style="width: 100%; display: flex; justify-content: space-between"> <div id="myDiagramDiv" style="flex-grow: 1; height: 750px; border: solid 1px black"></div> </div> <button onclick="saveImage()">save image</button> <img src="" alt="" id="image" width="1000" height="1000"> </div> window.goObject = go.GraphObject.make; window.survey = goObject(go.Diagram, "myDiagramDiv", { initialContentAlignment: go.Spot.Center, allowDrop: true, // must be true to accept drops from the Palette scale: 1, }); imgurls = '1.png'; window.floorPlan = window.goObject(go.Part, { name: "floorplan", layerName: "Background", position: new go.Point(0, 0), selectable: false, pickable: false, width: 500, height: 500 }, window.goObject(go.Picture, imgurls, { width: 500, height: 500 }) ); survey.startTransaction('change floorplan'); window.survey.add(window.floorPlan); survey.commitTransaction('change floorplan'); function saveImage() { var image = survey.makeImageData(); document.getElementById('image').src = image; }
Posts: 1
Participants: 1
@ahmetgundogdu wrote:
As seen in the GIF, there is a space value in the grid lines (Example: 100px), and shapes that indicate it with a pointer appear.
And also snap when distances are equal
Can you share this as an example?
Posts: 1
Participants: 1
@Abhishek wrote:
Currently when I add a part inside a group, while resizing the group I am able to remove the part outside the group but the binding with group is still in place, but I want that the part should move with the group if it is getting resized to a smaller dimension. How can we do that?
Posts: 1
Participants: 1
@sibisasvin wrote:
Hi, i want to create a click event which whenever the user click the nodes is it possible to bind an html div to the node in that position which is sibling to the diagram div
Posts: 4
Participants: 2
@ranjanmicrosoft wrote:
When high contrast mode is turned on, the background of the canvas changes but none of the content does. This makes it so it’s impossible to see any black text/content.
Posts: 2
Participants: 2
@Joydeep_hi wrote:
We are in the process of procuring GoJS license. However, we have a situation, where we need to add a page dynamically at the end of a diagram by clicking a b
utton. DO you have any code for this?
Posts: 2
Participants: 2
@Dominic.Lerbs wrote:
Hi,
is there a way to have a label to be always above a link, even if the link goes from right to left?
E.g. see this example: https://gojs.net/latest/intro/linkLabels.html#LinkLabelSegmentOrientation
Can the “left” label be always on top and upright even if the link goes from right to left (e.g. if “Beta” node is moved to the left side of the “Alpha” node)?
Posts: 2
Participants: 2
@dlee wrote:
I’m trying to get the beta but when I go to the https://gojs.net/beta/
the download link below is the github which doesn’t include the 2.1 version. I see we’re suppose to use npm to install it but I never used it before. Google says its to install nodejs packages. I don’t have or want nodejs. I have visual studio and don’t see the beta version in the nugets. If you can point me to a zip download, that would be great. Thanks
Posts: 2
Participants: 2
@ahmetgundogdu wrote:
if you want to change the node background when the other node is snap on the port.
How do I do that?
Posts: 2
Participants: 2
@Xieguoiang wrote:
GoJs version :2.0.8
layout : sankeyHi,
The issue is:
When there are multiple links in our two nodes, the spacing problem causes my label to overlap.
I tried routing: go.Link.AvoidsNodes. It does make the labels not overlap, but the connection has crossover problems and there are a lot of computational problems. I don’t think about this.
Is there a better solution for better display?
I drew two sketches, I hope to achieve the following display effects or similar effects.Thanks, look forward to your reply !
Posts: 2
Participants: 2
@Dominic.Lerbs wrote:
Hi,
I have upgraded from goJS 1.8 to goJS 2.0.17 and now get a compile error in this code:
const templates = new go.Map<string, go.Part>(); this.diagramNodeTemplateProviders.forEach(p => templates.addAll(p.getTemplates()));with getTemplates defined as:
getTemplates(): go.Map<string, go.Part>;The error is:
Argument of type 'Map<string, Part>' is not assignable to parameter of type 'Iterator<KeyValuePair<string, Part>> | KeyValuePair<string, Part>[]'. Type 'Map<string, Part>' is missing the following properties from type 'Iterator<KeyValuePair<string, Part>>': next, hasNext, reset, value, keyI don’t see what I am doing wrong here, since the parameter of the addAll method should be another map, shouldn’t it?
Can you help?
Posts: 4
Participants: 2
@ahmetgundogdu wrote:
temporary Link comes on arrows I want to bring it further
draw, as you see in the gif is moving awayI want temporaryLink to be like this.
how do i do it?MY temporaryLink :
this.diagram.toolManager.linkingTool.temporaryLink = goMake(go.Link, { curve: go.Link.Bezier, toShortLength: 0.5, fromSpot: go.Spot.Right, toSpot: go.Spot.None, fromEndSegmentLength: 20, toEndSegmentLength: 50, }, goMake(go.Shape, "RoundedRectangle", { isPanelMain: true, strokeWidth: 1, stroke: "#777" } ), goMake(go.Shape, { toArrow: "CustomArrowHead", strokeWidth: 0, fill: "#777" }) )portTargeted event:
this.diagram.toolManager.linkingTool.portTargeted = (node: go.Node, port: go.GraphObject, tempNode: go.Node, tempPort: go.GraphObject, toEnd: boolean) => { let templink = this.diagram.toolManager.linkingTool.temporaryLink; if (!port) { templink.fromEndSegmentLength = 20; templink.toSpot = go.Spot.None; } else { templink.fromEndSegmentLength = 50; if (port.portId === "L") { templink.toSpot = go.Spot.LeftSide; templink.toPort.margin = new go.Margin(5); } else if (port.portId === "R") { templink.toSpot = go.Spot.RightSide; } else if (port.portId === "T") { templink.toSpot = go.Spot.TopSide; } else if (port.portId === "B") { templink.toSpot = go.Spot.BottomSide; } } if (port && port.portId && toEnd) { this.diagram.nodes.each((other) => { if (other && other.data && other.data.key === node.part.data.key) { other.part.findObject("R_H").opacity = .4; other.part.findObject("L_H").opacity = .4; other.part.findObject("T_H").opacity = .4; other.part.findObject("B_H").opacity = .4; } }); node.part.findObject(port.portId + "_H").opacity = .8; this.lastPortSnap = node; this.portId = port.portId + "_H"; } else { this.diagram.nodes.each((other) => { if (other && other.data) { other.part.findObject("R_H").opacity = 0; other.part.findObject("L_H").opacity = 0; other.part.findObject("T_H").opacity = 0; other.part.findObject("B_H").opacity = 0; } }); } }
Posts: 2
Participants: 2
@ahmetgundogdu wrote:
In the example I gave the viewbox background red I want it to be Rounded Rectangle. I want to make the borders oval. How can I do?
Please review the example.
Posts: 4
Participants: 2
@simon wrote:
Changes for 2.0.18
- Shapes with a shadow and a Shape.fill value of
"transparent"now apply the shadow to the Shape.stroke, instead of the invisible Shape.fill.- Minor scrollbar fixes.
- Fixed “PanelExpanderButton” click event handler to set InputEvent.handled to true, so that other click event handlers in containing panels will not run.
- Improved the Map constructor and Map.addAll method to accept an instance of Map.
for previous releases, see: GoJS version 2.0.17
Posts: 2
Participants: 1
@mcowan wrote:
Given the following code, we get lots of inconsistent behavior:
diagram.model.addNodeData(data) const node = diagram.findNodeForData(data) // then we edit the node and also set some fields if the node is within the virtualized viewportThe problem is, the
nodevariable is oftennull, sometimes it is not null.
How do we make this more reliable so that node is never null in this case.
Posts: 6
Participants: 3
@ahmetgundogdu wrote:
The diagram is freezing when I move it with the right button…
What is the reason?
Posts: 1
Participants: 1
@ahmetgundogdu wrote:
I want to snap the grid when we hold it off the palette. How can I do?
snap when I move. I dont want this. I want to get snap when drag and drop
Posts: 2
Participants: 2
@zekelynch wrote:
Quick question! I know we could save/download the svg/png of the myDiagram, however Could we download SVG/png file without showing it (I mean not generate it on the webpage)?
Posts: 2
Participants: 2
