three-dxf-viewer

DXF Viewer

DXF viewer made using dxf parser and threejs. It generates a threejs object that can be used in any scene. It also has some utility classes such as a merger and a snap helper.

Installation

npm install three-dxf-viewer

Example

To use it just initialize the main class and launch getFromFile or getFrompath methods.

// Suppose we have a font in our application 
let font = 'fonts/helvetiker_regular.typeface.json';

// Suppose we have a file input and a loading div
var file = event.target.files[0];

// Get all the geometry generated by the viewer
let dxf = await new DXFViewer().getFromFile( file, font );

// Add the geometry to the scene
scene.addDXF( dxf );

For a more detailed explanation, there is an example on how to use the viewer. To launch it just run:

npm run dev

The application will be available on http://localhost:8080

Utilities

There are 2 utilities that can be used optionally with the viewer:

Merger

Merger class can merge all entities to optimize drawing big DXF files.

import { Merger } from 'three-dxf-viewer/utils/Merger';

let dxf = await new DXFViewer().getFromPath( dxfFilePath, fontPath );

const mergedObject = new Merger().merge( dxf );

scene.add( mergedObject );

There is an example on how to use it in the main example file in /example/index.js.

Snaps

Snaps classes can store all the vertices in an efficient way to in the scene.

import { Merger } from 'three-dxf-viewer/utils/Merger';

let dxf = await new DXFViewer().getFromPath( dxfFilePath, fontPath );

let snaps = new Snapshelper( dxf, renderer, scene, camera, controls );

There is an example on how to use it in the main example file in /example/index.js.