How i can work with scene

[DarkReduX]

Hi!

Hope you are doing well! I want create a globe with some objects near, but i need help. I don't know how to get scene and other properties of myWorld like radius and etc. to work with them.

[DarkReduX]

Also i want integrate this in my project. Can i set width and height of canvas while initializing a globe?

[vasturiano]

@DarkReduX this module is managing the scene (as well as other three items like cameras and renderers) internally for you, as higher abstraction layer. If you'd like to use it at three scene level I'd recommend using three-globe instead, but I believe you already found that module.

[DarkReduX]

@vasturiano yeah, i found this module but there doesn't work hexed-polygons which i used in my project. I tried to add some object to scene in this module, but window with scene is very large and i want to resize this and add my custom clickable objects to the scene. When i'll click some object i will get some post from my web-site.

This is my code

fetch('../Datasets/ne_110m_admin_0_countries.geojson').then(res => res.json()).then(countries => {
    const world = Globe()

        .hexPolygonsData(countries.features)
        .hexPolygonResolution(3)
        .hexPolygonMargin(0.3)
        .hexPolygonAltitude(0.05)
        .hexPolygonMargin(0.7)
        .hexPolygonColor(() => `#FF0000`)

        (document.getElementById('globe'))
    const boxWidth = 20;
    const boxHeight = 200;
    const boxDepth = 20;
    const geometry = new THREE.BoxGeometry(boxWidth, boxHeight, boxDepth);

    const material = new THREE.MeshBasicMaterial({ color: 0xFF0F5F });  // greenish blue

    var cube = new THREE.Mesh(geometry, material);
    cube.position.set(150, 0, 0);
    const coords = world.toGlobeCoords(61.210817, 35.650072);
    //cube2.position.set(coords.x, coords.y, coords.z);
    console.log(coords);
    //cube.position.set()
    scene.add(cube);
    //scene.add(cube2);
    console.log(scene);
});

Problem Also i found problem. When i used toGlobeCoords(lat,lon) i got null. But I'm not sure if I'm using this correctly

[vasturiano]

• about the hexed-polygons issue, it's fixed here: https://github.com/vasturiano/three-globe/issues/24
• if you want to resize the threejs canvas you can do it via the width() and height() methods
• the toGlobeCoords expects canvas coordinates (x, y) not lat, lng (perhaps you're looking for the getCoords method?). It's returning null likely because those coordinates don't intersect with the globe, as per the docs:

Utility method to translate viewport coordinates to the globe surface coordinates directly under the specified viewport pixel. Returns the globe coordinates in the format { lat, lng }, or null if the globe does not currently intersect with that viewport location.