Parsing AutoCAD DWG Files in the Browser without Relying on the Backend

AutoCAD DWG JavaScript Parser

Parsing DWG files in the browser has long been a challenging problem. Most common solutions involve uploading the file to the backend, converting it to DXF, JSON, or SVG, and then returning it to the frontend. This allows the frontend to parse or display the DWG file. The core reason behind this is the lack of a usable DWG file parser on the frontend. Now, with libredwg-web (Gitlab or Github), you can completely eliminate backend dependency and directly parse and display DWG files in the browser.

libredwg-web

libredwg-web is a DWG/DXF parser built on top of the open-source project libredwg, using WebAssembly technology. It can parse DWG/DXF files directly in the browser and Node.js environment without a backend.

• Online Demo
• API Documentation

Usage

This library can be used in two ways.

npm install @mlightcad/libredwg-web

Using the Raw WebAssembly Interface

import { createModule } from "@mlightcad/libredwg-web/wasm/libredwg-web.js";

// Create libredwg module instance
const libredwg = await createModule();

// Write DWG file content to a temporary file and read it
const fileName = 'tmp.dwg';
libredwg.FS.writeFile(
  fileName,
  new Uint8Array(fileContent)
);
const result = libredwg.dwg_read_file(fileName);
if (result.error != 0) {
  console.log('Failed to read DWG file, error code: ', result.error);
}
libredwg.FS.unlink(fileName);

// Get Dwg_Data pointer
const data = result.data;

Using the Web Assembly Wrapper Class

The wrapped module is located in the dist directory of npm package and provides a class named LibreDwg to simplify web assembly calls. It offers the following features:

• Converts DWG data into a strongly-typed DwgDatabase instance for easier usage;
• Provides additional methods not available in the raw API.

import { Dwg_File_Type, LibreDwg } from '@mlightcad/libredwg-web';
const libredwg = await LibreDwg.create();
const dwg = libredwg.dwg_read_data(fileContent, Dwg_File_Type.DWG);
const db = libredwg.convert(dwg);

// Free the memory occupied by dwg after conversion
libredwg.dwg_free(db);

API Overview

The interfaces for accessing DWG/DXF graphic data are divided into two types:

Interfaces Prefixed with Dwg

These interfaces are simpler and more structured, similar to those defined in the @mlightcad/dxf-json project. They cover most common entity types and are recommended for use.

Interfaces Prefixed with Dwg_

These interfaces are JavaScript versions of the libredwg C++ structs. Currently, only a portion of these structures are supported. They are mainly used for converting raw struct data into a DwgDatabase object.

Therefore, it is recommended to use the interfaces prefixed with Dwg.

Example Applications

The project provides three sample applications:

• Dwg Database Json Viewer
• Raw Liredwg-Web WebAssembly API Usage
• Convert DWG to SVG
• Extract Thumbnail Image from Dwg file

App Based on Realdwg-Web

• Google Drive DWG Viewer

[embed]

Q&A

Q: Does libredwg-web support parsing DXF files? Yes, it does. However, you will need to rebuild libredwg-web because, to reduce the WebAssembly size, DXF file parsing and DWG file writing are disabled in the default build. You can follow the instructions to rebuild it. That said, there are already many existing DXF parsers available for use in the browser, which are smaller in size. For example:

• dxf-parser
• dxf-json