Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Skripten / Logik
    4. JavaScript
    5. Script im VIS Reiter „Skript“ anlegen

    NEWS

    • Wir empfehlen: Node.js 22.x

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker goes Matter ... Matter Adapter in Stable

    Script im VIS Reiter „Skript“ anlegen

    This topic has been deleted. Only users with topic management privileges can see it.
    • E
      ExMatador last edited by

      Hallo,
      ich möchte in diesem VIS-Reiter ein globales Skript anlegen. Dabei benötige ich THREE.JS.
      Das Einbinden via Import klappt nicht (Fehler: outside module).
      Aber das Einbinden via require klappt auch nicht:
      const THREE = require („THREE“)
      Three habe ich im JavaScript Adapter hinzugefügt.
      Vielleicht hat einer der Entwickler eine Idee.

      Vielen Dank
      Gruß ExMatador

      M 1 Reply Last reply Reply Quote 0
      • M
        MCU @ExMatador last edited by MCU

        @exmatador Geht nur bis V1.6.0

        1e93a2f2-1631-4d5a-81c1-cf0975cf86e7-image.png

        <div id="threejs" style="width:600px; height: 400px"></div>
        

        Skripte-Reiter

        (function loadThree(url, onload){
          var s = document.createElement('script');
          s.src = url;
          s.onload = onload;
          s.onerror = e => console.error('THREE laden fehlgeschlagen:', e);
          document.head.appendChild(s);
        })(
          'https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.min.js', // UMD-Build
          function init(){
            console.log('THREE geladen:', typeof THREE); // sollte "object" loggen
            setTimeout(function(){
            const container = document.getElementById('threejs');
            if (!container) {
              console.error('Container #threejs fehlt!');
              return;
            }
            const w = container.clientWidth, h = container.clientHeight;
        
            const scene = new THREE.Scene();
            const camera = new THREE.PerspectiveCamera(75, w/h, 0.1, 1000);
            const renderer = new THREE.WebGLRenderer({ antialias:true });
            renderer.setSize(w, h);
            container.appendChild(renderer.domElement);
        
            const cube = new THREE.Mesh(
              new THREE.BoxGeometry(),
              new THREE.MeshBasicMaterial({ color: 0x00ff00 })
            );
            scene.add(cube);
            camera.position.z = 5;
        
            (function animate(){
              requestAnimationFrame(animate);
              cube.rotation.x += 0.01;
              cube.rotation.y += 0.01;
              renderer.render(scene, camera);
            })();
            },300)
          }
        );
        
        

        800fc1f6-a07b-4e38-8f2d-33c6ad527942-image.png

        Hinweis: In neueren Three-Versionen liefern CDNs oft nur ESM (three.module.js), was in VIS nicht läuft (Unexpected token export).

        1 Reply Last reply Reply Quote 0
        • First post
          Last post

        Support us

        ioBroker
        Community Adapters
        Donate

        787
        Online

        32.0k
        Users

        80.4k
        Topics

        1.3m
        Posts

        2
        2
        65
        Loading More Posts
        • Oldest to Newest
        • Newest to Oldest
        • Most Votes
        Reply
        • Reply as topic
        Log in to reply
        Community
        Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
        The ioBroker Community 2014-2023
        logo