JavaScript
threejs

three.js(r69)で線の太さがWindowsで効かないってば!

直方体 (5) | three.js

Chrome(Mac)で見たLine Chrome(Windows)で見たLine
threejs_cuboid6_line5_mac.png threejs_cuboid6_line5_win.png
var _geometry = new THREE.BoxGeometry(200, 150, 250, 1, 1, 1);
var geometry = new THREE.Geometry();
geometry.vertices.push(_geometry.vertices[0]);
geometry.vertices.push(_geometry.vertices[1]);
var material = new THREE.LineBasicMaterial({color: 0x000000});
material.linewidth = 2;
var line = new THREE.Line(geometry, material);
scene.add(line);

Windowsでは、LineBasicMaterialのlinewidthが効かないらしい。:umbrella:

直方体 (6) | three.js

Chrome(Mac)で見たCylinder Chrome(Windows)で見たCylinder
threejs_cuboid6_line6_mac.png threejs_cuboid6_line6_win.png
var _geometry = new THREE.BoxGeometry(200, 150, 250, 1, 1, 1);
var vertices = _geometry.vertices;
var material = new THREE.MeshBasicMaterial({side: THREE.BackSide, color: 0x000000});
var line = createLine(vertices[0], vertices[1], material);
scene.add(line);

function createLine(vector0, vector1, material) {
    var line3D, center, vector, height;
    var geometry, line;
    line3D = new THREE.Line3(vector0, vector1);
    center = line3D.center();
    vector = vector0.clone().sub(vector1);
    height = vector.length();
    geometry = new THREE.CylinderGeometry(1, 1, height, 4);
    line = new THREE.Mesh(geometry, material.clone());
    line.position.set(center.x, center.y, center.z);
    var axis, direction, rad, quaternion;
    var y_up = new THREE.Vector3(0, 1, 0);
    axis = vector.normalize();
    direction = new THREE.Vector3();
    direction.crossVectors(y_up, axis).normalize();
    rad = Math.acos(y_up.dot(axis));
    quaternion = new THREE.Quaternion();
    quaternion.setFromAxisAngle(direction, rad);
    line.rotation.setFromQuaternion(quaternion);
    return line;
}