replicad

replicad is a library designed for building 3D models using code directly in the browser. It acts as an abstraction over OpenCascade, allowing developers to leverage powerful CAD capabilities within web applications.

Users typically interact with replicad in one of two ways:

1. Model Generation: Using the library's API to programmatically define and build 3D geometry.
2. Application Integration: Integrating the replicad engine into a custom web application to provide CAD-like functionality to end-users.

You can make your models interactive by defining parameters that users can adjust via a UI in the share application.

To do this, define a defaultParams object in your script. This object must be defined alongside your main function. The properties within defaultParams will be passed as the second argument to your main function.

const defaultParams = {
  height: 85.0,
  width: 120.0,
  thickness: 2.0,
  holeDia: 50.0,
  hookHeight: 10.0,
};

function main(
  { Sketcher, FaceFinder, EdgeFinder, sketchCircle },
  { width, height, thickness, holeDia, hookHeight }
) {
  // Use the parameters here...
}

Finders allow for complex selection logic through chaining, negation, and logical OR operations:

• Chaining (AND): By default, chaining methods acts as an AND condition. All conditions must be met.
  • Example: e.ofCurveType("CIRCLE").inPlane("XZ") finds edges that are both circles AND in the XZ plane.
• Either (OR): Use the .either([...]) method to pass an array of filter functions. The feature is selected if it matches any of the provided conditions.
  • Example: f.either([(f) => f.inPlane("YZ", 50), (f) => f.inPlane("YZ", -50)])
• Negation (NOT): Use the .not(filterFunction) method to select features that do not match the specified condition.
  • Example: e.ofCurveType("CIRCLE").not((f) => f.inPlane("XZ"))

The Watering Can tutorial is a step-by-step guide designed to teach you how to use the replicad APIs by building a plunge watering can model. You can follow the implementation steps by interacting with the provided code examples in the documentation.

// The tutorial implementation is contained in watering-can.js
// which is rendered in the documentation iframe.

To start a local development server for the documentation website, use the yarn start command. This will open a browser window and support live reloading for most changes.

$ yarn start

replicad depends on the opencascadejs WebAssembly module. To use replicad, you must initialize opencascadejs and then inject the resulting instance into replicad using the setOC function.

It is highly recommended to perform this initialization and model computation inside a Web Worker. This prevents the heavy WASM computations from blocking the main UI thread, allowing for a reactive interface.

let loaded = false;
const init = async () => {
  if (loaded) return Promise.resolve(true);

  // Initialize opencascadejs
  const OC = await opencascade({
    locateFile: () => opencascadeWasm,
  });

  loaded = true;
  // Inject the instance into replicad
  setOC(OC);

  return true;
};
const started = init();

You can prototype and test your 3D models using the online replicad visualiser.

To use it:

1. Write your model code in a local file.
2. Select that file in the visualiser tool.
3. The tool will build your model. If you are using Chrome, the model recomputes automatically as you save changes to your local file.

Note: Your code must define a main function that receives the replicad library as its first argument.

const main = ({ Sketcher }) => {
  // Your model logic here
  return someShape;
};