Join the separated lines of 3D/CAD data

Recently I received a mail from the owner of the site ADi Kiteboarding.
He said that he wanted to edit the data exported from 3D application, but the lines are separated and couldn't be connected each other properly even he used my script "Join Reasonably.js".

I'd heard sometimes that some people were also using "Join..." script to join the lines the data of 3D/CAD application.  So I tried to write one to be able to join the lines like this kind of data.  This time I post this one with the agreement of Adi.

Received data was like the above image(left).  It was constructed from the paths like the above image(right).   Some part of the paths were overlapped.  So complicated.

It seemed that connecting from point to point needed a complex algorithm.
So I decided to use the segment ( the line between 2 anchors ) as a unit.
The script breaks all the paths into segments and removes overlapped segments.  Then it connects the segments if its end points are closer than the threshold (0.1mm).  If there's no more near point, it creates another path from the rest of paths.

As a preparation, like the red line of the above image(left), connect the points that too far away, and delete the branched lines.   Then select all the paths you want to connect, and run the script.  The overlapped paths and the isolated points are deleted by the script.

Edit the settings in the script if needed.

As a specification for now, like the above image(right), the script cannot work as you expect in the case that only lines are overlapped and points are not.

download: join_reasonably_2.zip -> http://shspage.com/ex/files.html


Tested with Adobe Illustrator CS5 15.0.2 / Windows XP SP3
This is a beta software. Please use it carefully, at your own risk.

paper.js with pressure + SVG generation

Yesterday, I read about getting a tablet pressure data with javascript using Wacom webtablet plugin.  I was just thinking if there were pressure function in paper.js, so I tried using them in combination.  The link below is a implementation for now.  The touch of drawing requires further tuning.

Also I added SVG data generation function which I'm working on it these days.  Please click the link "generate svg" to show a textarea.  Then copy the text and create a new file.

paper.js with pressure + SVG generation example

(It doesn't work with Internet Explorer on my environment. I'm sorry for that.)

Could you draw...?

Wacom says that webtablet plugin is installed at the same time in installation of recent wacom tablet drivers.  Why I said "says" is because I couldn't get it working at first.  If wacom's demo page also doesn't work , please try a different way to install.

Searching related articles, I realized that getting a tablet pressure data with javascript was a topic from almost 1 year ago.  Since I thought I couldn't keep up with Web technology, I had been keeping away from it.  But if I can implement such a thing easily with it, It would be a waste not to use it.

About SVG data generation function, TextItem, GradientColor and several minor svg attributes aren't supported yet.  According to the mailing list of paper.js, SVG output function is under planning.  Even if it is implemented, the function of mine will be useful for my study about SVG.

Generating the data that properly open with Illustrator or Inkscape was hard work for me.  I'll write about it another time.  For now, in Illustrator, there's a problem that the size of the symbol is not correct.

paper.js -> svg

Finally recently, I'm playing with HTML5 Canvas.

I thought there must be a drawing tool like Illustrator which created with HTML5.

But I couldn't find it for now.  So I decided to try creating it.

A svg data which is being edited with Inkscape in above image was generated from "Arcs.html" which is one of the examples included in paper.js download.

This one is from SpiralRaster.html.

It can be useful even if it only has a function that output a svg data.

I'll post the code when I can properly implement it.