| <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |
| <defs> |
| <linearGradient id="linGrad" x1="0%" y1="0%" x2="100%" y2="100%"> |
| <stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/> |
| <stop offset="100%" style="stop-color:rgb(0,255,0);stop-opacity:1"/> |
| </linearGradient> |
| <radialGradient id="radGrad" cx="50%" cy="50%" r="50%" fx="50%" fy="50%"> |
| <stop offset="0%" style="stop-color:rgb(255,0,0);stop-opacity:1"/> |
| <stop offset="100%" style="stop-color:rgb(0,255,0);stop-opacity:1"/> |
| </radialGradient> |
| <filter id="f1" filterUnits="objectBoundingBox" x="0" y="0" width="1" height="1" primitiveUnits="objectBoundingBox" filterRes="50 60"> |
| <feFlood flood-color="#000" x="5%" y="5%" width="5%" height="5%" result="flood1"/> |
| <feFlood flood-color="#000" x="0%" y="0%" width="5%" height="5%" result="flood2"/> |
| <feComposite in="flood1" in2="flood2" result="pair"/> |
| <feTile in="pair" result="tile"/> |
| <feDisplacementMap in="tile" in2="SourceGraphic" scale="64" xChannelSelector="R" yChannelSelector="G"/> |
| </filter> |
| <filter id="over" filterUnits="objectBoundingBox" primitiveUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%" filterRes="20 200"> |
| <feFlood flood-color="#f00" flood-opacity="0.5" result="res1" x="0%" y="0%" width="75%" height="75%"/> |
| <feFlood flood-color="#00f" flood-opacity="0.5" result="res2" x="25%" y="25%" width="75%" height="75%"/> |
| <feComposite in2="res1" in="res2" operator="over"/> |
| </filter> |
| <filter id="gauss" filterRes="20 42.1"> |
| <feGaussianBlur stdDeviation="10"/> |
| </filter> |
| <filter id="dilate2" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%" filterRes="50 49.999"> |
| <feMorphology operator="dilate" radius="3 1"/> |
| </filter> |
| </defs> |
| |
| <image x="10" y="10" width="100" height="100" xlink:href="../W3C-SVG-1.1/resources/sphere.png" filter="url(#f1)"/> |
| <rect x="130" y="10" width="100" height="100" filter="url(#over)"/> |
| <g filter="url(#gauss)" transform="translate(250, 10)"> |
| <rect x="0" y="0" width="75" height="75" fill="red"/> |
| <rect x="25" y="25" width="75" height="75" fill="blue"/> |
| </g> |
| <g filter="url(#dilate2)" transform="translate(370, 10)"> |
| <rect x="20" y="20" width="50" height="50" style="fill:none;stroke:red;"/> |
| <rect x="35" y="35" width="50" height="50" style="fill:none;stroke:blue"/> |
| </g> |
| </svg> |
| |
