third_party/WebKit/LayoutTests/svg/custom/svg-curve-with-relative-cordinates.html

   1 <html>
   2 <head>
   3 <script type="text/javascript">
   4 function setup() {
   5  var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
   6  var viewBox = svg.viewBox.baseVal;
   7  viewBox.x = -5;
   8  viewBox.y = 0;
   9  viewBox.width = 40;
  10  viewBox.height = 35;
  11  svg.width.baseVal.valueAsString = "400px";
  12  svg.height.baseVal.valueAsString = "400px";
  13  var path = document.createElementNS("http://www.w3.org/2000/svg", "path");
  14  path.style.setProperty("stroke", "black", "");
  15  path.style.setProperty("fill", "red", "");
  16  var segs = path.pathSegList;
  17  segs.appendItem(path.createSVGPathSegMovetoAbs(14.86487, 27.54341));
  18  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(2.16163, 16.27388, 10.93614, 23.44857, 5.53039, 20.93069));
  19  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(0.40252, 6.50142, 0.19540, 13.47135, -0.27051, 9.80295));
  20  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(8.61522, 0.38648, 1.50231, 3.03806, 4.88027, 0.20151));
  21  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(15.54304, 4.44105, 11.49036, 0.13255, 14.15935, 2.02987));
  22  segs.appendItem(path.createSVGPathSegCurvetoCubicRel(0.71868, 1.07327, 0.37594, 0.23175, 0.35941, 2.21266));
  23  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(23.25811, 0.39544, 17.31181, 2.60470, 20.15524, 0.48976));
  24  segs.appendItem(path.createSVGPathSegCurvetoCubicAbs(31.97687, 7.41380, 27.37183, 0.07861, 31.56253, 3.22656));
  25  segs.appendItem(path.createSVGPathSegCurvetoCubicRel(-2.04024, 9.10060, 0.46508, 3.14678, -0.04068, 6.54082));
  26  segs.appendItem(path.createSVGPathSegCurvetoCubicRel(-10.90462, 9.53931, -2.92245, 3.93336, -7.42165, 6.18284));
  27  segs.appendItem(path.createSVGPathSegCurvetoCubicRel(-3.12799, 2.94243, -1.08820, 0.79363, -2.28426, 2.46524));
  28  segs.appendItem(path.createSVGPathSegCurvetoCubicRel(-1.03915, -1.45272, -0.28088, -0.52741, -0.64130, -1.00829));
  29  segs.appendItem(path.createSVGPathSegClosePath());
  30  svg.appendChild(path);
  31  var drawing = document.getElementById("drawing");
  32  drawing.appendChild(svg);
  33 }
  34 </script>
  35 </head>
  36 <body onload="setup()">
  37 <p>Here is an html paragraph. And below is a svg drawing</p>
  38 <div id="drawing"/>
  39 </body>
  40 </html>
  41