본문 바로가기

Skills/Others

VSCode Draw.io Integration default setting 변경

반응형

 
VSCode 익스텐션에서 Draw.io Integration을 받고 실행하니 
화살표가 Orthogonal이 아니라 Straight으로 되어 있었고,
Orthogoal로 변경하니 화살표 기본 설정이 Rounded로 되어 있었습니다.
 
VSCode에서 해당 설정을 바꾸려면 다음과 같은 단계로 직접 설정 JSON 파일을 수정해야 합니다.
 
1/ Visual Studio Code를 열고, 상단 메뉴에서 파일(File) > 기본 설정(Preferences) > 설정(Settings)을 선택합니다.

 
2/ 설정 창의 상단에 있는 검색 상자에 "Draw.io"를 입력하여 Draw.io Integration 설정을 검색합니다.

 
3/ Edit in settings.json 파일을 클릭한 후에, 아래 부분은 지웁니다.

 
4/ 아래 코드를 JSON 파일 아래 추가 합니다. 다음과 같은 2가지를 반영했습니다.

  • Waypoints: Straight -> Orthogonal로 변경
  • Arrow: Rounded -> Sharp로 변경
    "hediet.vscode-drawio.resizeImages": null,
    "hediet.vscode-drawio.defaultEdgeStyle": {
        "edgeStyle": "orthogonalEdgeStyle",
        "rounded": "0",
        "jettySize": "auto",
        "orthogonalLoop": "1"
    },
    "hediet.vscode-drawio.defaultVertexStyle": {
        "shape": "label",
        "perimeter": "labelPerimeter",
        "whiteSpace": "wrap",
        "html": "1"
    },
  • "edgeStyle": "orthogonalEdgeStyle": Waypoints를 orthogonal로 변경합니다.
  • "rounded": "0": arrow를 sharp로 변경합니다.

5/ 설정을 추가한 후, JSON 파일을 저장하고 Visual Studio Code를 재시작합니다.
아래와 같이 잘 작동되는 걸 확인했습니다.

반응형