Published
Edited
Mar 6, 2019
Importers
Insert cell
Insert cell
measureText = function(textObj) {
const ctx = DOM.context2d(1, 1),
dpi = 96, // * window.devicePixelRatio, // TODO Handle HDPI displays
fontFamily = textObj.fontFamily ? textObj.fontFamily : "Arial, sans-serif",
fontSize = textObj.fontSize ? `${textObj.fontSize}in` : `0.1in`,
value = textObj.value ? textObj.value : "ABC",
fontString = `${fontSize} ${fontFamily}`;

//console.log(fontString);
ctx.font = fontString;

let text = ctx.measureText(value);

return text.width / dpi;
}
Insert cell
measureText({ value: "A", fontFamily: "Arial", fontSize: 2.0 })
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more