@jarangbacot wrote:
Currently I'm using {"animationManager.isEnabled": false} to disable expanding animation
Is it anyway to disable only animation for link/line but animation still be enabled for node expanding?
Thanks
Posts: 2
Participants: 2
@jarangbacot wrote:
Currently I'm using {"animationManager.isEnabled": false} to disable expanding animation
Is it anyway to disable only animation for link/line but animation still be enabled for node expanding?
Thanks
Posts: 2
Participants: 2
@charujain04 wrote:
when I click on end side of go diagram, screen rotate in scroll viewer.How it resolves.
Posts: 4
Participants: 2
@sachkumar wrote:
Hi Team,
While trying to set up a tooltip for my nodes, getting an error:
"GraphObject.toolTip value is not an instance of Adornment"
This is the code that i have inserted into my node for enabling tooltip:
{
toolTip:
$(go.Adornment, "Auto",
$(go.Shape, { fill: "#FFFFCC" }),
$(go.TextBlock, { margin: 10 },
new go.Binding("text", "text"))
)
}Can you please help ?
Posts: 2
Participants: 2
@chabbey wrote:
Hi,
I am looking for a simple example of a diagram with dangling links ( links have a source vertex with no destination vertex). Currently, these links do not display, so i was looking for some example/guideline/documentation to get me started.
More precisely, i had like to show these danglings links like a regular links that just go out the source vertex. The only difference is that these links will not go in a destination.
By reading the doc, it seems that i must set the Points with some coordinate.
Currently, i am able to give absolute coordinate to the link, but i'd link to make it start from its source vertex and go a little bit off the table by a certain amount
Posts: 1
Participants: 1
@nadeemparvez.ak wrote:
Hi, I am new to GOJS and Angular JS. I am trying to use records sample code and develop using angular. everything works except for the links doesnt appear to be correctly shown.
Any help and recommendation is appreciated.
Here is my JS file :
angular.module('minimal', [])
', // just an empty DIV element
.directive('goDiagram', function() {
return {
restrict: 'E',
template: '
replace: true,
scope: { model: '=goModel' },
link: function(scope, element, attrs) {
var $ = go.GraphObject.make;
var fieldTemplate =
$(go.Panel, "TableRow", // this Panel is a row in the containing Table
new go.Binding("portId", "name"), // this Panel is a "port"
{
background: "transparent", // so this port's background can be picked by the mouse
fromSpot: go.Spot.Right, // links only go from the right side to the left side
toSpot: go.Spot.Left,
// allow drawing links from or to this port:
fromLinkable: true, toLinkable: true
},
$(go.Shape,
{ width: 12, height: 12, column: 0, strokeWidth: 2, margin: 4,
// but disallow drawing links from or to this shape:
fromLinkable: false, toLinkable: false },
new go.Binding("figure", "figure"),
new go.Binding("fill", "color")),
$(go.TextBlock,
{ margin: new go.Margin(0, 2), column: 1, font: "bold 13px sans-serif",
// and disallow drawing links from or to this text:
fromLinkable: false, toLinkable: false },
new go.Binding("text", "name")),
$(go.TextBlock,
{ margin: new go.Margin(0, 2), column: 2, font: "13px sans-serif" },
new go.Binding("text", "info"))
);var diagram = // create a Diagram for the given HTML DIV element $(go.Diagram, element[0], { nodeTemplate: $(go.Node, "Auto", { locationSpot: go.Spot.Center, movable: false, copyable: false, deletable: false }, new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify), $(go.Shape, { fill: "#EEEEEE" }), // the content consists of a header and a list of items $(go.Panel, "Vertical", // this is the header for the whole node $(go.Panel, "Auto", { stretch: go.GraphObject.Horizontal }, // as wide as the whole node $(go.Shape, { fill: "#1570A6", stroke: null }), $(go.TextBlock, { alignment: go.Spot.Center, margin: 3, stroke: "white", textAlign: "center", font: "bold 12pt sans-serif" }, new go.Binding("text", "key"))), // this Panel holds a Panel for each item object in the itemArray; // each item Panel is defined by the itemTemplate to be a TableRow in this Table $(go.Panel, "Table", { padding: 2, minSize: new go.Size(100, 10), defaultStretch: go.GraphObject.Horizontal, itemTemplate: fieldTemplate }, new go.Binding("itemArray", "fields") ) // end Table Panel of items ) // end Vertical Panel ), /*$(go.Shape, "RoundedRectangle", new go.Binding("fill", "color"), { portId: "", cursor: "pointer", fromLinkable: true, toLinkable: true, fromLinkableSelfNode: true, toLinkableSelfNode: true, fromLinkableDuplicates: true, toLinkableDuplicates: true }),*/ /* $(go.TextBlock, { margin: 3, editable: true }, new go.Binding("text", "name").makeTwoWay()) ),*/ linkTemplate: $(go.Link, { relinkableFrom: true, relinkableTo: true,toShortLength: 4 }, $(go.Shape, { strokeWidth: 1.5 }), $(go.Shape, { toArrow: "Standard", stroke: null }) ), initialContentAlignment: go.Spot.Center, "ModelChanged": updateAngular, "undoManager.isEnabled": true }); // whenever a GoJS transaction has finished modifying the model, update all Angular bindings function updateAngular(e) { if (e.isTransactionFinished) scope.$apply(); } // notice when the value of "model" changes: update the Diagram.model scope.$watch("model", function(newmodel) { var oldmodel = diagram.model; if (oldmodel !== newmodel) { diagram.removeDiagramListener("ChangedSelection", updateSelection); diagram.model = newmodel; diagram.addDiagramListener("ChangedSelection", updateSelection); } }); scope.$watch("model.selectedNodeData.name", function(newname) { if (!diagram.model.selectedNodeData) return; // disable recursive updates diagram.removeModelChangedListener(updateAngular); // change the name diagram.startTransaction("change name"); // the data property has already been modified, so setDataProperty would have no effect var node = diagram.findNodeForData(diagram.model.selectedNodeData); if (node !== null) node.updateTargetBindings("name"); diagram.commitTransaction("change name"); // re-enable normal updates diagram.addModelChangedListener(updateAngular); }); // update the model when the selection changes function updateSelection(e) { var selnode = diagram.selection.first(); diagram.model.selectedNodeData = (selnode instanceof go.Node ? selnode.data : null); scope.$apply(); } diagram.addDiagramListener("ChangedSelection", updateSelection); } }; }) .controller('MinimalCtrl1', function($scope) { $scope.model = new go.GraphLinksModel( [ { key: "Record1", fields: [ { name: "field1", info: "", color: "#F7B84B", figure: "Ellipse" }, { name: "field2", info: "the second one", color: "#F25022", figure: "Ellipse" }, { name: "fieldThree", info: "3rd", color: "#00BCF2" } ], loc: "0 0" }, { key: "Record2", fields: [ { name: "fieldA", info: "", color: "#FFB900", figure: "Diamond" }, { name: "fieldB", info: "", color: "#F25022", figure: "Rectangle" }, { name: "fieldC", info: "", color: "#7FBA00", figure: "Diamond" }, { name: "fieldD", info: "fourth", color: "#00BCF2", figure: "Rectangle" } ], loc: "250 0" } ], [ { from: "Record1", fromPort: "field1", to: "Record2", toPort: "fieldA" }, { from: "Record1", fromPort: "field2", to: "Record2", toPort: "fieldD" }, { from: "Record1", fromPort: "fieldThree", to: "Record2", toPort: "fieldB" } ]); $scope.model.selectedNodeData = null; /* $scope.replaceModel = function() { $scope.model = new go.GraphLinksModel( [ { key: 11, name: "zeta", color: "red" }, { key: 12, name: "eta", color: "green" } ], [ { from: 11, to: 12 } ] ); }*/ });
Below is the snapshot of output how it looks
another concern is when ever i import this in my main project, the diagram doesnt appear unless i do inspect on the chrome
Posts: 7
Participants: 2
@turnert wrote:
Hi there,
This might be a really dumb question, but I've been unable to location any documentation on how to clean-up a diagram so that the Javascript can garbage collect.
Do I just need to remove the div that the diagram is tied to (and all references in-memory objects) or is there an explicit procedure?
Thanks!
Posts: 1
Participants: 1
@shivani wrote:
HI
Right now the text-box is changing the size according to the text. hence the text-block beneath is visible.
is there an option either to hide the text block or the size to be kept same as the text block below?
Thanks in advance
Shivani
Posts: 2
Participants: 2
@nagymaci wrote:
Hi,
I want to conditionally display a flashing warning sign in a corner of a node. An example of this is:
https://jgraph.github.io/mxgraph/javascript/examples/monitor.html
(Click on the "Update" button)Could someone show me how to do this?
Thanks!
Posts: 2
Participants: 2
@zeineb wrote:
now i add a button on the link in the palette,what i want to do is when i click on this button it allows me to link 2 classes
i use this function to draw links:function drawLink(e, button) { var node = button.part.adornedPart; var tool = e.diagram.toolManager.linkingTool; tool.startObject = node.port; e.diagram.currentTool = tool; tool.doActivate(); }
Posts: 4
Participants: 2
@Rita wrote:
Hello ,
We are using the Liecensed version for GOJS s/w.
Need an help on copying and Pasting the Layout/Digram in my code.
I tried the sample examples given on :
http://gojs.net/latest/intro/commands.html
Even tried to recall the the copy paste events using the handlers..SelectionCopied,ClipboardPasted...
But I am unable to copy the images/digrams ther.
Can anybody help us with the sample code for copy pasting Layout.Thanks for all your help.Need your kind assistance asap.
Posts: 4
Participants: 2
@sachkumar wrote:
I have a gojs pallet and a canvas,
the nodes have small image attached to it , and is clickable,I want that in pallet this should be readonly, and once dropped on canvas, they must be editable.
How to achieve this feature ?
Posts: 3
Participants: 2
@Timothy wrote:
I'm trying to find a good way to separate the model data from the view specific properties. In order to remember things such as size, location, angle etc. I'm currently saving them with the model using two way data binding.
Are there already solutions for how these things can be kept well seperated? Some sort of MVVM architecture perhaps? Unfortunately databinding can't be done on nested object properties eg.
new go.Binding("text", "model.Name");
of course I could use a convertor, but it would only work in one direction. The Inspector also wouldn't work anymore.Just wondering if anyone has already put some thought into this.
Posts: 5
Participants: 2
@walter wrote:
Changes for 1.6.6
- Fixed a bug with text measurement when using TextBlock.OverflowEllipsis.
- Fixed a bug with Link geometry construction when switching templates.
- Groups no longer try to update their own bounds when containing links are modified, so long as Group.computesBoundsIncludingLinks is set to false.For older changes, see https://forum.nwoods.com/t/gojs-version-1-6-5/6859.
Posts: 2
Participants: 1
@einav wrote:
I have a problem styling the text in the TextBlock to have line-height.
How can I achieve it?
Thanks!
Posts: 2
Participants: 2
@shameer.sheik wrote:
hi,
Is there any link between the undo manager and the incremental json , everytime i set the undo manager is false , my incremental json doesnt give me any result.
my code :
myDiagram =
fg(go.Diagram, divId, {
initialContentAlignment: go.Spot.TopCenter,
contentAlignment:go.Spot.TopCenter,
position: new go.Point(0,0),
"animationManager.isEnabled": false, //NO I18n
"undoManager.isEnabled": false, //NO I18n
"maxSelectionCount":1, //NO I18n
"allowClipboard":false,//NO I18n
doubleClick: diagramDoubleClick,
"LinkReshaped": function(e) { //NO I18n
e.subject.routing = go.Link.Orthogonal;
},
});my incremental json code
myDiagram.model.addChangedListener(function(e) {
if (e.isTransactionFinished) {
var json = myDiagram.model.toIncrementalJson(e);
console.log("incrementaljson"+json);
}when undomanager is set to false , i always get {Incremental:0}
Posts: 2
Participants: 2
@einav wrote:
Hello,
I have blurriness in all browsers. Including font, icons and more.
What can be the cause of it in GoJS?
Thanks!
Posts: 2
Participants: 2
@einav wrote:
I am trying to link port to port when the node is selected, but it seems that the selected line of the node is on top of the port and that is why the courser cant link port to port.
Also, I want the port to appear on top of the node.
Any help? thanks!
Posts: 2
Participants: 2
@Charles wrote:
I have a diagram with a GraphLinksModel, and in certain cases (namely smaller graphs, as far as I can tell?) I'm getting a viewport after a zoomToFit() that is not exactly matched to one of the bounds of the document.
I.e. I would expect (and maybe this is incorrect) if the document bound's width and height are 20 and 20, I would expect either the viewport's width or it's height (but not necessarily both) to be 20.
This seems to be happening very consistently with my smaller diagrams, but not with larger ones, almost like the diagram is reluctant to make my nodes and links larger than a certain size, even though my overview diagram shows the model fitted like I would expect.
Is there some code or function to automatically give more space to a smaller set of nodes/links during a fit?
(I'm running Go.js version="1.4.20".)
Posts: 1
Participants: 1