ตำแหน่งหน้าต่างของ SVG โดยทั่วไปจะระบุโดย CSS และขนาดถูกตั้งค่าโดยความกว้างของแอตทริบิวต์และความสูงขององค์ประกอบ SVG อย่างไรก็ตามหาก SVG ถูกเก็บไว้ในวัตถุที่ฝังตัว (เช่นองค์ประกอบวัตถุหรือองค์ประกอบ SVG อื่น ๆ ) และเอกสารที่มี SVG ถูกจัดรูปแบบด้วย CSS หรือ XSL และ CSS หรือค่าขนาดที่ระบุอื่น ๆ ของวัตถุอุปกรณ์ต่อพ่วงเหล่านี้
ที่นี่เราจำเป็นต้องแยกแยะแนวคิดของ Windows ระบบพิกัดหน้าต่างและระบบพิกัดของผู้ใช้:
หน้าต่าง : หมายถึงพื้นที่สี่เหลี่ยมที่มองเห็นได้บนหน้าเว็บที่มีความยาวและความกว้าง จำกัด และพื้นที่นี้โดยทั่วไปเกี่ยวข้องกับขนาดของวัตถุอุปกรณ์ต่อพ่วง ระบบพิกัดหน้าต่าง : โดยพื้นฐานแล้วระบบพิกัดที่มีต้นกำเนิดแกน x และแกน y; และมันขยายไปอย่างไม่สิ้นสุดทั้งสองทิศทาง โดยค่าเริ่มต้นต้นกำเนิดจะอยู่ที่มุมซ้ายบนของหน้าต่างแกน x อยู่ในแนวนอนทางด้านขวาและแกน y อยู่ในแนวตั้งลงไปด้านล่าง คะแนนในระบบพิกัดนี้สามารถเปลี่ยนได้ ระบบพิกัดผู้ใช้ : โดยพื้นฐานแล้วระบบพิกัดที่มีแหล่งกำเนิดแกน x และแกน y; และมันขยายไปอย่างไม่สิ้นสุดทั้งสองทิศทาง โดยค่าเริ่มต้นต้นกำเนิดจะอยู่ที่มุมซ้ายบนของหน้าต่างแกน x อยู่ในแนวนอนทางด้านขวาและแกน y อยู่ในแนวตั้งลงไปด้านล่าง คะแนนในระบบพิกัดนี้สามารถเปลี่ยนได้โดยค่าเริ่มต้นระบบพิกัดหน้าต่างและระบบพิกัดของผู้ใช้ซ้อนทับกัน แต่ควรสังเกตที่นี่ว่าระบบพิกัดหน้าต่างเป็นขององค์ประกอบที่สร้างหน้าต่าง หลังจากกำหนดระบบพิกัดหน้าต่างจะกำหนดโทนพิกัดของหน้าต่างทั้งหมด อย่างไรก็ตามระบบประสานงานของผู้ใช้เป็นของแต่ละองค์ประกอบกราฟิก ตราบใดที่กราฟิกมีการแปลงประสานงานระบบพิกัดผู้ใช้ใหม่จะถูกสร้างขึ้น พิกัดและมิติทั้งหมดในองค์ประกอบนี้ใช้ระบบพิกัดผู้ใช้ใหม่นี้
เพื่อให้ง่าย: ระบบพิกัดหน้าต่างอธิบายโปรไฟล์พิกัดเริ่มต้นขององค์ประกอบทั้งหมดในหน้าต่างและระบบพิกัดผู้ใช้อธิบายโปรไฟล์พิกัดของแต่ละองค์ประกอบ โดยค่าเริ่มต้นองค์ประกอบทั้งหมดใช้ระบบพิกัดผู้ใช้เริ่มต้นที่ตรงกับระบบพิกัดหน้าต่าง
ประสานงานการเปลี่ยนแปลงพื้นที่ ลองทบทวนการเปลี่ยนแปลงของพิกัดผู้ใช้ Canvas ซึ่งดำเนินการผ่านฟังก์ชั่นการแปลการปรับขนาดและการหมุน การแปลงแต่ละครั้งจะทำงานกับตัวเลขที่วาดในภายหลังเว้นแต่การแปลงจะดำเนินการอีกครั้งซึ่งเป็นแนวคิดของระบบพิกัดผู้ใช้ปัจจุบัน Canvas มีระบบพิกัดผู้ใช้เพียงคนเดียวใน SVG สถานการณ์แตกต่างอย่างสิ้นเชิง ในฐานะองค์ประกอบกราฟเวกเตอร์ SVG นั้นถือเป็นระบบพิกัดของผู้ใช้เป็นหลัก ทั้งสองช่องว่างของ SVG สามารถแปลงได้: การแปลงพื้นที่หน้าต่างและการแปลงพื้นที่ของผู้ใช้ การแปลงพื้นที่หน้าต่างถูกควบคุมโดย Viewbox คุณสมบัติขององค์ประกอบที่เกี่ยวข้อง (องค์ประกอบเหล่านี้สร้างหน้าต่างใหม่); การแปลงพื้นที่ผู้ใช้ถูกควบคุมโดยแอตทริบิวต์การแปลงขององค์ประกอบกราฟ การแปลงพื้นที่หน้าต่างถูกนำไปใช้กับหน้าต่างทั้งหมดที่สอดคล้องกันและการแปลงพื้นที่ผู้ใช้จะถูกนำไปใช้กับองค์ประกอบปัจจุบันและองค์ประกอบลูก
การแปลงหน้าต่าง - คุณสมบัติ viewboxองค์ประกอบทั้งหมดที่สามารถสร้างหน้าต่าง (ดูส่วนถัดไป), รวมถึงเครื่องหมาย, รูปแบบและองค์ประกอบมุมมองมีแอตทริบิวต์ viewbox
รูปแบบของค่าแอตทริบิวต์ viewbox คือ (x0, y0, u_width, u_height) และแต่ละค่าจะถูกคั่นด้วยเครื่องหมายจุลภาคหรือพื้นที่ พวกเขาร่วมกันกำหนดพื้นที่ที่แสดงโดยหน้าต่าง: พิกัดของมุมซ้ายบนของหน้าต่างถูกตั้งค่าเป็น (x0, y0), ความกว้างของหน้าต่างถูกตั้งค่าเป็น U_width และความสูงคือ u_height; การแปลงนี้ใช้ได้กับหน้าต่างทั้งหมด
อย่าสับสนที่นี่: ขนาดและตำแหน่งของหน้าต่างถูกกำหนดโดยองค์ประกอบที่สร้างหน้าต่างและองค์ประกอบรอบนอก (ตัวอย่างเช่นหน้าต่างที่สร้างขึ้นโดยองค์ประกอบ SVG ด้านนอกสุดจะถูกกำหนดโดย CSS ความกว้างและความสูง) Viewbox ที่นี่เป็นจริงเพื่อตั้งค่าพื้นที่ที่กำหนดนี้เพื่อแสดงส่วนใดของระบบพิกัดหน้าต่าง การตั้งค่าของ Viewbox นั้นมีการแปลงสองครั้ง: การซูมและการแปลของพื้นที่หน้าต่างการคำนวณการเปลี่ยนแปลงนั้นง่ายมากเช่นกัน: ใช้หน้าต่างมุมมองขององค์ประกอบ SVG นอกสุดเป็นตัวอย่างโดยสมมติว่าความกว้างและความยาวของ SVG ถูกตั้งค่าเป็นความกว้างความสูงและการตั้งค่าของ viewbox คือ (x0, y0, u_width, u_height) จากนั้นเครื่องชั่งของความกว้างและความสูงของรูปวาดคือ: ความกว้าง/U_Width, ความสูง/u_height ตามลำดับ พิกัดของมุมบนซ้ายของหน้าต่างถูกตั้งค่าเป็น (x0, y0)
สัมผัสกับความแตกต่างในผลลัพธ์ที่วาดโดยรหัสต่อไปนี้:
<svg viewbox = "0 0 200 200">
<rect x = "0" y = "0" fill = "red" />>
<rect x = "0" y = "0" fill = "green" />>
</svg>
ในรูปที่วาดในตัวอย่างด้านบนคุณสามารถเห็นสี่เหลี่ยมสีเขียวและสีแดง ในกรณีนี้จุดในระบบพิกัดหน้าต่างยังคงสอดคล้องกับจุดบนหน้าต่างซึ่งเป็นค่าเริ่มต้น
<svg viewbox = "0 0 100 100">
<rect x = "0" y = "0" fill = "red" />>
<rect x = "0" y = "0" fill = "green" />>
</svg>
ในรูปที่วาดในตัวอย่างด้านบนคุณสามารถเห็นสี่เหลี่ยมสีเขียวและสี่เหลี่ยมสีเขียวจะปรากฏขึ้นบนหน้าจอด้วย 200*200 พิกเซล ในเวลานี้คะแนนพิกัดจะไม่ได้ทีละอีกต่อไปและตัวเลขจะขยายใหญ่ขึ้น
<svg viewbox = "0 0 400 400">
<rect x = "0" y = "0" fill = "red" />>
<rect x = "0" y = "0" fill = "green" />>
</svg>
ในรูปที่วาดในตัวอย่างข้างต้นหน่วยของระบบพิกัดหน้าต่างจะลดลงดังนั้นสี่เหลี่ยมทั้งสองจะลดลง
ในการทำงานประจำวันงานหนึ่งที่เราต้องทำให้เสร็จสมบูรณ์คือการขยายชุดกราฟิกเพื่อปรับให้เข้ากับคอนเทนเนอร์หลัก เราสามารถทำได้โดยการตั้งค่าคุณสมบัติ ViewBox
องค์ประกอบ ที่สามารถ สร้างหน้าต่างใหม่ เมื่อใดก็ได้เราสามารถทำรังหน้าต่าง เมื่อสร้างหน้าต่างใหม่ระบบพิกัดหน้าต่างใหม่และระบบพิกัดผู้ใช้จะถูกสร้างขึ้นและแน่นอนจะมีการสร้างหน้าต่างใหม่รวมถึงเส้นทางการตัด ต่อไปนี้เป็นรายการองค์ประกอบที่สามารถสร้างหน้าต่างใหม่: SVG : SVG รองรับการทำรัง สัญลักษณ์ : สร้างหน้าต่างใหม่เมื่ออินสแตนซ์โดยองค์ประกอบการใช้งาน รูปภาพ : หน้าต่างใหม่ถูกสร้างขึ้นเมื่ออ้างอิงองค์ประกอบ SVG ต่างประเทศ : สร้างหน้าต่างใหม่เพื่อแสดงผลวัตถุภายใน รักษาสเกลสเกลคุณสมบัติการใช้งาน บางครั้งโดยเฉพาะอย่างยิ่งเมื่อใช้ viewbox เราคาดหวังว่ากราฟิกจะครอบครองหน้าต่างทั้งหมดแทนที่จะปรับขนาดในสัดส่วนเดียวกันทั้งสองทิศทาง บางครั้งเราหวังว่าทั้งสองทิศทางของตัวเลขจะถูกปรับขนาดในระดับคงที่ ใช้แอ็ตทริบิวต์ squalstribute serveSpectratio เพื่อให้บรรลุวัตถุประสงค์ในการควบคุมสิ่งนี้คุณสมบัตินี้เป็นองค์ประกอบทั้งหมดที่สามารถสร้างหน้าต่างใหม่รวมถึงรูปภาพเครื่องหมายรูปแบบและองค์ประกอบมุมมอง ยิ่งไปกว่านั้นแอตทริบิวต์ Salledeaspectratio จะใช้งานได้หลังจากที่ Viewbox ถูกตั้งค่าเป็นองค์ประกอบเท่านั้น หากไม่ได้ตั้งค่า viewbox คุณสมบัติของ Preserveaspectratio จะถูกละเว้น
ไวยากรณ์ของแอตทริบิวต์มีดังนี้: serventeaspectratio = [defer] <Align> [<EatorSlice>]
โปรดทราบว่าพารามิเตอร์ 3 ตัวจะต้องคั่นด้วยช่องว่าง
การเลื่อนเวลา : พารามิเตอร์เสริมที่ใช้ได้เฉพาะกับองค์ประกอบภาพ หากค่าของแอตทริบิวต์ sustraleaspectratio ในองค์ประกอบภาพเริ่มต้นด้วยการเลื่อนเวลานั่นหมายความว่าองค์ประกอบภาพใช้อัตราส่วนการปรับขนาดของภาพอ้างอิง หากภาพอ้างอิงไม่มีอัตราส่วนการปรับขนาดการเลื่อนเวลาจะถูกละเว้น องค์ประกอบอื่น ๆ ทั้งหมดไม่สนใจสตริงนี้ จัดตำแหน่ง : พารามิเตอร์นี้กำหนดการจัดตำแหน่งของการปรับสเกลแบบครบวงจรและสามารถใช้ค่าต่อไปนี้:ไม่มี - การปรับสเกล Unified ที่ไม่ได้บังคับเพื่อให้กราฟิกสามารถเติมเต็มวิวพอร์ตทั้งหมดได้อย่างสมบูรณ์
Xminymin-บังคับให้ปรับสเกลเครื่องแบบและจัดตำแหน่ง <min-x> และ <in-y> ตั้งค่าใน viewbox ให้เป็นค่า x และ y ขั้นต่ำของ Viewport
XMIDYMIN - FORCE UNIFIED SCALING และจัดตำแหน่งจุดกึ่งกลางในทิศทาง X ใน ViveWBox ให้เข้ากับจุดกึ่งกลางของทิศทาง X ของ Viewport ในระยะสั้นจุดกึ่งกลางในทิศทาง x ถูกจัดตำแหน่งและทิศทาง y เหมือนกับข้างบน
Xmaxymin - การปรับสเกลเครื่องแบบและจัดตำแหน่ง <min -x> + <vidth> ตั้งค่าใน viewbox ให้เป็นค่า x สูงสุดของ Viewport
มีค่าประเภทอื่น ๆ คล้ายกับ: xminymid, xmidymid, xmaxymid, xminymax, xmidymax, xmaxymax ความหมายของชุดค่าผสมเหล่านี้คล้ายกับสถานการณ์ข้างต้น
MEALORSLICE : พารามิเตอร์เสริมคุณสามารถใช้ค่าต่อไปนี้:พบ - ค่าเริ่มต้นปรับขนาดกราฟิกอย่างสม่ำเสมอเพื่อให้กราฟิกทั้งหมดแสดงในวิวพอร์ต
Slice - การปรับสเกลแบบครบวงจรของกราฟิกช่วยให้กราฟิกเติมวิวพอร์ตและส่วนเกินจะถูกตัดออก
รูปต่อไปนี้อธิบายถึงผลกระทบของการเติมที่หลากหลาย:
การแปลงระบบพิกัดผู้ใช้ - แอตทริบิวต์แปลง การแปลงประเภทนี้ถูกระบุโดยการตั้งค่าคุณสมบัติการแปลงองค์ประกอบ ควรสังเกตที่นี่ว่าการเปลี่ยนแปลงขององค์ประกอบที่กำหนดโดยแอตทริบิวต์การแปลงมีผลต่อองค์ประกอบและองค์ประกอบลูกเท่านั้นไม่มีส่วนเกี่ยวข้องกับองค์ประกอบอื่น ๆ และไม่ส่งผลกระทบต่อองค์ประกอบอื่น ๆ การแปล - แปล การแปลงการแปลแปลค่าพิกัดที่เกี่ยวข้องไปยังตำแหน่งที่ระบุและการแปลงจะต้องส่งผ่านไปยังจำนวนเงินที่แปลบนแกนทั้งสอง ดูตัวอย่าง:<rect x = "0" y = "0" transform = "แปล (30,40)" />>
ตัวอย่างนี้วาดสี่เหลี่ยมและแปลจุดเริ่มต้น (0,0) เป็น (30,40) แม้ว่าค่าพิกัดของ (x, y) สามารถตั้งค่าได้โดยตรง แต่ก็สะดวกมากที่จะนำไปใช้โดยใช้การแปลงการแปล พารามิเตอร์ที่สองของการแปลงนี้สามารถละเว้นได้และค่าเริ่มต้นจะถูกประมวลผลเมื่อประมวลผล 0
หมุน - หมุน การหมุนองค์ประกอบก็เป็นงานที่พบบ่อยมาก เราสามารถใช้การแปลงการหมุนเพื่อนำไปใช้ซึ่งต้องใช้พารามิเตอร์มุมการหมุนที่จะส่งผ่านดูตัวอย่าง:<rect x = "20" y = "20" transform = "หมุน (45)" />>
ตัวอย่างนี้แสดงสี่เหลี่ยมการหมุน 45 องศา หมายเหตุเล็กน้อย:
1. การแปลงที่นี่ใช้ค่ามุมเป็นพารามิเตอร์
2. การหมุนหมายถึงการหมุนเมื่อเทียบกับแกน x
3. การหมุนจะขยายไปรอบ ๆ ต้นกำเนิด (0,0) ของระบบพิกัดผู้ใช้
เอนกาย - เบ้ การแปลงยังรองรับการเปลี่ยนแปลงแบบเอียงซึ่งสามารถเอียงไปตามแกน x (มุมซ้ายและซ้ายและขวาเอียงไปทางขวาซึ่งจริง ๆ แล้วเอียงไปที่แกน y) หรือตามแนวแกน y (ขึ้นและลงซึ่งเอียงไปที่มุมลง การแปลงนี้ต้องการพารามิเตอร์มุมที่จะผ่านซึ่งจะกำหนดมุมของความโน้มเอียง ดูตัวอย่างต่อไปนี้:<svg>
<rect x = "0" y = "0" fill = "green" />>
<circle cx = "15" cy = "15" r = "15" fill = "red" />>>>>
<circle cx = "15" cy = "15" r = "15" fill = "yellow" transform = "skewx (45)" />
<rect x = "30" y = "30" />
<rect x = "30" y = "30" transform = "skewx (45)" />>>
<rect x = "30" y = "30" transform = "skewy (45)" />>>
</svg>
จากผลลัพธ์คุณสามารถเห็นตำแหน่งและรูปร่างของรูปสี่เหลี่ยมผืนผ้าที่มีขนาดเท่ากันโดยตรงหลังจากการแปลงความโน้มเอียงที่แตกต่างกัน โปรดทราบว่าตำแหน่งเริ่มต้นของสี่เหลี่ยมมีการเปลี่ยนแปลงเนื่องจากในระบบพิกัดใหม่ (30,30) อยู่ในตำแหน่งที่แตกต่างกันอยู่แล้ว
ขนาด วัตถุการปรับสเกลเสร็จสมบูรณ์โดยการแปลงสเกลซึ่งยอมรับพารามิเตอร์ 2 ตัวโดยระบุอัตราส่วนการปรับขนาดในแนวนอนและแนวตั้งตามลำดับ หากมีการละเว้นพารามิเตอร์ที่สองค่าเดียวกับพารามิเตอร์แรกจะถูกถ่าย ดูตัวอย่างต่อไปนี้:<svg>
<text x = "20" y = "20" font-size = "20"> abc (scale) </text>
<text x = "50" y = "50" font-size = "20" transform = "scale (1.5)"> abc (scale) </xtreat>
</svg>
Transform Matrix - Matrix ใครก็ตามที่ศึกษากราฟิกรู้ว่าการแปลงทั้งหมดนั้นเป็นจริงด้วยเมทริกซ์ดังนั้นการแปลงด้านบนสามารถแสดงได้ด้วยเมทริกซ์ 3*3:เอซ
BDF
0 0 1
เนื่องจากมีการใช้เพียง 6 ค่าเท่านั้นจึงมีตัวย่อเป็น [ABCDEF] กำหนดเมทริกซ์ (A, B, C, D, E, F) เพื่อแปลงเป็นการเปลี่ยนแปลงที่สอดคล้องกัน การแปลงจะแปลงทั้งพิกัดและความยาวเป็นมิติใหม่ เมทริกซ์ที่สอดคล้องกันของการเปลี่ยนแปลงข้างต้นมีดังนี้:
การแปลงการแปล [1 0 1 0 tx ty]:
1 0 TX
0 1 ty
0 0 1
การแปลงสเกล [SX 0 0 SY 0 0]:
sx 0 0
0 SY 0
0 0 1
การเปลี่ยนแปลงการหมุน [cos (a) sin (a) -sin (a) cos (a) 0 0]:
cos (a) -sin (a) 0
บาป (a) cos (a) 0
00 1
เอียงไปตามแกน x [1 0 tan (a) 1 0 0]:
1 tan (a) 0
0 1 0
0 0 1
เอียงไปตามแกน y [1 tan (a) 0 1 0 0 0]:
11 0
Tan (a) 1 0
00 1
เปลี่ยนสาระสำคัญ เมื่อเราสรุปผืนผ้าใบมาก่อนเรารู้ว่าการแปลงทุกชนิดจะถูกนำไปใช้กับระบบพิกัดของผู้ใช้ ใน SVG การแปลงทั้งหมดใช้สำหรับสองระบบพิกัด (โดยหลักระบบพิกัดผู้ใช้) หลังจากระบุแอตทริบิวต์การแปลงไปยังวัตถุคอนเทนเนอร์หรือวัตถุกราฟหรือระบุแอตทริบิวต์ viewbox เป็น SVG, สัญลักษณ์, เครื่องหมาย, รูปแบบ, มุมมอง, SVG จะแปลงตามระบบพิกัดผู้ใช้ปัจจุบันเพื่อสร้างระบบพิกัดผู้ใช้ใหม่และดำเนินการกับวัตถุปัจจุบันและวัตถุย่อย หน่วยของพิกัดและความยาวที่ระบุในวัตถุนี้ไม่ได้เป็น 1: 1 ที่สอดคล้องกับระบบพิกัดส่วนปลายอีกต่อไป แต่จะถูกแปลงเป็นระบบพิกัดผู้ใช้ใหม่เนื่องจากมันเปลี่ยนรูป; ระบบประสานงานผู้ใช้ใหม่นี้จะทำหน้าที่เฉพาะองค์ประกอบปัจจุบันและองค์ประกอบลูก ห่วงโซ่การเปลี่ยนแปลง คุณสมบัติการแปลงรองรับการตั้งค่าการแปลงหลายครั้ง การแปลงเหล่านี้จะถูกคั่นด้วยช่องว่างตรงกลางและรวมเข้าด้วยกันในที่พัก เอฟเฟกต์การดำเนินการนั้นเหมือนกับการดำเนินการแปลงเหล่านี้อย่างอิสระตามลำดับ<g transform = "translate (-10, -20) สเกล (2) หมุน (45) แปล (5,10)">>
<!-องค์ประกอบกราฟิกไปที่นี่->
</g>
เอฟเฟกต์ข้างต้นเหมือนกับต่อไปนี้:
<g transform = "translate (-10, -20)">
<g transform = "มาตราส่วน (2)">
<g transform = "หมุน (45)">
<g transform = "แปล (5,10)">
<!-องค์ประกอบกราฟิกไปที่นี่->
</g>
</g>
</g>
</g>
หน่วย สุดท้ายมาพูดคุยเกี่ยวกับหน่วย พิกัดและความยาวใด ๆ สามารถติดตั้งและไม่มีหน่วย ไม่มีหน่วยค่าที่ไม่มีหน่วยถือว่ามีหน่วยผู้ใช้ซึ่งเป็นค่าหน่วยของระบบพิกัดผู้ใช้ปัจจุบัน
สถานการณ์นำหน่วยหน่วยที่เกี่ยวข้องใน SVG นั้นเหมือนกับใน CSS: EM, EX, PX, PT, PC, CM, MM และ In. % สามารถใช้ความยาวได้
หน่วยการวัดสัมพัทธ์: EM และ EX ก็คล้ายกับ CSS ซึ่งสัมพันธ์กับขนาดตัวอักษรและ X-height ของแบบอักษรปัจจุบัน
หน่วยการวัดแบบสัมบูรณ์: หนึ่ง PX เท่ากับหน่วยผู้ใช้นั่นคือ 5PX นั้นเหมือนกับ 5 อย่างไรก็ตามไม่ว่า PX จะสอดคล้องกับพิกเซลขึ้นอยู่กับว่ามีการเปลี่ยนแปลงหรือไม่
หน่วยอื่น ๆ นั้นเป็นทวีคูณของ Px: 1pt = 1.25px, 1pc = 15px, 1mm = 3.543307px, 1cm = 35.43307px, 1in = 90px
หากความกว้างและความสูงขององค์ประกอบ SVG นอกสุดไม่ได้ระบุหน่วย (นั่นคือหน่วยผู้ใช้) ค่าเหล่านี้จะถูกพิจารณาว่าเป็น PX
บทความนี้ค่อนข้างยากที่จะพูดคุย ในความเป็นจริงเพียงจำไว้ว่าพิกัดและความยาวขององค์ประกอบกราฟิกอ้างถึงพิกัดและ ความยาว ของระบบพิกัดผู้ใช้ใหม่หลังจากการแปลงสองครั้งของระบบพิกัดหน้าต่างและการแปลงระบบพิกัดของผู้ใช้ การอ้างอิงเชิงปฏิบัติ: ดัชนีสคริปต์: http://msdn.microsoft.com/zh-cn/library/ff97110(v=vs.85).aspxศูนย์พัฒนา: https://developer.mozilla.org/en/svg
ข้อมูลอ้างอิงยอดนิยม: http://www.chinasvg.com/
เอกสารอย่างเป็นทางการ: http://www.w3.org/tr/svg11/