yworks / yfiles-for-html-demos Goto Github PK
View Code? Open in Web Editor NEWThe source code demos for the yFiles for HTML diagramming library
Home Page: https://www.yworks.com/yfiles
License: Other
The source code demos for the yFiles for HTML diagramming library
Home Page: https://www.yworks.com/yfiles
License: Other
Using the React sample from yfiles-for-html-demos/toolkin/react and adding react-router-dom
built it capabilities to the sample application the Graph is only being rendered for the first time.
The behaviour can be seen here https://github.com/hammerhg/yfiles-react-demo-test.
To Reproduce
Steps to reproduce the behavior:
yfiles-23.0.4-dev.tgz
and licence.json
npm install
npm start
Other page
link on he top left.Graph
link on he top left.Expected behavior
When navigating away and back to the graph page using react-router-dom
built it capabilities the graph nodes and edges should be rerendered.
Screenshots
Initial state (before browsing to other-page
)
After state (after browsing to back to graph
)
Browser (please complete the following information):
Describe the bug
Right-click the invalid
To Reproduce
Steps to reproduce the behavior:
Expected behavior
fix bug .
Browser (please complete the following information):
Additional context
Add any other context about the problem here.
Hello,
I'm Fabio, and I'm evaluating the yFiles layout library.
Experimenting with the BPMN layout code from the demo, I found that (not sure if it's a bug or something I didn't understand):
yfiles-for-html-demos/demos/complete/bpmn/BpmnLayoutData.js
Lines 491 to 503 in d518d38
the mapper maps edges, the data provider is using that mapper for nodes.
Is it correct? What I am missing?
thanks,
Fabio Pignaton
I was trying to enable undo and redo as shown in demo https://live.yworks.com/demos/tutorial-yfiles-basic-features/07-undo-clipboard-support/
I the graph is an instance of DefaultGraph everything works as expected, but if I use a grouped graph I get the following error in console:
constructor {message: "Affected parameter graph: Provided graph can't provide undo support", name: 'ArgumentError', cause: null, stack: 'ArgumentError: Affected parameter graph: Provided …les/react-dom/cjs/react-dom.development.js:90:45)'}
cause:null
message: "Affected parameter graph: Provided graph can't provide undo support"
name:"ArgumentError"
Describe the bug
When the demo at https://github.com/yWorks/yfiles-for-html-demos/tree/master/demos/toolkit/react is run the demo allows to add Nodes to the graph, but whenever you try to reset the graph using the reset button or remove any node one gets following error message:
Unhandled Rejection (ArgumentError): Affected parameter edge: Edge not in this graph!
ReactGraphComponent.updateGraph
src/components/ReactGraphComponent.jsx:196
193 | // update the graph based on the given graph data
194 | this.graphBuilder.setData(this.nodesSource, this.props.graphData.nodesSource)
195 | this.graphBuilder.setData(this.edgesSource, this.props.graphData.edgesSource)
->196 | this.graphBuilder.updateGraph()
197 | ^
198 | // apply a layout to re-arrange the new elements
199 | const layoutExecutor = new LayoutExecutor(this.graphComponent, new HierarchicLayout())
To Reproduce
Steps to reproduce the behavior:
> npm start
wait for the Demo to start in the browserOR
> npm start
wait for the Demo to start in the browserExpected behavior
Remove the node and refresh the graph.
Browser (please complete the following information):
Full User Agent String
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.105 Safari/537.36
Additional context
Further debugging shows, that for some reason
this.graphBuilder.setData(this.nodesSource, this.props.graphData.nodesSource) this.graphBuilder.setData(this.edgesSource, this.props.graphData.edgesSource)
setData
method internally compares the nodes and edges given in the props and cannot identify the node to be removed.
Hello! I was wondering if it is possible to add children to a node and refresh the orgchart with new data dynamically?
Describe the bug
when npm run build ,yfiles on zoomIn will lost some items
To Reproduce
Steps to reproduce the behavior:
1.just zoomIn
Expected behavior
should like localhost project
Browser (please complete the following information):
Additional context
please reply quickly
Hello.. i downloaded ur source code want to know can i add my own shapes and electric circuit shapes.. ?? and save them or make a user to login thank you
In network monitoring demo,
location(x,y) of nodes, edges are given by hardcoding in network-sample.ts
Is there any way to auto-calculate for location(x,y)?
Currently I am considering to feed network(nodes,edges) from database, and wondering how to give x,y.
Thanks for your help.
P.S. FYI, I am a licensed user.
cause: null
message: "Missing Module: This feature requires the 'view-layout-bridge' module. Either load the module 'view-layout-bridge' explicitly or call 'Class.ensure(LayoutExecutor)'."
name: "InvalidOperationError"
this.copiedLayoutGraph = new yfiles.layout.CopiedLayoutGraph(adapter)
CopiedLayoutGraph
constructor requires as 1st param a LayoutGraph
type and LayoutGraphAdapter
is not one.
In order to fix it use createCopiedLayoutGraph
method defined in scope of LayoutGraphAdapter
class as below:
this.copiedLayoutGraph = adapter.createCopiedLayoutGraph()
Hi Team ,
Current Org chart support drag and drop external components as per demo .
I need feature where we can drag and drop org chart node within orgchart .
like Manager -> TL -> employee
Manager -> employee -> TL
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.