Neighborly Package Megalodon

    hake-css3d

    0.1.0 • Public • Published

    Hake CSS3D Renderer

    This project inspired by Shrek.Wang's css3d-engine

    What is this

    This is a 3d renderer using css3 to make web page view, it's based on Shrek.Wang's css3d-engine. Using ES6 to write make it can import using ES6; Now it can render simple items like plane and box, more item will join in the future.

    How to use

    You can clone this repository to use webpack build, or using the lib folder js.min to use;

    After you install and import this library.

    Common Function

    • x.position(x,(y,z))
    • x.move(x,(y,z))
    • x.rotation(x,(y,z))
    • x.rotate(x,(y,z))
    • x.scale(x,(y,z))

    Stage

    // You should get a instance of root component first;
    var h3 = new HakeCSS3D();
    // Then use instance to create a stage;
    var stage = new h3.Stage();
    // Define basic information for your stage;
    stage.size(window.innerWidth, window.innerHeight)
          .material({
                color : "#cccccc"
              })
          .update();
    //Then mount it on a exist el;
    document.getElementById('main').appendChild(stage.el);

    Stage represent a single view of 3d scene, it's a container for other Elements. For stage, we not recommend to transform so only set its material and size is fine.

    TODO List

    1. Add more item to use and create.
    2. ......

    Install

    npm i hake-css3d

    DownloadsWeekly Downloads

    1

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • mxz96102