BoxLineGeometry Example in Docs Returns an Error

Site Feedback
1 
const geometry = new THREE.BoxLineGeometry();
const material = new THREE.LineBasicMaterial( { color: 0x00ff00 } );
const lines = new THREE.LineSegments( geometry, material );
scene.add( lines );

Should be this:

const geometry = new BoxLineGeometry();
const material = new THREE.LineBasicMaterial( { color: 0x00ff00 } );
const lines = new THREE.LineSegments( geometry, material );
scene.add( lines );

As THREE.BoxLineGeometry is not a constructor.

I know it’s a minor typo, just thought I’d point it out. Don’t know if Site Feedback is the right place for this kind of thing. Sorry if not, but I don’t have GitHub.

1 Like
2

Where did you get BoxLineGeometry from? Ie. how is it being imported?

3

It is from an add-on. Here is the docs:

https://threejs.org/docs/#BoxLineGeometry

1 Like
4

Whoops! Forgot to post the link to the docs. Thanks @PavelBoytchev

5

nice catch, I’m not sure how active @Mugen87 is on the forum these days, it may be best to file a report at Issues · mrdoob/three.js · GitHub

6

Is there something automagical that appends imported addons to the three name space? I only ever imported stuff with build tools. The reason im asking is maybe other examples have this too, or if there is indeed somethingn that will put an addon to THREE it might not be doing it here.

import { BoxLineGeometry } from 'three/addons/geometries/BoxLineGeometry.js';
7

not that I’m aware of, three is imported as import * as THREE from "three"… eg the THREE namespace is assigned at import (it’s not an assignable class per se)… (this could be any arbitrary namespace for example import * as EggsBenidorm from "three"… const v3 = new EggsBenidorm.Vector3() ), I’m not sure how an external module would be assigned to the three module in this case or if that’s even possible :thinking:

8

I was thinking it’s more about those import maps and whatnot, of which I know very little.

9

Yeah ParametricGeometry too

10

Yeah, looks like three double downed on these jsdoc comment thingies.
Essentially there is a comment in the source file that just gets copied into the docs file. It also seems to have quietly switched to typescript over time via the same comments. Kinda clever because you kinda get to modify the docs in the same file, but theres nothing validating it hence this error.

11

as far as I’m aware the lexicon would follow the same rules in an import map as with build tools, addons (where BoxLineGeometry is exported from) would still be an external resource to the core three module…

{
  "imports": {
    "three": "https://unpkg.com/three/build/three.module.js",
    "three/addons/": "https://unpkg.com/three/examples/jsm/"
  }
}

there may be a way to assign THREE as a namespace to addons but I’m unaware of any way to do that.

in your report (BoxLineGeometry, ParametricGeometry and RoundedBoxGeometry have wrong constructor signatures in the docs · Issue #34106 · mrdoob/three.js · GitHub) would be useful to outline that there’s a redundant reference to the THREE namespace in the docs

12

yeah jsdoc is neat and really useful! I’m not sure it’s as thorough as ts types but I think js has adopted types by those same comments, putting the following comments in a class will allow you to see a constructors parameter types when hovering an instantiated class in your IDE…

class TorusGeometry extends BufferGeometry {

        /**
         * Constructs a new torus geometry.
         *
         * @param {number} [radius=1] - Radius of the torus, from the center of the torus to the center of the tube.
         * @param {number} [tube=0.4] - Radius of the tube. Must be smaller than `radius`.
         * @param {number} [radialSegments=12] - The number of radial segments.
         * @param {number} [tubularSegments=48] - The number of tubular segments.
         * @param {number} [arc=Math.PI*2] - Central angle in radians.
         * @param {number} [thetaStart=0] - Start of the tubular sweep in radians.
         * @param {number} [thetaLength=Math.PI*2] - Length of the tubular sweep in radians.
         */
        constructor( radius = 1, tube = 0.4, radialSegments = 12, tubularSegments = 48, arc = Math.PI * 2, thetaStart = 0, thetaLength = Math.PI * 2 ) {
13

I prefer typescript. But if I understood correctly JSDoc is just a more verbose way to write typescript. You don’t need a build tool but I don’t know why anyone would not want one.

14

It’s been fixed.

2 Likes
15

I don’t mind ts if a project requires it, I prefer js and using it in a compiler environment the js comment syntax reduces having to separately manage writing types, comments and documentation, the docs are built on compile automatically from the comments, the comments can be written as self explanatory comment blocks and thirdly serve as “type” definitions for the classes and functions they are attributed to…

1 Like