We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.

Transparent Background

Home Forums Programming Transparent Background

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #736
    donalffons
    Customer

    Hi, I am wondering how to create a transparent background for the rendering canvas. I followed the instructions from this post, hoping it would work, but it doesn’t. Below is a dump of code the code, that I have. It’s mostly standard, except for:
    – I passed { alpha: true } as a parameter to new v3d.App (…)
    – I set the clear color like this app.renderer.setClearColor( 0x000000, 0 );

    Am I missing something?

    Any help is greatly appreciated!

    'use strict';
    
    window.addEventListener('load', function() {
    
    var URL = '__URL__LogicTest.gltf';
    var LOGIC = '__LOGIC__visual_logic.js';
        
    var url = URL.replace('__URL__', '') || v3d.AppUtils.getPageParams().load;
    if (!url) {
        console.log('No URL specified');
        return;
    }
    
    var app = new v3d.App('container', { alpha: true }, new v3d.SimplePreloader({ container: 'container' }));
    
    app.load(url, function() {
    
        app.enableControls();
        window.v3dApp = app;
        
        app.renderer.setClearColor( 0x000000, 0 );
    
        var logic_url = v3d.AppUtils.getPageParams().logic;
        if (!logic_url || !isXML(logic_url))
            logic_url = LOGIC.replace('__LOGIC__', '') || logic_url;
    
        if (logic_url)
            initPuzzles(logic_url);
     
        runCode();        
    });
    
    function isXML(url) {
        return (url.indexOf('.xml') > -1);
    }
    
    function initPuzzles(logic_url) {
    
        // namespace for communicating with code generated by Puzzles 
        window.v3dApp.ExternalInterface = {};
    
        // running Puzzles editor
        if (isXML(logic_url)) {
    
            var puzzlesDir = '../puzzles/';
    
            v3d.AppUtils.loadScript(puzzlesDir + 'puzzles.min.js', document.body, function() {
                PE.init(puzzlesDir + 'media/');
            });
    
            // load Puzzles editor css
            var link = document.createElement('link');
            link.rel = 'stylesheet';
            link.type = 'text/css';
            link.href = puzzlesDir + 'puzzles.css';
            document.head.appendChild(link);
    
        // loading generated JS code
        } else {
            v3d.AppUtils.loadScript(logic_url, document.body, function() {});
        }
    }
    
    function runCode() {
        // add you code here, e.g. console.log('Hello, World!');
    }
    
    });
    
    • This topic was modified 5 years ago by donalffons.
    #737
    donalffons
    Customer

    …here is my example project.

    #740

    Hmm, that’s strange… Will take a look

    Chief 3D Verger | LinkedIn | Twitter

    #741

    you almost did it ;-)
    replace

    app.scene.background = NULL;

    with

    app.scene.background = null;

    this should do the trick :yes:

    Chief 3D Verger | LinkedIn | Twitter

    #743
    donalffons
    Customer

    Thank you sir :)!
    [In C++ it’s NULL. I’m getting confused with all those semantics ;)]

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.