Awe.js augmented reality adds text
I am trying to add text to awe.js project using this tutorial, I came up with an attempt, https://www.sitepoint.com/augmented-reality-in-the-browser-with-awe-js/ .
awe.projections.add({
id: 'text',
geometry: {shape: 'text', text: 'Hello World', font: 'times new roman', weight: 'normal', style: 'normal'},
rotation: {y: 45},
position: {x: -5, y: -31, z: -5},
material: {
type: 'phong',
color: 0xFF0000
}
}, {poi_id: 'marker'});
Then I did some more research on this and tried in a different way, but still failed.
awe.pois.add({ id:'fixed_poi', position: { x:70, y:0, z:-250 }, visible: true });
awe.projections.add({
id:'fixed_projection',
geometry: { shape: 'text', text: "My Text", parameters:{font: 'optimer', size: 50}},
position: { x:0, y:0, z:0 },
rotation: { x:0, y:0, z:0 },
material:{ type: 'phong', color: 0xFFFFFF },
}, { poi_id: 'fixed_poi' });
+2
source to share
1 answer
You can create the text model separately (.obj 3D model), for example in 3D composer on Windows 10, and then add that to awe.js like this:
awe.pois.add({ id:'jsartoolkit_marker_64', position: { x:0, y:0, z:0 }, scale: { x: 1, y: 1, z: 1 } });
awe.projections.add({
id:'marker_projection',
geometry: { path: 'models/obj/example.obj' }, // path to your model
position: { x: 0, y: 0, z: 0 },
rotation: { x: 0, y: 180, z: 0 },
material:{ path: 'models/obj/example.mtl' }, // path to material if you're using one
visible: false,
}, { poi_id: 'jsartoolkit_marker_64' }); // common point of interest, in this case the marker
Hope it helps
0
source to share