silly little points list problem

95 views
Skip to first unread message

wimdows

unread,
Oct 15, 2012, 3:29:00 AM10/15/12
to d3...@googlegroups.com
Hello d3-community,

Although I haven't posted any messges in a while, I have been d3'ing like mad lately.

In one of my projects I have encountered a rather weird little problem.

Let me give you a concise description.

I start out adding mouse clicks to an array:
    daLineArray.push({ x: d3.mouse(this)[0], y: d3.mouse(this)[1] });

From this I generate a path, by feeding the resulting array into the d3.svg.line generator. This works well in all browsers.

Then I turn the path into a polygon by first mapping the original array into a shorter one:
        daLineArrayShort = daLineArray.map(function(d) { return d3.values(d) });

and feeding this into the area generator.

This produces a fine polygon in all browsers with the exception of IE9, which complains about the points list not having the proper form.

And to be honest, IE9 is right.

When I check the resulting polygon in its html form it looks like this (the numbers being fictional in this case):
 points="10,10,20,20,30,30,40,40,etcetera"
While I guess it should be looking like this:
 points="10,10 20,20 30,30 40,40 etcetera"

In other words there is a comma between the coordinate pairs where a space is expected.

I had noticed this before, but I only realized it was a problem when I tested my work in IE9.

So, my question is: how do I produce a properly parsed array?
(I did try pushing the points directly onto daLineArrayShort (.push([d3.event.pageX, d3.event.pageY]), but that didn't produce the proper points list either - the comma keeps propping up.)

So your help is badly needed.
In any case, thanks for your time and I hope others find this helpful too.

Regards,

wim

Alexander Skaburskis

unread,
Oct 16, 2012, 8:03:36 PM10/16/12
to d3...@googlegroups.com
how about:

daLineArray.map(function(d) { return d.x + ',' + d.y;}).join(' ');

Note you can use the space on the call to join to replace the default comma!

wimdows

unread,
Oct 17, 2012, 11:10:44 AM10/17/12
to d3-js
Ha! That straightforward, eh.
I still have this image in my mind of array manipulation being
intrinsicaly difficult. And I had never used .join before.
It works terrifically well of course. The points list looks a lot
prettier now.
Thanks a bundle! You helped me tidy up one of the last loose ends of
this project.

Regards,

wim
Reply all
Reply to author
Forward
0 new messages