SVG Elements
| Elemen | Deskripsi | atribut |
|---|---|---|
| <a> | Membuat link di sekitar elemen SVG | xlink:show xlink:actuate xlink:href target |
| <altGlyph> | Memberikan kontrol atas mesin terbang yang digunakan untuk membuat data karakter tertentu | x y dx dy rotate glyphRef format xlink:href |
| <altGlyphDef> | Mendefinisikan satu set substitusi untuk mesin terbang | id |
| <altGlyphItem> | Mendefinisikan satu set calon substitusi glyph | id |
| <animate> | Mendefinisikan bagaimana atribut dari elemen berubah dari waktu ke waktu | attributeName="the name of the target attribute" by="a relative offset value" from="the starting value" to="the ending value" dur="the duration" repeatCount="the number of time the animation will take place" |
| <animateMotion> | Penyebab elemen direferensikan bergerak sepanjang jalur gerak | calcMode="the interpolation mode for the animation. Can be 'discrete',
'linear', 'paced', 'spline'" path="the motion path" keyPoints="how far along the motion path the object shall move at the moment in time" rotate="applies a rotation transformation" xlink:href="an URI reference to the <path> element which defines the motion path" |
| <animateTransform> | Menjiwai atribut transformasi pada elemen target, sehingga memungkinkan animasi untuk mengontrol terjemahan, scaling, rotasi dan / atau skewing | by="a relative offset value" from="the starting value" to="the ending value" type="the type of transformation which is to have its values change over time. Can be 'translate', 'scale', 'rotate', 'skewX', 'skewY'" |
| <circle> | Mendefinisikan lingkaran | cx="the x-axis center of the circle" cy="the y-axis center of the circle" r="The circle's radius". Required. + presentation attributes: Color, FillStroke, Graphics |
| <clipPath> | Kliping tentang menyembunyikan apa yang biasanya akan ditarik. Stensil yang mendefinisikan apa dan apa yang tidak ditarik disebut clipping path | clip-path="the referenced clipping path is intersected with the
referencing clipping path" clipPathUnits="'userSpaceOnUse' or 'objectBoundingBox'. The second value makes units of children a fraction of the object bounding box which uses the mask (default: 'userSpaceOnUse') " |
| <color-profile> | Menentukan gambaran profil warna (ketika dokumen ditata menggunakan CSS) | local="the unique ID for a locally stored color profile" name="" rendering-intent="auto|perceptual|relative-colorimetric|saturation|absolute-colorimetric" xlink:href="the URI of an ICC profile resource" |
| <cursor> | Mendefinisikan kursor kustom platform-independen | x="the x-axis top-left corner of the cursor (default is 0) " y="the y-axis top-left corner of the cursor (default is 0) " xlink:href="the URI of the image to use as the cursor |
| <defs> | Sebuah wadah untuk elemen direferensikan | |
| <desc> | Sebuah deskripsi teks saja untuk elemen wadah atau elemen grafis dalam SVG (agen pengguna dapat menampilkan teks sebagai tooltip) | |
| <ellipse> | Mendefinisikan elips | cx="the x-axis center of the ellipse" cy="the y-axis center of the ellipse" rx="the length of the ellipse's radius along the x-axis". Required. ry="the length of the ellipse's radius along the y-axis". Required. + presentation attributes: Color, FillStroke, Graphics |
| <feBlend> | Menyusun dua benda bersama-sama sesuai dengan blending mode tertentu | mode="the image blending modes: normal|multiply|screen|darken|lighten" in="identifies input for the given filter primitive: SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>" in2="the second input image to the blending operation" |
| feColorMatrix | Filter SVG. Menerapkan transformasi matriks | |
| feComponentTransfer | Filter SVG. Melakukan pemetaan komponen-bijaksana data | |
| feComposite | Filter SVG. | |
| feConvolveMatrix | Filter SVG. | |
| feDiffuseLighting | Filter SVG. | |
| feDisplacementMap | Filter SVG. | |
| feDistantLight | Filter SVG. Mendefinisikan sumber cahaya | |
| feFlood | Filter SVG. | |
| feFuncA | Filter SVG. Sub-elemen feComponentTransfer | |
| feFuncB | Filter SVG. Sub-elemen feComponentTransfer | |
| feFuncG | Filter SVG. Sub-elemen feComponentTransfer | |
| feFuncR | Filter SVG. Sub-elemen feComponentTransfer | |
| feGaussianBlur | Filter SVG. Melakukan blur Gaussian pada gambar | |
| feImage | Filter SVG. | |
| feMerge | Filter SVG. Menciptakan lapisan gambar di atas satu sama lain | |
| feMergeNode | Filter SVG. Sub-elemen feMerge | |
| feMorphology | Filter SVG. Melakukan "fattening" atau "thinning" pada sumber grafis | |
| feOffset | Filter SVG. Memindahkan gambar sebuah relatif terhadap posisi saat ini | |
| fePointLight | Filter SVG. | |
| feSpecularLighting | Filter SVG. | |
| feSpotLight | Filter SVG. | |
| feTile | Filter SVG. | |
| feTurbulence | Filter SVG. | |
| filter | Wadah untuk efek filter | |
| font | Mendefinisikan font | |
| font-face | Menggambarkan karakteristik font | |
| font-face-format | ||
| font-face-name | ||
| font-face-src | ||
| font-face-uri | ||
| foreignObject | ||
| <g> | Digunakan untuk mengelompokkan berbagai elemen | id="the name of the group" fill="the fill color for the group" opacity="the opacity for the group" + presentation attributes: All |
| glyph | Mendefinisikan grafis untuk mesin terbang yang diberikan | |
| glyphRef | Mendefinisikan mesin terbang mungkin untuk menggunakan | |
| hkern | ||
| <image> | Mendefinisikan gambar | x="the x-axis top-left corner of the image" y="the y-axis top-left corner of the image" width="the width of the image". Required. height="the height of the image". Required. xlink:href="the path to the image". Required. + presentation attributes: Color, Graphics, Images, Viewports |
| <line> | Mendefinisikan garis | x1="the x start point of the line" y1="the y start point of the line" x2="the x end point of the line" y2="the y end point of the line" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <linearGradient> | Mendefinisikan gradien linier. gradien linier mengisi objek dengan menggunakan vektor, dan dapat didefinisikan sebagai gradien horisontal, vertikal atau sudut. | id="the unique id used to reference this pattern. Required to reference
it" gradientUnits="'userSpaceOnUse' or 'objectBoundingBox'. Use the view box or object to determine relative position of vector points. (Default 'objectBoundingBox') " gradientTransform="the transformation to apply to the gradient" x1="the x start point of the gradient vector (number or % - 0% is default) " y1="the y start point of the gradient vector. (0% default) " x2="the x end point of the gradient vector. (100% default) " y2="the y end point of the gradient vector. (0% default) " spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="reference to another gradient whose attribute values are used as defaults and stops included. Recursive" |
| <marker> | Spidol dapat ditempatkan pada simpul dari garis, polylines, poligon dan jalan. Unsur-unsur ini dapat menggunakan marker atribut "marker-start" , "marker-mid" dan "penanda-end" 'yang mewarisi secara default atau dapat diatur untuk' tidak 'atau URI dari penanda didefinisikan. Anda harus terlebih dahulu menetapkan penanda sebelum Anda dapat referensi melalui URI nya. Setiap jenis bentuk dapat dimasukkan ke dalam penanda. Mereka digambar di atas elemen mereka melekat | markerUnits="'strokeWidth' or 'userSpaceOnUse'. If 'strokeWidth' is used
then one unit equals one stroke width. Otherwise, the marker does not scale
and uses the the same view units as the referencing element (default 'strokeWidth') " refx="the position where the marker connects with the vertex (default 0) " refy="the position where the marker connects with the vertex (default 0) " orient="'auto' or an angle to always show the marker at. 'auto' will compute an angle that makes the x-axis a tangent of the vertex (default 0) " markerWidth="the width of the marker (default 3) " markerHeight="the height of the marker (default 3) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " + presentation attributes: All |
| <mask> | Masking adalah kombinasi dari nilai-nilai opacity dan kliping. Seperti kliping Anda dapat menggunakan bentuk, teks atau jalur untuk menentukan bagian dari topeng. Keadaan default masker sepenuhnya transparan yang merupakan kebalikan dari kliping pesawat. Grafis dalam masker menetapkan bagaimana bagian buram topeng yang | maskUnits="'userSpaceOnUse' or 'objectBoundingBox'. Set whether the
clipping plane is relative the full view port or object (default: 'objectBoundingBox') " maskContentUnits="Use the second with percentages to make mask graphic positions relative the object. 'userSpaceOnUse' or 'objectBoundingBox' (default: 'userSpaceOnUse') " x="the clipping plane of the mask (default: -10%) " y="the clipping plane of the mask (default: -10%) " width="the clipping plane of the mask (default: 120%) " height="the clipping plane of the mask (default: 120%) " |
| metadata | menentukan metadata | |
| missing-glyph | ||
| mpath | ||
| <path> | Mendefinisikan jalan | d="a set of commands which define the path" pathLength="If present, the path will be scaled so that the computed path length of the points equals this value" transform="a list of transformations" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <pattern> | Mendefinisikan koordinat Anda ingin melihat untuk menunjukkan dan ukuran tampilan. Kemudian Anda menambahkan bentuk ke dalam pola Anda. Pola mengulang ketika tepi tampilan kotak (viewing area) terkena | id="the unique id used to reference this pattern." Required. patternUnits="'userSpaceOnUse' or 'objectBoundingBox'. The second value makes units of x, y, width, height a fraction (or %) of the object bounding box which uses the pattern." patternContentUnits="'userSpaceOnUse' or 'objectBoundingBox'" patternTransform="allows the whole pattern to be transformed" x="pattern's offset from the top-left corner (default 0) " y="pattern's offset from the top-left corner. (default 0) " width="the width of the pattern tile (default 100%) " height="the height of the pattern tile (default 100%) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " xlink:href="reference to another pattern whose attribute values are used as defaults and any children are inherited. Recursive" |
| <polygon> | Mendefinisikan grafis yang mengandung setidaknya tiga sisi | points="the points of the polygon. The total number of points must be
even". Required. fill-rule="part of the FillStroke presentation attributes" + presentation attributes: Color, FillStroke, Graphics, Markers |
| <polyline> | Mendefinisikan bentuk apapun yang hanya terdiri dari garis lurus | points="the points on the polyline". Required. + presentation attributes: Color, FillStroke, Graphics, Markers |
| <radialGradient> | Mendefinisikan gradien radial. gradien radial dibuat dengan mengambil lingkaran dan lancar mengubah nilai-nilai antara berhenti gradien dari titik fokus ke jari-jari luar. | gradientUnits="'userSpaceOnUse' or 'objectBoundingBox'. Use the view box
or object to determine relative position of vector points. (Default 'objectBoundingBox') " gradientTransform="the transformation to apply to the gradient" cx="the center point of the gradient (number or % - 50% is default) " cy="the center point of the gradient. (50% default) " r="the radius of the gradient. (50% default) " fx="the focus point of the gradient. (0% default) " fy="The focus point of the gradient. (0% default) " spreadMethod="'pad' or 'reflect' or 'repeat'" xlink:href="Reference to another gradient whose attribute values are used as defaults and stops included. Recursive" |
| <rect> | Mendefinisikan persegi panjang | x="the x-axis top-left corner of the rectangle" y="the y-axis top-left corner of the rectangle" rx="the x-axis radius (to round the element) " ry="the y-axis radius (to round the element) " width="the width of the rectangle". Required. height="the height of the rectangle" Required. + presentation attributes: Color, FillStroke, Graphics |
| script | Wadah untuk script (eg, ECMAScript) | |
| set | Menetapkan nilai atribut untuk suatu jangka waktu yang ditentukan | |
| <stop> | Berhenti untuk gradien | offset="the offset for this stop (0 to 1/0% to 100%) ". Required. stop-color="the color of this stop" stop-opacity="the opacity of this stop (0 to 1) " |
| style | Memungkinkan style sheet untuk ditanamkan langsung dalam konten SVG | |
| <svg> | Menciptakan sebuah dokumen fragmen SVG | x="top left corner when embedded (default 0) " y="top left corner when embedded (default 0) " width="the width of the svg fragment (default 100%) " height="the height of the svg fragment (default 100%) " viewBox="the points "seen" in this SVG drawing area. 4 values separated by white space or commas. (min x, min y, width, height) " preserveAspectRatio="'none' or any of the 9 combinations of 'xVALYVAL' where VAL is 'min', 'mid' or 'max'. (default xMidYMid) " zoomAndPan="'magnify' or 'disable'. Magnify option allows users to pan and zoom your file (default magnify) " xml="outermost <svg> element needs to setup SVG and its namespace: xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"" + presentation attributes: All |
| switch | ||
| symbol | ||
| <text> | Mendefinisikan teks | x="a list of x-axis positions. The nth x-axis position is given to the
nth character in the text. If there are additional characters after the
positions run out they are placed after the last character. 0 is default" y="a list of y-axis positions. (see x) . 0 is default" dx="a list of lengths which moves the characters relative to the absolute position of the last glyph drawn. (see x) " dy="a list of lengths which moves the characters relative to the absolute position of the last glyph drawn. (see x) " rotate="a list of rotations. The nth rotation is performed on the nth character. Additional characters are NOT given the last rotation value" textLength="a target length for the text that the SVG viewer will attempt to display the text between by adjusting the spacing and/or the glyphs. (default: The text's normal length) " lengthAdjust="tells the viewer what to adjust to try to accomplish rendering the text if the length is specified. The two values are 'spacing' and 'spacingAndGlyphs'" + presentation attributes: Color, FillStroke, Graphics, FontSpecification, TextContentElements |
| textPath | ||
| title | Sebuah deskripsi teks saja untuk elemen dalam SVG - tidak ditampilkan sebagai bagian dari grafis. agen pengguna dapat menampilkan teks sebagai tooltip | |
| <tref> | Referensi setiap <text> elemen dalam dokumen SVG dan menggunakannya kembali | Identical to the <text> element |
| <tspan> | Identik dengan <text> elemen tetapi dapat bersarang di dalam tag teks dan di dalam dirinya sendiri | Identical to the <text> element + in addition: xlink:href="Reference to a <text> element" |
| <use> | Menggunakan URI untuk referensi <g>, <svg> atau lainnya elemen grafis dengan atribut id unik dan mengembangkannya. copy hanya referensi dengan aslinya sehingga hanya yang asli ada dalam dokumen. Setiap perubahan dengan aslinya mempengaruhi semua salinan. | x="the x-axis top-left corner of the cloned element" y="the y-axis top-left corner of the cloned element" width="the width of the cloned element" height="the height of the cloned element" xlink:href="a URI reference to the cloned element" + presentation attributes: All |
| view | ||
| vkern |