skyciv.validator

The SkyCiv API validator is available via the following:

CDN: https://api.skyciv.com/dist/v3/javascript/validate.js

Distribution: https://github.com/skyciv/skyciv-api/blob/master/javascript/validate.js

User Interface: https://platform.skyciv.com/model-viewer (for quick checks, drop the JSON file on the window)

How to use it#

Once the dependency is loaded, window.skyciv will contain the validator namespace.

The method an take a boolean as an optional second paramater. If true, then the results will be logged to the console.

const result = skyciv.validator.model(model);

Find an example here: https://skyciv.com/api/v3/html/validator-demo.html

Sample Code#

Sample code of the HTML file

<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- JQUERY - temp fix until dependency resolution issue in renderer is fixed -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

        <!-- RENDERER -->
        <script src="https://api.skyciv.com/dist/v3/javascript/skyciv-renderer-dist-2.0.0.js"></script>

        <!-- VALIDATOR -->
        <script src="https://api.skyciv.com/dist/v3/javascript/validate.js"></script>

        <script>
            function validate(model) {
                // Get validation results
                const result = skyciv.validator.model(model);

                // Write to text area
                const log = document.querySelector('#log');
                log.textContent = JSON.stringify(result, null, 2);
            }

            function setModel() {
                window.viewer.model.set(s3d_model);
                window.viewer.model.buildStructure();
                window.viewer.render();
            }
        </script>

        <style>
            body {
                margin: 0;
                display: flex;
                flex-direction: column;
            }
            #renderer-container {
                width: 100vw;
                height: 50vh;
                position: relative;
            }
            .btn-console {
                color: white;
                font-weight: bold;
                cursor: pointer;
                background-color: #289dcc;
                border-radius: 4px;
                border: none;
                height: 40px;
                width: 100px;
                position: absolute;
            }
            #btn-set {
                right: 20px;
                bottom: 70px;
            }
            #btn-validate {
                right: 20px;
                bottom: 20px;
            }
            textarea {
                resize: none;
                height: 50vh;
                color: white;
                background-color: black;
                font-family: monospace;
                border: none;
            }
        </style>
    </head>
    <body>
        <div id="renderer-container"></div>
        <button
            id="btn-set"
            class="btn-console"
            onclick="setModel(window.s3d_model)"
        >
            SET MODEL
        </button>
        <button
            id="btn-validate"
            class="btn-console"
            onclick="validate(window.s3d_model)"
        >
            VALIDATE
        </button>
        <textarea id="log">Console</textarea>
    </body>
    <script>
        (function () {
            // Create the renderer and set a model
            window.viewer = new SKYCIV.renderer({
                container_selector: '#renderer-container',
            });

            // Create an s3d_model
            window.s3d_model = {
                settings: {
                    units: 'metric',
                },
                nodes: {
                    1: { x: 0, y: 0, z: 0 },
                    2: { x: 5, y: 0, z: 0 },
                },
                members: {
                    1: {
                        type: 'normal',
                        cable_length: null,
                        node_A: 1,
                        node_B: 2,
                        section_id: 1,
                        rotation_angle: 90,
                        fixity_A: 'FFFFFF',
                        fixity_B: 'FFFFFF',
                    },
                },
                materials: {
                    1: {
                        name: 'Structural Steel',
                        density: 7850,
                        elasticity_modulus: 200000,
                        poissons_ratio: 0.27,
                        yield_strength: 350,
                        ultimate_strength: 470,
                        class: 'steel',
                        id: 1,
                    },
                },
                supports: {
                    1: { node: 1, restraint_code: 'FFFFRF' },
                    2: { node: 2, restraint_code: 'FFFFRF' },
                },
                point_loads: {
                    1: {
                        z_mag: -3,
                        load_group: 'Live_Point_Load',
                        type: 'M',
                        member: 1,
                        position: 50,
                    },
                },
                distributed_loads: {
                    1: {
                        member: 1,
                        z_mag_A: -10,
                        z_mag_B: -10,
                        position_A: 0,
                        position_B: 100,
                        load_group: 'Live_Dist_Load',
                    },
                },
                self_weight: {
                    1: { LG: 'SW1', x: 0, y: 0, z: -1 },
                },
                load_combinations: {
                    1: {
                        name: 'G + Q',
                        SW1: 1,
                        Live_Point_Load: 1,
                        Live_Dist_Load: 1,
                    },
                },
            };
        })();
    </script>
</html>