@xeokit/xeokit-sdk
Version:
3D BIM IFC Viewer SDK for AEC engineering applications. Open Source JavaScript Toolkit based on pure WebGL for top performance, real-world coordinates and full double precision
1,722 lines (1,698 loc) • 34.3 kB
JavaScript
import {utils} from "../../utils.js";
const letters = {
' ': {width: 16, points: []},
'!': {
width: 10, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[]
]
},
'"': {
width: 16, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'#': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'$': {
width: 20, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'%': {
width: 24, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'&': {
width: 26, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'\'': {
width: 10, points: [
[],
[],
[],
[],
[],
[],
[]
]
},
'(': {
width: 14, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
')': {
width: 14, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'*': {
width: 16, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'+': {
width: 26, points: [
[],
[],
[-1, -1],
[],
[]
]
},
',': {
width: 10, points: [
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'-': {
width: 26, points: [
[],
[]
]
},
'.': {
width: 10, points: [
[],
[],
[],
[],
[]
]
},
'/': {
width: 22, points: [
[],
[]
]
},
'0': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'1': {
width: 20, points: [
[],
[],
[],
[]
]
},
'2': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'3': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'4': {
width: 20, points: [
[],
[],
[],
[-1, -1],
[],
[]
]
},
'5': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'6': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'7': {
width: 20, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'8': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'9': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
':': {
width: 10, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[]
]
},
';': {
width: 10, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'<': {
width: 24, points: [
[],
[],
[]
]
},
'=': {
width: 26, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'>': {
width: 24, points: [
[],
[],
[]
]
},
'?': {
width: 18, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[]
]
},
'@': {
width: 27, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[]
]
},
'A': {
width: 18, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'B': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'C': {
width: 21, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'D': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'E': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'F': {
width: 18, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'G': {
width: 21, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'H': {
width: 22, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'I': {
width: 8, points: [
[],
[]
]
},
'J': {
width: 16, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'K': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'L': {
width: 17, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'M': {
width: 24, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'N': {
width: 22, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'O': {
width: 22, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'P': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'Q': {
width: 22, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'R': {
width: 21, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'S': {
width: 20, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'T': {
width: 16, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'U': {
width: 22, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'V': {
width: 18, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'W': {
width: 24, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'X': {
width: 20, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'Y': {
width: 18, points: [
[],
[],
[],
[-1, -1],
[],
[]
]
},
'Z': {
width: 20, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'[': {
width: 14, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'\\': {
width: 14, points: [
[],
[]
]
},
']': {
width: 14, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'^': {
width: 16, points: [
[],
[],
[],
[-1, -1],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'_': {
width: 16, points: [
[],
[]
]
},
'`': {
width: 10, points: [
[],
[],
[],
[],
[],
[],
[]
]
},
'a': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'b': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'c': {
width: 18, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'd': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'e': {
width: 18, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'f': {
width: 12, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'g': {
width: 19, points: [
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'h': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[]
]
},
'i': {
width: 8, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'j': {
width: 10, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[]
]
},
'k': {
width: 17, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'l': {
width: 8, points: [
[],
[]
]
},
'm': {
width: 30, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[]
]
},
'n': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[]
]
},
'o': {
width: 19, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'p': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'q': {
width: 19, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'r': {
width: 13, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[]
]
},
's': {
width: 17, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
't': {
width: 12, points: [
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'u': {
width: 19, points: [
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[]
]
},
'v': {
width: 16, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'w': {
width: 22, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'x': {
width: 17, points: [
[],
[],
[-1, -1],
[],
[]
]
},
'y': {
width: 16, points: [
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[]
]
},
'z': {
width: 17, points: [
[],
[],
[-1, -1],
[],
[],
[-1, -1],
[],
[]
]
},
'{': {
width: 14, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'|': {
width: 8, points: [
[],
[]
]
},
'}': {
width: 14, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
},
'~': {
width: 24, points: [
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[-1, -1],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[],
[]
]
}
};
/**
* @desc Creates wireframe vector text {@link Geometry}.
*
* ## Usage
*
* Creating a {@link Mesh} with vector text {@link ReadableGeometry} :
*
* [[Run this example](/examples/index.html#geometry_builders_buildVectorTextGeometry)]
*
* ````javascript
*
* import {Viewer, Mesh, buildVectorTextGeometry, ReadableGeometry, PhongMaterial} from "xeokit-sdk.es.js";
*
* const viewer = new Viewer({
* canvasId: "myCanvas"
* });
*
* viewer.camera.eye = [0, 0, 100];
* viewer.camera.look = [0, 0, 0];
* viewer.camera.up = [0, 1, 0];
*
* new Mesh(viewer.scene, {
* geometry: new ReadableGeometry(viewer.scene, buildVectorTextGeometry({
* origin: [0,0,0],
* text: "On the other side of the screen, it all looked so easy"
* }),
* material: new PhongMaterial(viewer.scene, {
* diffuseMap: new Texture(viewer.scene, {
* src: "textures/diffuse/uvGrid2.jpg"
* })
* })
* });
* ````
*
* @function buildVectorTextGeometry
* @param {*} [cfg] Configs
* @param {String} [cfg.id] Optional ID, unique among all components in the parent {@link Scene}, generated automatically when omitted.
* @param {Number[]} [cfg.center] 3D point indicating the center position.
* @param {Number[]} [cfg.origin] 3D point indicating the top left corner.
* @param {Number} [cfg.size=1] Size of each character.
* @param {String} [cfg.text=""] The text.
* @returns {Object} Configuration for a {@link Geometry} subtype.
*/
function buildVectorTextGeometry(cfg = {}) {
var origin = cfg.origin || [0, 0, 0];
var xOrigin = origin[0];
var yOrigin = origin[1];
var zOrigin = origin[2];
var size = cfg.size || 1;
var positions = [];
var indices = [];
var text = cfg.text;
if (utils.isNumeric(text)) {
text = "" + text;
}
var lines = (text || "").split("\n");
var countVerts = 0;
var y = 0;
var x;
var str;
var len;
var c;
var mag = 1.0 / 25.0;
var penUp;
var p1;
var p2;
var needLine;
var pointsLen;
var a;
for (var iLine = 0; iLine < lines.length; iLine++) {
x = 0;
str = lines[iLine];
len = str.length;
for (var i = 0; i < len; i++) {
c = letters[str.charAt(i)];
if (c === '\n') {
//alert("newline");
}
if (!c) {
continue;
}
penUp = 1;
p1 = -1;
p2 = -1;
needLine = false;
pointsLen = c.points.length;
for (var j = 0; j < pointsLen; j++) {
a = c.points[j];
if (a[0] === -1 && a[1] === -1) {
penUp = 1;
needLine = false;
continue;
}
positions.push((x + (a[0] * size) * mag) + xOrigin);
positions.push((y + (a[1] * size) * mag) + yOrigin);
positions.push(0 + zOrigin);
if (p1 === -1) {
p1 = countVerts;
} else if (p2 === -1) {
p2 = countVerts;
} else {
p1 = p2;
p2 = countVerts;
}
countVerts++;
if (penUp) {
penUp = false;
} else {
indices.push(p1);
indices.push(p2);
}
needLine = true;
}
x += c.width * mag * size;
}
y -= 35 * mag * size;
}
return utils.apply(cfg, {
primitive: "lines",
positions: positions,
indices: indices
});
}
export {buildVectorTextGeometry}