jaime-olivares / vscode-yuml Goto Github PK
View Code? Open in Web Editor NEWyUML extension for Visual Studio Code
License: MIT License
yUML extension for Visual Studio Code
License: MIT License
For {bg: } tags, the #RRGGBB notation is not recognized, but only the color names
I wrote a little LINQPad sample to convert a class into yUML:
Is there a roadmap toward adding this bit functionality?
In order to use the class diagram in more complex projects (> 10 classes), we need to have some kind of boundary around some classes - e.g. bounded context for DDD-like approaches or packages referring to UML.
In a first step, a simple bounding box (e.g. dotted rectangle in grey) with some label (top, center) would be sufficient.
The definition could look like the package diagram, plus based on indented classes and namespaces:
[Context1]
[MyClass]
...
[Context2]
[MyOtherClass]
[MyOtherClass]->[Context1.MyClass]
[MyClass]-[note: this is a different class than MyClass from Context1 with different relations.]
Regards
Sven
Consider the following:
// {type:activity}
(start)->(test{bg:red})
Unfortunately, the background color overrides the fact that the shape is to be drawn "rounded".
Hello Jaime,
I absolutely love your project - I moved my team to use it for diagramming from Visio and Balsamiq (we still use Balsamiq for mockups).
We wrote a set of internal tools that expose some information into your flavor of yUml and then we load them into VSCode, generate .svg for the documentation and close VSCode.
It would be amazing if you can expose your .svg generation code as an NPM module, so we can integrate this process with our tools.
I would love to help you!
Thank You,
Vladimir
When doing inline yuml in markdown files the snippets do not trigger, they only appear to trigger in .yuml files, I would expect them to also trigger in .md files.
e.g. the following never triggers a snippet for class
```yuml
class ```
There seems to be a problem with the 2.10.0 package, diagrams with notes aren't displayed correctly. Could this be related to the viz.js 1.7.1 upgrade? In my workspace, using 1.3.0, everything works fine.
Hi,
First, thanks for your work.
It seems note annotation is not currently rendering when I visualize a sequence diagram (Error parsing the yUML file). I use the yUML plugin v3.1.2 and VS Code v1.28.0.
I try to use the below syntax to render it in the browser, but it's not working.
```yuml
{type: sequence}
[A]>[B]
How can I properly render the yuml in the browser? I want to add some class/activity diagrams in my readme.md and push it to github.
Thanks.
In 'generate' mode, it seems the IsDirty functionality is not working properly, so the image is not refreshed after changes, and refreshed without need when switching documents.
I see the code to add the appropriate edge labels in scripts/usecase-diagram.js, but they're not showing up for me at all. I know viz.js can do labels (at least the latest version can), so I'm not sure why they don't show up.
Please make TopBar is optional.
It means new option on/off in the preferences to disable/enable top-bar with links.
Thanks for your tootl, it's very useful!
Just to know your plans to add sequence diagram like https://github.com/bramp/js-sequence-diagrams
I read that it's in your roadmap. I never wrote a vsCode extension, but If I can help, tell me.
Currently, the text color is determined by the theme (light/dark). However, whenever the user selects a different background color using the {bg: } tag, the text may not be readable due to lack of contrast.
In those cases, the background luminosity should be determined in order to choose either the black or white text color.
Trying to preview the yUML diagram of any yuml file gives me the foloing error:
Active editor doesn't show a yUML document
My vscode installation info:
Version: 1.26.1
Commit: 493869ee8e8a846b0855873886fc79d480d342de
Date: 2018-08-16T18:34:20.517Z
Electron: 2.0.5
Chrome: 61.0.3163.100
Node.js: 8.9.3
V8: 6.1.534.41
Architecture: x64
Here is a sample diagram that I tried (got it from the repository):
// Activity diagram for the main process of the yUML extension for VSCode
// {type:activity}
// {generate:true}
// {direction:leftToRight}
(start)->(Parse .YUML\rfile)->(Create .DOT\rdocument)
(Create .DOT\rdocument)->(Generate SVG)
(Generate SVG)->(Output to\rPreviewer)
(Output to\rPreviewer)->|e|
(Generate SVG)-><g>[generate: false]->|e|
<g>[generate: true]->(Output to\rFile)
(Output to\rFile)->|e|->(end)
I got the below error when I tried to move the diagram tab to display below the code. You have to restart vscode to get the extension to work again.
Unable to open '\vscode-yuml': ModelService: Cannot add model because it already exists!.
I am often experiencing problems with the window not responding when opening a yuml file.
But it's not every time, and just when I was about to type this issue, the problem went away, only to appear a few minutes later.
So sorry, not much to go for. Not sure how I can help debug this issue?
An export to PDF would be a fantastic feature.
Just installed over VS extentions
But looks like its not working.
No text highlihted and no diagramms displayed
Please, provide any 100% working example.
Class [Customer]
No handler found for the command: 'extension.viewYumlDiagram'. An extension might be missing an activation event.
Readme.md under markdown support states:
{type: sequence}
but should be:
// {type: sequence}
Otherwise you'll get Missing mandatory 'type' directive
error.
Thanks for a great tool.
Any plans to improve the rendering to allow for the rufscript font and the nice hand-drawn look as on yuml.me?
Thanks
More and more we are using VS Code for documentation, and for MD files there is a "Open as Preview" option. It would be nice if this feature existed also for yuml files.
The example code from packages is wrong, probably a copy error from deployment example.
https://github.com/jaime-olivares/yuml-diagram/wiki#package-diagram
It would be cool to combine with this project:
https://github.com/remojansen/TsUML
That way we could generate the .yuml
file from scanning the typescript files from the project.
The code already has a getDsl function, so just needs to be integrated.
It does have some different syntax than this project. Here's a sample string it generates.
[Weapon{bg:palegreen}][Weapon||tryHit();],[Named{bg:palegreen}][Named|name;|],[BaseWeapon{bg:skyblue}][BaseWeapon|damage;|],[Katana{bg:skyblue}][Katana|name;|tryHit();],,[BaseWeapon]^-[Katana],[Weapon]^-[Katana],[Named]^-[Katana],[Ninja{bg:skyblue}][Ninja|_weapon;|fight();],
The commas would need to be converted to new lines and it does some stuff with pipes and semi-colons that is not compatible.
User Case 1: Document integreted with yuml.
We want to copy yuml as image from preview or export as a command.
User Case 2: Background color setting.
White for background color,and draw as black or other color.
// {type:sequence}
[非常常的中文字符会怎么样呢]>>[超出方框啦]
// {type:state}
{start}[start]->(你好!)
Currently the activity diagrams have converged arrows in split/join bars.
The issue is explained here: http://stackoverflow.com/questions/38780962/increase-separation-of-edges-in-graphviz
As the title
Ideally, I would like to prepend '[' and ']' with a backslash, so I can these characters in property names and notes.
Something like '[This is a note about item [123] in array]
Thanks,
Vladimir
It seems to be caused by a missing break in a switch statement
Add png image support.
Extend the yuml syntax and renderer for supporting association classes
Hi,
It would be nice to have more flexibility of positionings.
I thougt something with drag and drop would be cool.
I don't know if that is even possible.
Would love to contribute for that.
I was viewing a diagram, then I closed the preview window. Then I tried to open preview again by hitting a button in the top right corner, but the preview didn't appear. Closing and reopening the .yuml file did not help. After a few seconds, the error message appeared.
VS Code Version 1.30.2 (1.30.2), Mac
extensionService.ts:165 Extension host terminated unexpectedly. Code: 7 Signal: null
t._onExtensionHostCrashed @ extensionService.ts:165
extensionHost.ts:236 /Users/cem/.vscode/extensions/jaimeolivares.yuml-3.1.2/node_modules/viz.js/viz.js:25
var Module=typeof Module!=="undefined"?Module:{};var moduleOverrides={};var key;for(key in Module){if(Module.hasOwnProperty(key)){moduleOverrides[key]=Module[key]}}Module["arguments"]=[];Module["thisProgram"]="./this.program";Module["quit"]=(function(status,toThrow){throw toThrow});Module["preRun"]=[];Module["postRun"]=[];var ENVIRONMENT_IS_WEB=false;var ENVIRONMENT_IS_WORKER=false;var ENVIRONMENT_IS_NODE=false;var ENVIRONMENT_IS_SHELL=false;if(Module["ENVIRONMENT"]){if(Module["ENVIRONMENT"]==="WEB"){ENVIRONMENT_IS_WEB=true}else if(Module["ENVIRONMENT"]==="WORKER"){ENVIRONMENT_IS_WORKER=true}else if(Module["ENVIRONMENT"]==="NODE"){ENVIRONMENT_IS_NODE=true}else if(Module["ENVIRONMENT"]==="SHELL"){ENVIRONMENT_IS_SHELL=true}else{throw new Error("Module['ENVIRONMENT'] value is not valid. must be one of: WEB|WORKER|NODE|SHELL.")}}else{ENVIRONMENT_IS_WEB=typeof window==="object";ENVIRONMENT_IS_WORKER=typeof importScripts==="funct
Error: write EPIPE
at _errnoException (util.js:1024:11)
at WriteWrap.afterWrite [as oncomplete] (net.js:867:14)
Chinese is no longer supported after the automatic upgrade plug-in, but also plans to support Chinese?
Currently, whenever the preview window is open, it acquires the focus. That's not desirable, as the next yuml file would be open in that editor group.
The focus should return to the yuml editor instead.
Is there any plan on exporting the rendered UML as a PNG and PDF? I think exporting it as PNG should be straightforward. However, exporting to a PDF may require external dependencies to make it easier. I could work on exporting it as a PNG if you like. Thank you.
Thanks for great tool!
When I open multiple yuml files and have the preview window open, it will switch back and forth them very quickly multiple times.
Currently the extension opens the preview window in the second pane, but it may be inconvenient if the yuml is already opened in it.
Need a better logic for deciding where to open the preview window. Ideally mimic the Markdown extension.
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.