In our accelerator event, some customers talked about one scenario that the DWG drawing will need to have the signing of relevant engineers, assessors, examiners and executives etc. Typically, the signs are filled in within the title block. As we know, the text fields of a title block is the entity Attribute. The user can fill in with the final text content. In reality, this can be a signing on the hard copy of the drawing.
It sounds like an idea if we could make this process digitally, especially on the client that has no AutoCAD installed. So based on this idea, I made a small porotype. It is an Node.js application that allows the user to fill in the title block fields with text or signing in an AutoCAD drawing in the browser. The signing will be merged to the drawing. The application also provides the user to download the updated drawing. Behind the scene, the client is a web browser on View & Data, while the signing process is by an AutoCAD.NET package which will run by AutoCAD I/O.
This is the Demo site: http://adnxddwgsig.herokuapp.com/viewer.html .
The source code and README is available at Github. The video illustrates the steps.
In this blog, I’d like to highlight a couple of technical details:
1. How to make a signing on the browser
I got a Javascript library of signature which can draw smooth and beautiful signatures. It's HTML5 canvas based and uses variable width Bézier curve interpolation. It works in all modern desktop and mobile browsers and doesn't depend on any external libraries. I placed a canvas with View & Data. When user signs, the code gets the streaming of the signature and sends it to the server.
2. How to make the signing
If it is a pure text, it is very straightforward. Update AttributeReference.TextString. While as to a signing, I tried a couple of ways:
Raster image: this requires the corresponding separate image files are available within the same folder of the DWG. That means it will take more steps such as SetReference when translating the DWG by View & Data. In addition, it is hard to adjust its size to fit to the width & height of the range of title block.
OLE file: this also requires the corresponding separate image files are available. Although there is option that can merge the image file with the drawing, it is still hard to make a nice signing on the DWG drawing.
Finally, I got an inspiration to analyze the pixel color of the image, make an AutoCAD Solid on the location of each colored (signing) pixel. By this way, it is flexible to adjust the Solids to fit the attribute range and does not need separate images.
3. How to locate the field of the title blocks
Obviously, View & Data does not translate the information of title block and attributes. So we will need to do something. The package(AutoCAD.NET) has two commands:
GenerateTBJson: it analyzes the title block, gets out each attributes properties, calculates its reasonable range (width & height), and makes a json array. This array will be sent to the client. When the user clicks the title block on the browser, the code will detect which attribute range the mouse hits. Then if the user inputs the new text string, or makes a signing, the corresponding json content will be updated and sent to the server.
updateTBFromJson: it will read the updated json array, analyze each json. If it is a signing (image), it produces the Solids and put them within the range of the attribute, and put them on one layer.
4. Best practice
To work with AutoCAD I/O, it is always a best practice to test the package with a client program firstly, say in this case, I used an .NET program, before you apply the workflow to your web application.
If the package needs the dynamic parameters, you can specify the URL that provides the data, or use variadic which can call HTTP request within AutoCAD package.
Last, please note, AutoCAD I/O V1 has been removed. If you have any code, please migrate to V2.
Subscribe
Comments