Mega Code Archive

 
Categories / XML / SVG
 

Using the SVG marker Element

<?xml version="1.0" encoding="iso-8859-1"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"   "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"> <svg width="100%" height="100%"      xmlns="http://www.w3.org/2000/svg">   <defs>     <linearGradient id="gradientDefinition"       x1="0" y1="0" x2="20" y2="0"       gradientUnits="userSpaceOnUse">       <stop offset="0%"   stop-color="#FFFF00"/>       <stop offset="100%" stop-color="#000000"/>     </linearGradient>     <marker id="triangularMarker1"       refX="0" refY="4"       markerUnits="strokeWidth"       markerWidth="20" markerHeight="8"       fill="url(#gradientDefinition)"       orient="auto">       <path d="M0,0 l20,4 l-20,4 z"/>     </marker>   </defs>   <path d="M 100,200 L 300,200"         stroke="red" stroke-width="4"         marker-end="url(#triangularMarker1)"/> </svg>