Podczas tworzenie grafiki SVG może przydać się możliwość definiowania własnych typów obiektów. Jest to szczególnie przydatne kiedy ten sam obiekt występuje wiele razy na rysunku. Bardzo często tego typu obiekt będzie bardziej złożony niż wbudowane typy takie jak prostokąt czy koło. Weźmy pod uwagę tego typu rysunek:
Napisanie powyższego przykładu sprowadzałoby się do napisania trzech razy tego samego obiektu i jedynie zmiany koloru wypełnienia. Nie jest to słuszne rozwiązanie, ponieważ jeśli chciałoby się zmienić typ obiektu, który został przedstawiony na rysunku np. zamiast pięciokąta żeby był sześciokąt to należałoby zmienić każdy obiekt oddzielnie. Najbardziej efektywnym rozwiązaniem jest zdefiniowanie typu obiektu.
W celu powielania wybranego obiektu należy najpierw zadeklarować, że dany obrazek SVG będzie korzystał z przestrzeni nazw xlink. W tym celu należy wpisać odpowiedni atrybut jak w linijce (3.):
Obiekt definiuje się tak samo jak np. gradienty w sekcji defs. Definiowanym obiektem może być wszystko: linia, wielokąt czy grupa obiektów. Definiowany obiekt musi mieć określony identyfikator id, aby można się było do niego odwołać. Przykładowa deklaracja pięciokąta będzie wyglądać następująco:
Tak przygotowany obiekt można już wykorzystać. W tym celu należy użyć obiektu use, a następnie podać pozycję przy pomocy atrybutów x i y. Następnie odwołanie do obiektu należy wykonać poprzez atrybut xlink:href i podać jako wartość #, a po nim identyfikator zdefiniowanego obiektu. Opcjonalnie można ustalić atrybuty takie jak fill, stroke, lecz o tym szerzej w dalszej części artykułu.
Efektem końcowym przedstawionego kodu jest obrazek taki jak został przedstawiony na początku artykułu. W dalszej części zostanie dokładnie wytłumaczone jak w pełni wykorzystać definicję obiektu.
Załóżmy, że definiujemy obiekt, który będzie przedstawiał znak drogowy. W tym przykładzie wyjaśnione zostanie jak prawidłowo napisać definicję znaków zakazu oraz nakazu. Przede wszystkim najpierw należy zauważyć, że oba znaki mają kształt koła i wiszą na słupku.
Dla słupka można ustalić zarówno wypełnienie jak i kolor obramowania. Jednak oba rodzaje znaków mają jedynie wspólny kształt. Zarówno kolor obramowania jak i wypełnienia nie powinien być ustalany domyślnie w definicji obiektu, ponieważ nie będzie możliwości jego zmiany. W tym przypadku zostanie wykorzystana grupa, ponieważ obiekt będzie składał się z dwóch podelementów (słupka i koła).
(5. - 9.) Definicja obiektu, który składa się z (6. - 7.) prostokąta jako słupek oraz (8.) koła. Następnie (11. - 14.) wyświetlane są dwa różne znaki chociaż korzystają z tego samego obiektu wyjściowego.
Efektem napisanego kodu SVG jest poniższy rysunek:
Warto zauważyć, że kolor wypełnienia oraz obramowania został pobrany z przekazanych argumentów w obiekcie use. W przypadku, gdyby słupek nie miał ustalonego koloru wypełnienia to miałby on ten sam kolor wypełnienia co znak. Analogicznie też tak będzie dla dowolnej właściwości np. obramowania. Przykładowo po usunięciu zapisu wypełnienia i obramowania słupka rysunek wyglądałby następująco:
Taki rezultat może znaleźć zastosowanie w innym projekcie.
Jeśli obiekt został zdefiniowany prawidłowo to można go wykorzystywać jego dowolne przekształcenie. Innymi słowy nie ma potrzeby zmieniać, albo dodawać kolejnej definicji, aby uzyskać obiekt mniejszy lub większy. W celu prezentacji tego problemu warto się przyjrzeć poniższemu rysunkowi:
W kodzie rysunku nie zostały zdefiniowanych pięć obiektów, ani dwóch definicji. Jest tylko jedna definicja i została wykorzystana pięć razy. Do powiększenia i obrócenia obiektu został wykorzystany atrybut transform. Poniżej znajduje się kod rysunku, który sugeruje dobrze przeanalizować, aby zrozumieć jak można ten sam obiekt wykorzystać kilka razy:
Na poniższym obrazku została wykorzystana następująca definicja:
Każdy kolejny kwadrat jest 20% mniejszy od poprzedniego. Ponadto nieparzyste kwadraty są wyrównane do prawego górnego rogu poprzedniego kwadratu, a parzyste do lewego dolnego rogu poprzedniego kwadratu. Użyta paleta kolorów może być dowolna niż przedstawiona na rysunku.
