-
DescriptionI am referring to the dimensions section in the annotations chapter of the examples part in model-viewer. As the comment shows in the following code cell, the measuring unit is hard-coded by writing modelViewer.addEventListener('load', () => {
const center = modelViewer.getBoundingBoxCenter();
const size = modelViewer.getDimensions();
const x2 = size.x / 2;
const y2 = size.y / 2;
const z2 = size.z / 2;
modelViewer.updateHotspot({
name: 'hotspot-dot+X-Y+Z',
position: `${center.x + x2} ${center.y - y2} ${center.z + z2}`
});
modelViewer.updateHotspot({
name: 'hotspot-dim+X-Y',
position: `${center.x + x2 * 1.2} ${center.y - y2 * 1.1} ${center.z}`
});
modelViewer.querySelector('button[slot="hotspot-dim+X-Y"]').textContent =
`${(size.z * 100).toFixed(0)} cm`; // this part
modelViewer.updateHotspot({
name: 'hotspot-dot+X-Y-Z',
position: `${center.x + x2} ${center.y - y2} ${center.z - z2}`
});
modelViewer.updateHotspot({
name: 'hotspot-dim+X-Z',
position: `${center.x + x2 * 1.2} ${center.y} ${center.z - z2 * 1.2}`
});
modelViewer.querySelector('button[slot="hotspot-dim+X-Z"]').textContent =
`${(size.y * 100).toFixed(0)} cm`; // this part
// ......
}); Live Demohttps://modelviewer.dev/examples/annotations/index.html#dimensions Version
|
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 3 replies
-
The units in glTF are meters (per the spec), so our sizes are always returned in meters. If your glTF is in any other units, it was exported incorrectly and you'll notice the problem if you go into AR mode where physical scale matters. You may be able to guess the incorrect units (usually when things are 100-1000x too big) and fix them using our |
Beta Was this translation helpful? Give feedback.
The units in glTF are meters (per the spec), so our sizes are always returned in meters. If your glTF is in any other units, it was exported incorrectly and you'll notice the problem if you go into AR mode where physical scale matters. You may be able to guess the incorrect units (usually when things are 100-1000x too big) and fix them using our
scale
attribute if necessary.