Programming guide of SVG Renderer

Change-Id: I1ce2607ebd5ba4fcc7ff40fbe3795620f3c034e1

diff --git a/docs/content/images/renderers/svg-renderer.svg b/docs/content/images/renderers/svg-renderer.svg
new file mode 100755 (executable)
index 0000000..b7d5476
--- /dev/null
+++ b/docs/content/images/renderers/svg-renderer.svg
@@ -0,0 +1,491 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.1"
+   id="Layer_1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 306.90988 416.79828"
+   xml:space="preserve"
+   inkscape:version="0.48.4 r9939"
+   width="100%"
+   height="100%"
+   sodipodi:docname="Kid1.svg"><metadata
+     id="metadata185"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /></cc:Work></rdf:RDF></metadata><defs
+     id="defs183" /><sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="640"
+     inkscape:window-height="480"
+     id="namedview181"
+     showgrid="false"
+     fit-margin-top="0"
+     fit-margin-left="0"
+     fit-margin-right="0"
+     fit-margin-bottom="0"
+     inkscape:zoom="0.28032166"
+     inkscape:cx="152.20465"
+     inkscape:cy="184.87264"
+     inkscape:window-x="75"
+     inkscape:window-y="34"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="Layer_1" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 192.28065,343.14765 c 0,0 -4.5,75.5 37.5,71 42,-4.5 11.5,-75.5 11.5,-75.5 l -49,4.5 z"
+     id="path3"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 229.78065,414.14765 c 24.024,-2.574 24.325,-26.903 20.184,-47.259 l -56.117,5.805 c 3.172,20.614 12.003,44.018 35.933,41.454 z"
+     id="path5"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 113.60765,343.14765 c 0,0 -23.087995,69 14,73 37.088,4 48,-73 48,-73 h -62 z"
+     id="path7"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 169.15465,370.76265 -60.625,-7.118 c -3.745,20.685 -4.689,49.94 19.078,52.503 21.993,2.372 34.78,-23.738 41.547,-45.385 z"
+     id="path9"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 117.10565,371.73465 39.895,2.68 c 0,0 -7.065,27.803 -23.798,24.788 -16.733,-3.015 -16.097,-27.468 -16.097,-27.468 z"
+     id="path11"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 206.27865,381.65765 35.399,-5.164 c 0,0 2.531,26.234 -10.49,26.241 -18.543,0.011 -24.909,-21.077 -24.909,-21.077 z"
+     id="path13"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 121.49165,210.92765 c -24.560995,5.263 -52.631995,5.263 -52.631995,5.263 l 5.354,60.772 25.859995,-5.032 c 0,0 64.328,-18.197 62.574,-34.16 -2.104,-19.138 -16.595,-32.106 -41.156,-26.843 z"
+     id="path15"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#c1272d;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 231.14065,228.64765 c -10.143,-34.251 -65.789,-51.053 -65.789,-51.053 0,0 -19.298,28.07 -43.86,33.333 -1.209,0.259 -2.428,0.502 -3.65,0.736 l -20.035995,60.709 2.267995,-0.441 -16.300995,80.54 184.714995,-4.731 c 0,10e-4 -25.566,-79.313 -37.347,-119.093 z"
+     id="path17"
+     inkscape:connector-curvature="0" /><line
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="110.72466"
+     y1="311.29565"
+     x2="104.40065"
+     y2="352.30963"
+     id="line19" /><polygon
+     style="fill:#666666;stroke:#000000;stroke-miterlimit:10"
+     points="390.823,464.081 392.798,470.374 237.225,476.667 237.225,468.729 "
+     id="polygon21"
+     transform="translate(-145.43535,-189.01935)" /><linearGradient
+     id="SVGID_1_"
+     gradientUnits="userSpaceOnUse"
+     x1="317.35651"
+     y1="383.66669"
+     x2="317.35651"
+     y2="199.5519"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0"
+       style="stop-color:#402A04"
+       id="stop24" /><stop
+       offset="1"
+       style="stop-color:#7F5100"
+       id="stop26" /></linearGradient><path
+     style="fill:url(#SVGID_1_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="M 172.97165,196.01565 H 63.267655 c 0,0 -54.6040005,-192.1050008 109.704995,-188.5960008 164.309,3.5089998 106.414,188.5960008 106.414,188.5960008 h -106.415 z"
+     id="path28"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_2_"
+     gradientUnits="userSpaceOnUse"
+     x1="317.6879"
+     y1="298.16669"
+     x2="317.6879"
+     y2="399.66791"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop31" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop33" /></linearGradient><path
+     style="fill:url(#SVGID_2_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 93.798655,65.647649 c 0,0 -48.605,145.281001 77.692995,145.281001 126.298,0 80.202,-145.281001 80.202,-145.281001 H 93.798655 z"
+     id="path35"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_3_"
+     gradientUnits="userSpaceOnUse"
+     x1="316.33801"
+     y1="383.66669"
+     x2="316.33801"
+     y2="199.5519"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0"
+       style="stop-color:#402A04"
+       id="stop38" /><stop
+       offset="1"
+       style="stop-color:#7F5100"
+       id="stop40" /></linearGradient><path
+     style="fill:url(#SVGID_3_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 108.82665,29.573649 c 0,0 -37.535995,22.859 -34.316995,82.359001 h 62.920995 c 0,0 7.255,-35.965001 7.255,-31.786001 0,4.179 3.509,31.786001 3.509,31.786001 h 48.246 V 87.833649 l 8.772,24.099001 h 62.281 c 0,0 0,-53.553001 -28.63,-82.359001 -28.072,0.877 -130.037,0 -130.037,0 z"
+     id="path42"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_4_"
+     gradientUnits="userSpaceOnUse"
+     x1="195.0862"
+     y1="372.3811"
+     x2="217.894"
+     y2="516.99213"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0"
+       style="stop-color:#006178"
+       id="stop45" /><stop
+       offset="1"
+       style="stop-color:#00495C"
+       id="stop47" /></linearGradient><path
+     style="fill:url(#SVGID_4_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 111.64765,331.69965 -70.387995,13.196 c -6.487,1.216 -12.79,-3.096 -14.006,-9.583 L 1.8536545,199.83065 c -1.21599995,-6.487 3.096,-12.79 9.5830005,-14.006 l 70.388,-13.196 c 6.487,-1.216 12.79,3.096 14.006,9.583 l 25.399995,135.482 c 1.217,6.487 -3.096,12.79 -9.583,14.006 z"
+     id="path49"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_5_"
+     gradientUnits="userSpaceOnUse"
+     x1="197.17931"
+     y1="393.6586"
+     x2="218.5313"
+     y2="505.75641"><stop
+       offset="0"
+       style="stop-color:#6BBBD0"
+       id="stop52" /><stop
+       offset="1"
+       style="stop-color:#ACCCD4"
+       id="stop54" /></linearGradient><polygon
+     style="fill:url(#SVGID_5_);stroke:#000000;stroke-miterlimit:10"
+     points="179.836,514.167 159.336,399.948 236.336,387.667 254.336,498.167 "
+     id="polygon56"
+     transform="translate(-145.43535,-189.01935)" /><linearGradient
+     id="SVGID_6_"
+     gradientUnits="userSpaceOnUse"
+     x1="207.9456"
+     y1="466.41"
+     x2="201.4173"
+     y2="399.4946"><stop
+       offset="0"
+       style="stop-color:#FBCA51"
+       id="stop59" /><stop
+       offset="1"
+       style="stop-color:#FFECBF"
+       id="stop61" /></linearGradient><ellipse
+     style="fill:url(#SVGID_6_);stroke:#000000;stroke-miterlimit:10"
+     cx="205.43201"
+     cy="440.64801"
+     rx="28.959"
+     ry="28.080999"
+     id="ellipse63"
+     sodipodi:cx="205.43201"
+     sodipodi:cy="440.64801"
+     sodipodi:rx="28.959"
+     sodipodi:ry="28.080999"
+     transform="translate(-145.43535,-189.01935)" /><linearGradient
+     id="SVGID_7_"
+     gradientUnits="userSpaceOnUse"
+     x1="190.9269"
+     y1="427.96649"
+     x2="192.52139"
+     y2="436.33749"><stop
+       offset="0"
+       style="stop-color:#6BBBD0"
+       id="stop66" /><stop
+       offset="1"
+       style="stop-color:#ACCCD4"
+       id="stop68" /></linearGradient><line
+     style="fill:url(#SVGID_7_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="44.983662"
+     y1="238.97565"
+     x2="47.595661"
+     y2="247.29865"
+     id="line70" /><linearGradient
+     id="SVGID_8_"
+     gradientUnits="userSpaceOnUse"
+     x1="211.39799"
+     y1="423.5397"
+     x2="213.01559"
+     y2="432.0325"><stop
+       offset="0"
+       style="stop-color:#6BBBD0"
+       id="stop73" /><stop
+       offset="1"
+       style="stop-color:#ACCCD4"
+       id="stop75" /></linearGradient><line
+     style="fill:url(#SVGID_8_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="66.200653"
+     y1="234.40564"
+     x2="67.343658"
+     y2="243.13666"
+     id="line77" /><path
+     style="fill:none;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 47.595655,260.51865 c 0,0 0.653,13.22 15.831,9.14 15.178,-4.08 11.229,-15.994 11.229,-15.994"
+     id="path79"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_9_"
+     gradientUnits="userSpaceOnUse"
+     x1="247.2587"
+     y1="416.16669"
+     x2="247.2587"
+     y2="464.19009"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop82" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop84" /></linearGradient><path
+     style="fill:url(#SVGID_9_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 125.03565,225.81865 c 0,0 -54.844995,-4.046 -54.589995,5.391 0.255,9.437 21.359,3.668 20.849,8.259 -0.51,4.591 -10.173,3.424 -8.763,9.166 1.335,5.436 9.891,0.337 10.485,4.399 0.594,4.062 -7.944,4.738 -7.2,9.587 0.744,4.849 9.437,1.275 9.947,4.081 0.51,2.806 -5.959,4.099 -3.664,7.415 2.296,3.316 25.481995,4.532 36.820995,-0.784 11.531,-5.406 -3.885,-47.514 -3.885,-47.514 z"
+     id="path86"
+     inkscape:connector-curvature="0" /><path
+     style="fill:none;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 108.82665,147.75265 c 0,0 0.464,-21.64 21.464,-21.14 21,0.5 22,21.14 22,21.14"
+     id="path88"
+     inkscape:connector-curvature="0" /><path
+     style="fill:none;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 194.78965,147.75265 c 0,0 5.5,-23.64 25,-23.64 19.5,0 21.571,21 21.571,21"
+     id="path90"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="M 154.28965,177.59465"
+     id="path92"
+     inkscape:connector-curvature="0" /><path
+     style="fill:none;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 154.28965,177.59465 c 0,0 0.715,18.789 16.607,18.421 15.893,-0.368 12.893,-18.421 12.893,-18.421"
+     id="path94"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 228.94765,254.13365 c -2.38,6.629 -9.604,20.319 -44.933,26.513 -37.922,6.649 -56.122,-3.11 -56.122,-3.11 l -10.787,-59.329 c 0,0 37.312,5.696 53.792,4.439 16.48,-1.257 33.346,-5.764 33.346,-5.764 0,0 18.324,-4.366 23.904,8.074 5.579,12.439 3.538,21.552 0.8,29.177 z"
+     id="path96"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_10_"
+     gradientUnits="userSpaceOnUse"
+     x1="316.32571"
+     y1="383.66669"
+     x2="316.32571"
+     y2="199.5519"><stop
+       offset="0"
+       style="stop-color:#402A04"
+       id="stop99" /><stop
+       offset="1"
+       style="stop-color:#7F5100"
+       id="stop101" /></linearGradient><polygon
+     style="fill:url(#SVGID_10_)"
+     points="408.426,250.667 394.198,218.593 358.725,207.167 262.541,210.167 237.725,225.136 224.225,247.667 "
+     id="polygon103"
+     transform="translate(-145.43535,-189.01935)" /><polygon
+     style="fill:#c1272d;stroke:#000000;stroke-miterlimit:10"
+     points="399.167,290.713 428.616,269.855 394.694,225.136 365.225,225.136 354.191,247.667 404.225,254.667 "
+     id="polygon105"
+     transform="translate(-145.43535,-189.01935)" /><path
+     style="fill:#c1272d;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 245.96865,0.64764917 c -6.811,-2.50199997 -41.178,27.49999983 -36.678,36.49999983 4.5,9 39,21.5 39,21.5 l 13.209,-17.558 c -10e-4,0 -4.031,-36.2179998 -15.531,-40.44199983 z"
+     id="path107"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#c1272d;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 272.19765,55.502649 -13.408,15.144 c 0,0 9,36.500001 17.5,35.500001 8.5,-1 32,-21.720001 30,-31.408001 -2,-9.688 -34.092,-19.236 -34.092,-19.236 z"
+     id="path109"
+     inkscape:connector-curvature="0" /><path
+     style="fill:#c1272d;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 243.78965,58.647649 c 0,0 13.418,-23.5 17.709,-22.5 4.291,1 15.093,16.043 15.791,19.356 0.698,3.313 -13,20.644 -18.5,19.144 -5.5,-1.5 -12.5,-10 -15,-16 z"
+     id="path111"
+     inkscape:connector-curvature="0" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="215.78966"
+     y1="36.11665"
+     x2="245.96864"
+     y2="54.967648"
+     id="line113" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="262.99066"
+     y1="73.483643"
+     x2="277.31567"
+     y2="96.647644"
+     id="line115" /><circle
+     style="opacity:0.2;fill:#d86d44"
+     cx="262.54099"
+     cy="357.16699"
+     r="19.249001"
+     id="circle117"
+     sodipodi:cx="262.54099"
+     sodipodi:cy="357.16699"
+     sodipodi:rx="19.249001"
+     sodipodi:ry="19.249001"
+     transform="translate(-145.43535,-189.01935)" /><circle
+     style="opacity:0.2;fill:#d86d44"
+     cx="372.72501"
+     cy="357.16699"
+     r="19.249001"
+     id="circle119"
+     sodipodi:cx="372.72501"
+     sodipodi:cy="357.16699"
+     sodipodi:rx="19.249001"
+     sodipodi:ry="19.249001"
+     transform="translate(-145.43535,-189.01935)" /><path
+     style="fill:#c1272d;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="M 231.14065,228.64765"
+     id="path121"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_11_"
+     gradientUnits="userSpaceOnUse"
+     x1="218.8582"
+     y1="511.4505"
+     x2="220.60651"
+     y2="520.62927"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0"
+       style="stop-color:#006178"
+       id="stop124" /><stop
+       offset="1"
+       style="stop-color:#00495C"
+       id="stop126" /></linearGradient><path
+     style="fill:url(#SVGID_11_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 61.249655,330.25265 c 0.7,3.23 4.623,2.704 4.623,2.704 0,0 14.196,-2.268 16.856,-2.704 2.66,-0.436 5.413,-2.183 4.802,-5.501 -0.611,-3.318 -2.578,-4.334 -4.977,-4.104 -2.143,0.206 -17.811,4.016 -17.811,4.016 0,0 -4.628,0.35 -3.493,5.589 z"
+     id="path128"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_12_"
+     gradientUnits="userSpaceOnUse"
+     x1="196.34351"
+     y1="377.0275"
+     x2="197.17529"
+     y2="381.39441"><stop
+       offset="0"
+       style="stop-color:#006178"
+       id="stop131" /><stop
+       offset="1"
+       style="stop-color:#00495C"
+       id="stop133" /></linearGradient><polygon
+     style="fill:url(#SVGID_12_);stroke:#000000;stroke-miterlimit:10"
+     points="186.437,382.911 186.437,379.506 206.978,374.966 207.302,379.506 "
+     id="polygon135"
+     transform="translate(-145.43535,-189.01935)" /><linearGradient
+     id="SVGID_13_"
+     gradientUnits="userSpaceOnUse"
+     x1="152.85809"
+     y1="432.1676"
+     x2="155.30721"
+     y2="445.02539"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop138" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop140" /></linearGradient><path
+     style="fill:url(#SVGID_13_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 2.5626545,251.52265 c 0.949,7.344 13.9770005,5.843 12.4400005,-2.53 -1.537,-8.373 -13.8540005,-8.404 -12.4400005,2.53 z"
+     id="path142"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_14_"
+     gradientUnits="userSpaceOnUse"
+     x1="150.90849"
+     y1="418.1373"
+     x2="153.3576"
+     y2="430.99509"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop145" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop147" /></linearGradient><path
+     style="fill:url(#SVGID_14_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 0.61265455,237.49265 c 0.94899995,7.344 13.97700045,5.843 12.44000045,-2.53 -1.537,-8.373 -13.85300045,-8.404 -12.44000045,2.53 z"
+     id="path149"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_15_"
+     gradientUnits="userSpaceOnUse"
+     x1="155.52521"
+     y1="446.19681"
+     x2="157.7338"
+     y2="457.79221"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop152" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop154" /></linearGradient><path
+     style="fill:url(#SVGID_15_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 5.7066545,264.72965 c 0.856,6.623 12.6050005,5.269 11.2180005,-2.281 -1.387,-7.55 -12.4920005,-7.58 -11.2180005,2.281 z"
+     id="path156"
+     inkscape:connector-curvature="0" /><linearGradient
+     id="SVGID_16_"
+     gradientUnits="userSpaceOnUse"
+     x1="153.2876"
+     y1="459.8923"
+     x2="155.15581"
+     y2="469.70059"
+     gradientTransform="translate(-145.43535,-189.01935)"><stop
+       offset="0.0019"
+       style="stop-color:#FFCA94"
+       id="stop159" /><stop
+       offset="1"
+       style="stop-color:#E2A380"
+       id="stop161" /></linearGradient><path
+     style="fill:url(#SVGID_16_);stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     d="m 14.738655,269.81365 c 0,0 -14.45200045,0.644 -13.0900005,6.785 1.362,6.141 15.1240005,2.806 15.1240005,2.806 l -2.034,-9.591 z"
+     id="path163"
+     inkscape:connector-curvature="0" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="103.19666"
+     y1="134.52966"
+     x2="111.07164"
+     y2="138.28766"
+     id="line165" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="116.44066"
+     y1="121.91666"
+     x2="119.95366"
+     y2="128.63864"
+     id="line167" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="231.53465"
+     y1="117.39664"
+     x2="227.96065"
+     y2="125.27765"
+     id="line169" /><line
+     style="fill:#ffffff;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="249.61266"
+     y1="127.38266"
+     x2="237.84065"
+     y2="134.52966"
+     id="line171" /><line
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="243.72664"
+     y1="311.64764"
+     x2="251.97566"
+     y2="348.16364"
+     id="line173" /><line
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="184.01564"
+     y1="310.31366"
+     x2="184.01564"
+     y2="349.90466"
+     id="line175" /><line
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="146.45665"
+     y1="311.64764"
+     x2="143.12267"
+     y2="350.95166"
+     id="line177" /><line
+     style="fill:#666666;stroke:#000000;stroke-width:1;stroke-miterlimit:10"
+     x1="218.07564"
+     y1="311.29565"
+     x2="222.05864"
+     y2="348.93066"
+     id="line179" /></svg>

