GithubHelp home page GithubHelp logo

openafpm-cad-visualization's Introduction

OpenAFPM CAD Visualization

Module for visualizing openafpm-cad-core 3D wind turbine model created in FreeCAD via a web browser.

  1. Create the 3D model in FreeCAD.
  2. Export the 3D model to Wavefront OBJ (.obj) format.
  3. Load the 3D model (.obj file) with three.js.

Flow

Prerequisites

Install Node.js.

How to Run

  1. Install dependencies.

    npm install
    
  2. (OPTIONAL) Build bundle if you want to make changes to files in src/.

    npm run watch
    
  3. Start server.

    npm run serve
    
  4. Navigate to http://127.0.0.1:8080/ in your web browser of choice. Currently tested in Chrome.

Additionally, on UNIX-like operating systems, you can run npm start; which runs npm run watch and npm run serve in parallel.

Wind Turbine Object Names

A list of object names that MUST be present in the .obj file for the Wind Turbine.

In the Wavefront .obj format, object names start with o and are delimited with a space on their own line (e.g. o Coils).

  1. Stator_Coils
  2. Stator_ResinCast
  3. Rotor_Disk_Front
  4. Rotor_ResinCast_Front
  5. Rotor_Magnets_Front
  6. Rotor_Disk_Back
  7. Rotor_ResinCast_Back
  8. Rotor_Magnets_Back
  9. Hub_Flange
  10. Hub_Flange_Cover_Front
  11. Hub_Flange_Cover_Back
  12. Hub_StubAxleShaft
  13. Studs_Hub
  14. Frame
  15. YawBearing
  16. Tail_Hinge_Inner
  17. Tail_Hinge_Outer
  18. Tail_Boom_Pipe
  19. Tail_Boom_Support
  20. Tail_Stop_HighEnd
  21. Vane_Bracket_Top
  22. Vane_Bracket_Bottom
  23. Tail_Vane
  24. Studs_Frame
  25. Bolts (used by Tools)
  26. Nuts (used by Tools)
  27. *Screws (used by Tools)
  28. LocatingWashers (used by Stator Mold)
  29. LocatingBolts (used by Stator Mold)
  30. Washers (used by Rotor Mold)
  31. Rotor_MagnetJig (used by Magnet Jig)
  32. Rotor_MagnetJig_Disk (used by Magnet Jig)
  33. Rotor_Magnets (used by Magnet Jig)
  34. Rods (used by Coil Winder)

* Denotes and "ends with" match is performed.

API

OpenAfpmCadVisualization

Constructor

Construct a new OpenAFPM CAD visualization instance.

Behind the scenes constructs a WebGLRenderer, and a single instance is intended to be used throughout the lifetime of various visualizations (i.e. Wind Turbine and tools).

It also appends style elements to the head of the document.

Arguments
Name Type Required Description
options Object true See below rows documenting properties.
options.rootDomElement Element true DOM element to mount visualization elements to.
options.width number true Width of visualization.
options.height number true Height of visualization.

visualize(loadObj, assembly, furlTransformPromise)

Arguments
Name Type Required Description
loadObj function(): Promise.<string> true Zero-argument function returning a Promise that resolves to Wavefront OBJ file contents.
assembly [string] true Assembly of visualization. Must be one of "WindTurbine", "StatorMold", "RotorMold", "MagnetJig", or "CoilWinder".
furlTransformPromise Promise.<FurlTransform> true when type === "WindTurbine", false otherwise. When assembly === "WindTurbine", the Promise must resolve to a FurlTransform object. See below table for details.
FurlTransform
Name Type Required Description
furlTransform Object true An object representing how to furl the tail.
maximum_angle number true Maximum angle (in degrees) to furl the tail before high end stop hits the yaw bearing pipe.
transforms Array.<Transform> true Three element array of Transform objects needed to furl the tail. See below table for details.
Transform
Name Type Required Description
transform Object true An object representing a 3D transformation in Axis–angle representation.
transform.name string false Name of transformation for descriptive purposes. (optional).
transform.position Array.<number> true Three element array for x, y, and z coordinates.
transform.axis Array.<number> true Axis of rotation, three element array for x, y, and z axes.
transform.angle number true Angle of rotation (in radians).

resize(width, height)

Resize visualization to specified width and height.

Arguments
Name Type Required Description
width number true Width to resize visualization to.
height number true Height to resize visualization to.

Returns: undefined

handleMouseMove(event)

Display tooltip if cursor hovers over part and update internal mouse coordinates.

This method is debounced with a 10 millisecond wait time.

Arguments
Name Type Required Description
event MouseEvent true mousemove event.

Returns: undefined

cleanUp()

Performs various clean-up such as disposing geometries and materials.

Returns: undefined

Themeing

Basic themeing support is available via the data-theme attribute on the rootDomElement.

Supported values include "light" (the default) and "dark".

Related Repositories

openafpm-cad-visualization's People

Contributors

gbroques avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.