ieskudero / three-dxf-viewer

DXF viewer using ThreeJS
https://www.npmjs.com/package/three-dxf-viewer
MIT License
49 stars 15 forks source link

DXFViewer not defined #13

Open raficfaddoul opened 2 weeks ago

raficfaddoul commented 2 weeks ago

Hello, I tried the NPM install and got error from Blazor that DXFViewer is not a constructor. I tried the CDN:

<script src="js/dxfViewer.js"></script>
<script>
    document.addEventListener('DOMContentLoaded', () => {
        console.log('Three.js:', THREE);
        console.log('DXFViewer:', window.DXFViewer);
    });
</script>

I got that DXFViewer is not defined

my javascript code for the CDN was originally: window.dxfViewerInterop = { loadDXF: async function (fileInputId, fontUrl, containerId) { let fileInput = document.getElementById(fileInputId); let file = fileInput.files[0];

    const fontLoader = new THREE.FontLoader();

    fontLoader.load(fontUrl, async function (font) {
        let viewer = new window.ThreeDXF.DXFViewer();  // Use window.ThreeDXF.DXFViewer for the global object
        let dxf = await viewer.getFromFile(file, font);

        let scene = new THREE.Scene();
        scene.add(dxf);

        let container = document.getElementById(containerId);
        let width = container.clientWidth;
        let height = container.clientHeight;

        let renderer = new THREE.WebGLRenderer();
        renderer.setSize(width, height);
        container.appendChild(renderer.domElement);

        let camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
        camera.position.z = 5;

        function animate() {
            requestAnimationFrame(animate);
            renderer.render(scene, camera);
        }
        animate();
    });
}

};

my javascript for the NPM instalation is: window.dxfViewerInterop = { loadDXF: async function (fileInputId, fontUrl, containerId) { let fileInput = document.getElementById(fileInputId); let file = fileInput.files[0];

    const fontLoader = new THREE.FontLoader();

    fontLoader.load(fontUrl, async function (font) {
      //  let viewer = new DXFViewer();
        let dxf = await new DXFViewer().getFromFile(file, font);

        let scene = new THREE.Scene();
        scene.add(dxf);

        let container = document.getElementById(containerId);
        let width = container.clientWidth;
        let height = container.clientHeight;

        let renderer = new THREE.WebGLRenderer();
        renderer.setSize(width, height);
        container.appendChild(renderer.domElement);

        let camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
        camera.position.z = 5;

        function animate() {
            requestAnimationFrame(animate);
            renderer.render(scene, camera);
        }
        animate();
    });
}

};

andrelzsousa commented 2 weeks ago

im getting the same error: image where you able to solve it?

raficfaddoul commented 2 weeks ago

@andrelzsousa no not yet!!

ieskudero commented 2 weeks ago

I guess I could try to load as plain javascript file in an html, but I don't think is going to work that way. I can try parsing it with babel and see if it works. I will try and update it as soon as I can.