diff --git a/docs/content/programming-guide/image-view.h b/docs/content/programming-guide/image-view.h
index 5822da5..63a1030 100644 (file)
--- a/docs/content/programming-guide/image-view.h
+++ b/docs/content/programming-guide/image-view.h
@@ -24,6 +24,11 @@
  * Dali::Toolkit::ImageView myImageView = ImageView::New( "source-image-url.9.png" );
  * @endcode
  *
+ * A path to a svg image file:
+ * @code
+ * Dali::Toolkit::ImageView myImageView = ImageView::New( "source-image-url.svg" );
+ * @endcode
+ *
  * <h3 class="pg">Loading from a Image handle</h3>
  * Dali::Image is an abstract base class with multiple derived classes.
  *

diff --git a/docs/content/shared-javascript-and-cpp-documentation/control-renderers.md b/docs/content/shared-javascript-and-cpp-documentation/control-renderers.md
index 43f0d16..6966e42 100644 (file)
--- a/docs/content/shared-javascript-and-cpp-documentation/control-renderers.md
+++ b/docs/content/shared-javascript-and-cpp-documentation/control-renderers.md
@@ -14,6 +14,7 @@ DALi provides the following renderers:
  + [Gradient](@ref gradient-renderer)
  + [Image](@ref image-renderer)
  + [N-Patch](@ref n-patch-renderer)
