Opentype.js и maker.js отображают неправильный путь для текста ⇐ Php

[Anonymous]

Мне нужно иметь возможность конвертировать текст и определенный шрифт в данные пути svg, и я случайно наткнулся на opentype.js и maker.js, независимые друг от друга, поскольку maker.js использует opentype.js. Когда я использую opentype.js сам по себе, он неправильно отображает путь к шрифту... когда я заполняю его, он не отображается должным образом. Когда я использую maker.js, это значительно лучше, но все равно неправильно.
ЧТОБЫ БЫТЬ АБСОЛЮТНО ЯСНО ОПИСАНИЕ ПРОБЛЕМЫ:
Мне нужен способ перевода текста с заданным шрифтом в данные пути SVG, которые затем «сглаживаются» (любые черные перекрытия объединяются, а все элементы, находящиеся внутри объединенного текста, который является белым, сохраняются - например, посмотрите на букву «P»). .. Если Объединяю, он удаляет белую часть внутри буквы "П", которая мне нужна). На данный момент меня не волнуют средства... они просто должны быть совместимы с php (он не может использовать Imagemagick/Inkscape или другое стороннее программное обеспечение, запускаемое с терминала. У меня нет доступа для запуска Shell_exec() или exec()) или JavaScript.
---maker.js---
Это одна попытка... работает этот фрагмент вызывает сбой моего браузера, но в его собственном файле все работает отлично.
Вот результат и код:
[img]https://i. sstatic.net/O3kzW.png[/img]

Код: Выделить всё

window.onload = function()
{

var makerjs = require('makerjs');

var url = 'https://staging-gumcreekboards.temp312.kinsta.cloud/wp-content/themes/Divi-child/CanvEsIntegration/static/CreekWareFonts/woff/work_in_progress-updated.woff';
var text = 'Shane';
var size = 72;
var union = true;
var bezierAccuracy = 0;
var svg = document.createElement('div');
opentype.load(url, (err, font) => {
textModel = new makerjs.models.Text(font, text, size, union, true, bezierAccuracy);
//console.log(textModel.models, makerjs.model.simplify);
svg.innerHTML = makerjs.exporter.toSVG((textModel));
document.getElementById('svgcontainer').innerHTML = svg.innerHTML;
});

};

Код: Выделить всё

path {stroke: red; stroke-width: 1px; stroke-linejoin: round; fill: black !important;}

---opentype.js---
Этот код не запускается на SO, но отлично работает на консоли веб-сайта, на котором я программирую.
Вот результат и код:
Вот результат и код: p>

Код: Выделить всё

svgD = "";

font = await opentype.load("https://staging-gumcreekboards.temp312.kinsta.cloud/wp-content/themes/Divi-child/CanvEsIntegration/static/CreekWareFonts/woff/ARRUS BT BOLD.ttf");

pathsArray = font.getPaths("Shane", 0, 0, 72);
svgDArray = [];
svgPaths = "";

for (var i = 0; i < pathsArray.length; i++)
{
svgDArray = [];
svgD = "";
path = pathsArray[i].commands;
for (var j = 0; j < path.length; j++)
{
for (each in path[j])
{
svgDArray.push(path[j][each])
}
svgD += svgDArray.join(" ") + " ";
}

if (svgD.length > 0)
{
svgPaths += "";
}

};

document.getElementById("svgcontainer").innerHTML = "path {stroke: red; stroke-width: 1px; stroke-linejoin: 'round'; fill: black;}" + svgPaths + "";

Код: Выделить всё

Подробнее здесь: https://stackoverflow.com/questions/650 ... h-for-text