W3C home > Mailing lists > Public > www-svg@w3.org > December 2012

Re: Draw polygonal line with a looping

From: Dirk Schulze <dschulze@adobe.com>
Date: Mon, 24 Dec 2012 15:18:47 -0800
To: όάρΥλΎ <yillkid@gmail.com>
CC: www-svg <www-svg@w3.org>
Message-ID: <A4214C02-C3E6-4372-AAAD-294426A2CB02@adobe.com>

On Dec 21, 2012, at 11:59 PM, όάρΥλΎ <yillkid@gmail.com> wrote:

> Hi all
> 
> I drew polygon line with canvas before, code example as below:
> 
> ------------------------------------------------
> var ctx = canvas.getContext("2d");
> ctx.beginPath();
> 
> ctx.moveTo(0,126);
> 
> { data in loop }
>     ctx.lineTo(x , {{data}});
> { endfor }
> 
> ctx.stroke();
> ctx.closePath(); 
> ------------------------------------------------
> 
> Set "moveto" one time and using "lineto" with a looping.
> 
> Now I change to the SVG, and want to do that again.
> 
> But after reading document it seems can not.
> 
> For example: 
> 
> if I use "path" : <path d="M150 0 L75 200 L225 200 Z" />
> I need decide "moveto" and "lineto" point at the same time.
> 
> if I use "line": 
> <line x1="0" y1="0" x2="300" y2="300"
> style="stroke:rgb(99,99,99);stroke-width:2"/> 
> 
> same does "line".
> 
> So how should I can draw  a polygonal line with a looping ?

If you want to use looping, then you might want to use SVGDOM and create the path with JavaScript?  I think there are some information missing to understand your problem.

https://developer.mozilla.org/en-US/docs/DOM/SVGPathElement


Greetings,
Dirk

> 

Received on Monday, 24 December 2012 23:19:08 GMT

This archive was generated by hypermail 2.3.1 : Friday, 8 March 2013 15:54:53 GMT