+ + [SVG](@ref svg-renderer)
  + [Border](@ref border-renderer)
  
 Controls can provide properties that allow users to specify the renderer type.
@@ -295,6 +296,58 @@ control.background =
   imageUrl : "path-to-image.9.png"
 };
 ~~~
+
+___________________________________________________________________________________________________
+
+## SVG Renderer {#svg-renderer}
+
+Renders a svg image into the control's quad.
+ 
+<div style="width:300px">
+ 
+![ ](../assets/img/renderers/svg-renderer.svg)
+ 
+</div>
+ 
+<div style="width:300px">
+ 
+![ ](renderers/svg-renderer.svg)
+ 
+</div>
+ 
+### Properties Supported
+
+**RendererType:** "svg"
+
+| Property Name | Type    | Required | Description                      |
+|---------------|:-------:|:--------:|----------------------------------|
+| imageUrl      | STRING  | Yes      | The URL of the SVG image.    |
+
+### Usage
+
+~~~{.cpp}
+// C++
+Dali::Toolkit::Control control = Dali::Toolkit::Control::New();
+
+Dali::Property::Map map;
+
+map[ "rendererType" ] = "svg";
+map[ "imageUrl" ] = "path-to-image.svg";
+
+control.SetSize( 200.f, 200.f );
+control.SetProperty( Dali::Toolkit::Control::Property::BACKGROUND, map );
+~~~
+
+~~~{.js}
+// JavaScript
+var control = new dali.Control( "Control" );
+
+control.background =
+{
+  rendererType : "svg",
+  imageUrl : "path-to-image.svg"
+};
+~~~
 ___________________________________________________________________________________________________
 
 ## Border Renderer {#border-renderer}