Импорт SVG по пути в бумаге. js возвращает ноль - PullRequest
0 голосов
/ 16 марта 2020

При попытке импортировать SVG в бумагу. js canvas, элемент записывается как «ноль».

<script src="path/to/paper-full.min.js"></script>
<canvas id="myCanvas" resize></canvas>
<script src="path/to/script.js" type="text/paperscript" canvas="myCanvas"></script>

внутри script.js:

var svg = '../assets/couch.svg';

var couch = project.importSVG(svg);

console.log(couch); // returns null

Я не знаю, почему это не работает, так как этот метод, кажется, используется в решениях для разных ответов ... -> Импорт SVG с градиентным штрихом на бумагу. js проект

Ожидаемый результат console.log будет объектом (см. http://paperjs.org/reference/item/#importsvg -svg , где говорится «Возвращает: Элемент - вновь созданный объект Paper. js, содержащий преобразованный контент SVG»)

1 Ответ

0 голосов
/ 16 марта 2020

верно, похоже, что вы можете импортировать и работать только с файлами SVG из обратного вызова importSVG(). Если вы хотите использовать его как объект вне функции обратного вызова, он должен быть элементом DOM.

скопируйте и вставьте содержимое файла SVG "inline" в ваш файл html, добавьте его с помощью API выборки или выведите его содержимое из бэкэнда (что я и сделал в итоге), затем:

svg = document.getElementById('your-selector')

var yourConvertedSVGItem = project.importSVG(svg, function() {
    svg.style.display = 'none' // hide the source image or do something else here
})

console.log(yourConvertedSVGItem)
...