This demo shows how you can use the font file and create text shape.
Clara.io demo resources:
Visit Base Scenevar baseSceneId = 'cc08b884-413b-46fc-a848-7a530bb236d4';
var typeSelect = document.getElementById('type');
var textShapeId = null;
var api = claraplayer('player');
api.sceneIO.fetchAndUse(baseSceneId).then(function() {
textShapeId = api.scene.find({ name: 'TextShape' });
var fonts = api.scene.filter({ type: 'Font' });
console.log('>.', fonts);
for (var i = 0; i < fonts.length; i++) {
var name = api.scene.get({ id: fonts[i], property: 'name' });
typeSelect.options[i] = new Option(name, fonts[i]);
}
typeSelect.onchange = selectHandler;
document
.getElementById('baseScene')
.setAttribute('href', 'https://clara.io/view/' + baseSceneId);
var textPM = api.scene.find({ name: 'TextPolyMesh' });
document.getElementById('TextShape').onclick = function() {
api.scene.set(
{ id: textPM, plug: 'Properties', property: 'visible' },
false
);
};
document.getElementById('TextPolyMesh').onclick = function() {
api.scene.set(
{ id: textPM, plug: 'Properties', property: 'visible' },
true
);
};
});
function selectHandler() {
var value = typeSelect.options[typeSelect.selectedIndex].value;
api.scene.set({ id: textShapeId, plug: 'Shape', property: 'font' }, value);
}