ส่วนขยายที่ไม่เป็นทางการนี้รวม draw.io (หรือที่รู้จักกันในชื่อ diagrams.net) ลงในรหัส VS
กล่าวถึงในบล็อกอย่างเป็นทางการบล็อก
.drawio , .dio , .drawio.svg หรือ .drawio.png ไฟล์ในตัวแก้ไข draw.io*.drawio , *.drawio.svg หรือ *.drawio.png ไฟล์และเปิดมัน.drawio.svg เป็นไฟล์ .svg ที่ถูกต้องที่สามารถฝังอยู่ในไฟล์ GitHub ReadMe! ไม่จำเป็นต้องส่งออก.drawio.png เป็นไฟล์ .png ที่ถูกต้อง! ไม่จำเป็นต้องส่งออก คุณควรใช้ .svg แม้ว่าเมื่อใดก็ตามที่เป็นไปได้ - พวกเขาดูดีขึ้นมาก!Draw.io: Convert To... คำสั่ง
คุณสามารถแก้ไขและบันทึกไฟล์ .drawio.svg และ .drawio.png โดยตรง ไฟล์เหล่านี้เป็นภาพ SVG/PNG ที่ถูกต้องอย่างสมบูรณ์แบบที่มีไดอะแกรม Draw.io แบบฝังตัว เมื่อใดก็ตามที่คุณแก้ไขไฟล์ดังกล่าวส่วน SVG/PNG ของไฟล์นั้นจะได้รับการปรับปรุงให้ทันสมัย
โลโก้ของส่วนขยายนี้เป็นไฟล์ .drawio.png ที่สร้างขึ้นด้วยส่วนขยายของตัวเอง!

หาก diffs มีความสำคัญสำหรับคุณคุณควรต้องการ .drawio และหลีกเลี่ยง .drawio.png ไดอะแกรม
ด้วยเวอร์ชัน 1.0 ของส่วนขยายนี้การสนับสนุนที่กว้างขวางสำหรับ VS Code Liveshare ได้รับการเพิ่ม ตอนนี้คุณสามารถแก้ไขหรือนำเสนอไดอะแกรม draw.io จากระยะไกลในขณะที่เห็นเคอร์เซอร์และตัวเลือกของผู้เข้าร่วมแต่ละคน! สิ่งนี้สามารถใช้สำหรับการพูดคุยทบทวนหรือระดมสมองไดอะแกรม ด้วยเครื่องมือวาดภาพมือเปล่าของ Draw.io และการสนับสนุน LaTex แบบรวมส่วนขยายนี้กลายเป็นโซลูชันไวท์บอร์ดขั้นสูงที่สามารถใช้สำหรับการสัมภาษณ์รหัสระยะไกล!

ภายในส่วนขยายนี้ซิงโครไนซ์ไดอะแกรม Draw.io กับเอกสารข้อความ เอกสารข้อความเหล่านี้แบ่งปันโดย Liveshare เนื่องจาก Liveshare ไม่มีความเข้าใจในข้อความความขัดแย้งการดัดแปลงอาจเกิดขึ้นในการปรับเปลี่ยนพร้อมกัน
ในแถบสถานะคุณสามารถเปิดใช้งานหรือปิดใช้งานคุณสมบัติลิงค์รหัส หากเปิดใช้งานและคุณดับเบิลคลิกที่โหนดที่มีฉลากเริ่มต้นด้วย # คุณจะทำการค้นหาพื้นที่ทำงานสำหรับสัญลักษณ์ที่ตรงกับส่วนที่เหลือของฉลาก
หากคุณมีโหนดที่มีป้ายกำกับ #MyClass และคลาสชื่อ MyClass คุณจะข้ามไปยังแหล่งที่มาหากคุณดับเบิลคลิกโหนด!
โปรดทราบว่าคุณต้องเปิดไฟล์อย่างน้อยหนึ่งไฟล์ของโครงการที่มีสัญลักษณ์ มิฉะนั้นรหัส VS จะไม่พิจารณาโครงการนี้เมื่อค้นหาสัญลักษณ์ ไฟล์นี้ไม่จำเป็นต้องมีสัญลักษณ์
ขอบคุณผู้สนับสนุน GitHub ล่าสุดของฉันคุณลักษณะนี้เป็นโอเพ่นซอร์สและพร้อมใช้งานได้อย่างอิสระในขณะนี้
เคล็ดลับ : หากคุณเปิดตัวแก้ไข draw.io ไปทางด้านขวา (เช่นคอลัมน์ตัวแก้ไขที่สอง) และนำทางไปยังสัญลักษณ์แผนภาพจะปรากฏให้เห็น

ธีม "Atlas"

ธีม "Kennedy"

ธีม "นาที"

ธีม "มืด"

.svg ไฟล์พร้อมตัวแก้ไข draw.io โดยค่าเริ่มต้นส่วนขยายนี้จะจัดการเท่านั้น *.drawio.svg ไฟล์ เพิ่มสิ่งนี้ลงในไฟล์ VS Code settings.json ของคุณหากคุณต้องการเชื่อมโยงกับไฟล์ .svg :
"workbench.editorAssociations" : {
"*.svg" : " hediet.vscode-drawio-text " ,
}คุณจะไม่สามารถแก้ไขไฟล์ SVG โดยพลการได้ - เฉพาะไฟล์ที่ถูกสร้างขึ้นด้วย draw.io หรือส่วนขยายนี้!
คุณสามารถเปิดไฟล์ *.drawio เดียวกันได้ด้วยตัวแก้ไข draw.io และไฟล์ XML พวกเขาถูกซิงโครไนซ์ดังนั้นคุณสามารถสลับระหว่างพวกเขาได้ตามที่คุณต้องการ นี่เป็นประโยชน์สูงสุดหากคุณต้องการใช้การค้นหา/แทนที่เพื่อเปลี่ยนชื่อข้อความหรือคุณสมบัติอื่น ๆ ของรหัส VS เพื่อเพิ่มความเร็วในการสร้างไดอะแกรม/แก้ไขกระบวนการ ใช้ View: Reopen Editor With... คำสั่งเพื่อสลับระหว่างข้อความหรือตัวแก้ไข draw.io คุณสามารถเปิดตัวแก้ไขหลายตัวสำหรับไฟล์เดียวกัน สิ่งนี้ไม่สมเหตุสมผลสำหรับไฟล์ SVG แต่เป็นไดอะแกรม draw.io ถูกเก็บไว้ในข้อมูลเมตาของมัน

ถ้าคุณชอบส่วนขยายนี้คุณอาจชอบส่วนขยายอื่น ๆ ของฉันด้วย: