|
|
@ -37,7 +37,7 @@ function animate() { |
|
|
|
|
|
|
|
|
|
|
|
animate() |
|
|
|
animate() |
|
|
|
|
|
|
|
|
|
|
|
function createTextMesh(text) { |
|
|
|
function createTextMesh(text, colorName) { |
|
|
|
let canvas = document.createElement('canvas') |
|
|
|
let canvas = document.createElement('canvas') |
|
|
|
let context = canvas.getContext('2d') |
|
|
|
let context = canvas.getContext('2d') |
|
|
|
let size = context.measureText(text) |
|
|
|
let size = context.measureText(text) |
|
|
@ -45,7 +45,7 @@ function createTextMesh(text) { |
|
|
|
canvas.height = 100 |
|
|
|
canvas.height = 100 |
|
|
|
context.textAlign = "center" |
|
|
|
context.textAlign = "center" |
|
|
|
context.textBaseline = "middle" |
|
|
|
context.textBaseline = "middle" |
|
|
|
context.fillStyle = "blue" |
|
|
|
context.fillStyle = colorName |
|
|
|
context.font = '24pt sans-serif' |
|
|
|
context.font = '24pt sans-serif' |
|
|
|
context.fillText(text, 50, 50) |
|
|
|
context.fillText(text, 50, 50) |
|
|
|
|
|
|
|
|
|
|
@ -56,7 +56,7 @@ function createTextMesh(text) { |
|
|
|
}) |
|
|
|
}) |
|
|
|
material.transparent = true |
|
|
|
material.transparent = true |
|
|
|
|
|
|
|
|
|
|
|
let plane = new THREE.PlaneGeometry(5, 5) |
|
|
|
let plane = new THREE.PlaneGeometry(3, 3) |
|
|
|
let mesh = new THREE.Mesh(plane, material) |
|
|
|
let mesh = new THREE.Mesh(plane, material) |
|
|
|
|
|
|
|
|
|
|
|
return mesh |
|
|
|
return mesh |
|
|
@ -92,8 +92,6 @@ function updateWithHAData(data) { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
console.log(areasToEntities) |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
async function loadHAData() { |
|
|
|
async function loadHAData() { |
|
|
@ -137,14 +135,19 @@ function configureScene(data) { |
|
|
|
roomBoxMaterial.transparent = true |
|
|
|
roomBoxMaterial.transparent = true |
|
|
|
roomBoxMaterial.opacity = 0.3 |
|
|
|
roomBoxMaterial.opacity = 0.3 |
|
|
|
let roomMesh = new THREE.Mesh(roomGeo, roomBoxMaterial) |
|
|
|
let roomMesh = new THREE.Mesh(roomGeo, roomBoxMaterial) |
|
|
|
|
|
|
|
roomMesh.userData = "box" |
|
|
|
roomContainer.add(roomMesh) |
|
|
|
roomContainer.add(roomMesh) |
|
|
|
|
|
|
|
|
|
|
|
let roomEdgesGeo = new THREE.EdgesGeometry(roomGeo) |
|
|
|
let roomEdgesGeo = new THREE.EdgesGeometry(roomGeo) |
|
|
|
let roomLinesMaterial = new THREE.LineBasicMaterial({ color: roomColor }) |
|
|
|
let roomLinesMaterial = new THREE.LineBasicMaterial({ color: roomColor }) |
|
|
|
let roomLines = new THREE.LineSegments(roomEdgesGeo, roomLinesMaterial) |
|
|
|
let roomLines = new THREE.LineSegments(roomEdgesGeo, roomLinesMaterial) |
|
|
|
|
|
|
|
roomLines.userData = "lines" |
|
|
|
roomContainer.add(roomLines) |
|
|
|
roomContainer.add(roomLines) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let roomLabel = createTextMesh("test", "red") |
|
|
|
|
|
|
|
roomLabel.userData = "label" |
|
|
|
|
|
|
|
roomContainer.add(roomLabel) |
|
|
|
|
|
|
|
|
|
|
|
setPosition(roomContainer, room.x, room.y, room.z || 0, room.w, room.h, room.d) |
|
|
|
setPosition(roomContainer, room.x, room.y, room.z || 0, room.w, room.h, room.d) |
|
|
|
home.add(roomContainer) |
|
|
|
home.add(roomContainer) |
|
|
|
|
|
|
|
|
|
|
@ -158,8 +161,6 @@ function configureScene(data) { |
|
|
|
let yExtent = maxY - minY |
|
|
|
let yExtent = maxY - minY |
|
|
|
home.position.x = -1 * (xExtent / 2) |
|
|
|
home.position.x = -1 * (xExtent / 2) |
|
|
|
home.position.y = +1 * (yExtent / 2) |
|
|
|
home.position.y = +1 * (yExtent / 2) |
|
|
|
|
|
|
|
|
|
|
|
// homeContainer.add(createTextMesh("test"))
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
async function loadHomeData() { |
|
|
|
async function loadHomeData() { |
|
|
|