SVG
Penampilan
Scalable Vector Graphics | |
---|---|
Sambungan fail: | .svg, .svgz |
Jenis media Internet: | image/svg+xml[1] |
Dibangunkan oleh: | W3C |
Jenis format: | Format imej vektor |
Diperluas daripada: | XML |
SVG ialah sebuah bahasa di dalam XML yang digunakan untuk memerihalkan penggunaan bersifat grafik dan grafik dua dimensi. Ia merupakan kependekan bagi Scaleable Vector Graphics, bermaksud dari segi bahasa grafik vektor boleh skala.
Teknologi ini telah dibangunkan oleh W3C dan mempunyai sambungan fail .SVG
SVG menggunakan skrip untuk menghasilkan imej pada pelayar web. Sebagai contoh, kod berikut:
<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg version="1.1" baseProfile="full" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" width="70px" height="100px" viewBox="0 0 350 500"> <defs> <path id="cog" fill="darkred" transform="scale(0.4)" d="M 213 0 L 209 39 L 204 78 L 184 87 L 164 96 L 132 70 L 101 45 L 74 72 L 47 99 L 72 130 L 97 162 L 88 181 L 79 200 L 44 205 C 24 208 7 210 4 211 C 1 212 0 223 0 250 L 0 287 L 39 291 C 63 294 79 297 79 299 C 79 301 82 311 87 320 L 95 338 L 70 368 L 45 399 L 72 426 L 99 453 L 129 430 L 159 406 L 177 415 C 187 420 197 425 199 425 C 200 426 203 441 206 459 C 208 477 210 493 211 496 C 212 499 222 500 249 500 L 287 500 L 291 464 C 294 436 296 427 301 426 C 304 425 314 421 324 416 L 341 408 L 370 432 L 400 455 L 426 428 C 446 408 452 400 450 397 C 448 394 437 381 427 368 L 407 343 L 416 325 C 421 315 424 305 424 303 C 424 299 432 297 476 292 L 498 289 L 499 251 L 500 213 L 462 209 C 439 206 424 203 424 201 C 424 199 421 189 416 179 L 407 160 L 431 131 L 455 101 L 428 74 L 401 47 L 371 71 L 341 95 L 320 86 L 299 77 L 294 40 L 289 2 L 251 1 L 213 0 z M 250 170 C 294 170 330 206 330 250 C 330 294 294 330 250 330 C 206 330 170 294 170 250 C 170 206 206 170 250 170 z " /> </defs> <use xlink:href="#cog" opacity="0.3" /> <use xlink:href="#cog" opacity="0.6" transform="translate(120,120) rotate(22.5 100,100)" /> <use xlink:href="#cog" opacity="1" transform="translate(0,240)" /> </svg>
Akan menghasilkan gambar berikut: