[html5] Points in a <CANVAS> element

[John S. Urban]

Yes. I want a circle or square sized relative to the current line width at 
the point;
depending on what the current linecap style is. The JavaScript procedures in 
the
example file show a simplified version of the desired behavior -- It just 
does a
circle, and only handles line segments (2-point lines) not all polylines 
that collapse
to a point or simple moves (ie any 1-point line). I plan on adding that 
behavior to
the function to make it a better example.

Treating points as (special-case) lines  is such a basic requirement to a 
set of problems
 I have worked with for such a long time, I have forgotten
how non-intuitive what I'm asking for might seem.

Rendering points makes a lot of plotting applications a lot simpler.
Any time your are plotting arbitrary polylines there is the case where you
have a polyline of zero length (ie. a point).  Lets say you are plotting a 
polyline
showing the movement of each person in a room. You probably still want to 
show a line
for the people that did not move. If they moved so much as a single unit 
they
will show up; and two different people might use different units (if I 
measure to the
nearest inch and you measure to the nearest centimeter different people show 
up)!

Points have no visible rendering in a vector space?
 A line is only visible if it has width. Just because a line has no length 
it should
not necesssarily become invisible. <CANVAS> does not render mathematically 
pure lines
that only have points as a property. Lines have color and width and linecap 
styles,
for example. So can points. Those properties can be used to make a point 
show up,
just like they are used to render a line visibly.

Polylines of zero length show up in just about any application where you are
representing information with curves. The most common example is probably
when you are generating an XY plot. I cannot think of a plotting package 
that
does not show a line of zero length. If you have any plotting package, give 
it
a curve with one point in it. Does it display?

Think of the case where I have a line segment that is becoming shorter and 
shorter.
When it gets to a length short enough that the rendering canvas sees it's 
endpoints
as being equal, it vanishes! But vector drawings should be scalable. Yet, if 
I
rescale the same plot, the points are far enough apart that lines now appear 
where
there was nothing! This is not good behavior for an XY plot, nor for 
packages that
do technical drawings and so on.

The JavaScript codes in my example plots shows an over-simplifed example of 
what I think should happen.
1) When a line is composed only of a move, or a polyline with all points 
having
     the same coordinates is encountered, a point should be generated.
2)  If the current line caps are rounded, a circle with a diameter equal to 
the
     current line width should be generated; else a square with an edge 
equal
     to the current line width should be generated; both should be centered 
on
     the point.

The example file contains some simple xy-plots generated from a package that 
supports
dozens of output devices, including SVG, CGM, PostScript, VML, PPM pixmaps,
xfig(1), GNU plotutils(1), Tektronix 4014 displays, X11 windows, ...
When I made a driver for <CANVAS> I had to add conditional code to the 
driver to
keep short lines and points from disappearing. The reason why is because of 
the behavior of  <CANVAS>.
concerning lines it sees as points. The fact that the vast majority of those 
output formats do not ignore
a line of zero length, but show it as a point helps support the idea that 
this would be a useful
behavior, even if it is optional -- if not for the reasons I mentioned, at 
least for the reason of
keeping coding simpler for developers supporting multiple vector-format 
outputs.

How'd I do?
Did I get my point across (pun intended)? If not, a picture's worth a 
thousand words. I can make a simple
application that shows how rendering points avoids odd conditions.  The 
first one would show
this ...

A very thick line with round
end-caps is drawn along a scale that goes from -1 to 1. One end is fixed at 
X=0. The other end
oscilattes from X=1 to X-1. The line looks
like a rectangle with rounded ends. As it shortens it starts to look like a 
circle. Suddenly, it vanishes!
But then, as it gains a negative length it re-appears as a near-circle which 
stretches back into the
rounded rectangle.






----- Original Message ----- 
From: "Ian Hickson" <ian at hixie.ch>
To: "John S. Urban" <urbanjost at comcast.net>
Cc: <help at lists.whatwg.org>
Sent: Saturday, February 09, 2008 7:11 PM
Subject: Re: [html5] Points in a <CANVAS> element


> On Fri, 1 Feb 2008, John S. Urban wrote:
>>
>> More simply put, points are an essential graphic element. A <CANVAS>
>> element apparently provides no support for them. even a CALCOMP graphics
>> library from thirty years ago provided a way to generate points. If the
>> obvious ways to support them (ie a separate procedure such as Point(x,y)
>> or the rendering of a point when a polyline of zero length is
>> encountered) do not exist then how is a point supposed to be generated?
>> There is beauty in simplicity, but this is a lack of basic
>> functionality. Many people will be forced to kludge their codes to
>> change a null line to a line of 1 unit in length, or to filter for lines
>> of zero length and draw a circle and so on.  So what is the supported
>> method for generating points? A simple example would be most helpful.
>
> Points, in a vector space like <canvas>, have no visible rendering. Do you
> want a circle? A square? Some other shape? All of those can be drawn using
> the current API. I don't really understand what you are asking for.
>
> -- 
> Ian Hickson               U+1047E                )\._.,--....,'``.    fL
> http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
> Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'