Проблема с отображением / рендерингом SVG в Fabric.js

Я использую FabricJS, и у меня возникла проблема с отображением моего SVG на холсте:

  • результат отображается за пределами поля выбора fabricJS (из-за перевода?)
  • привязки выделения исчезают после преобразования, и их уже невозможно найти обратно.

Вот скриншот: введите описание изображения здесь

Я использую выходной SVG-файл Potrace и думаю, что это причина моей проблемы.
Здесь это код SVG: код SVG в pastebin
Вы можете протестировать его с помощью FabricJS на этой странице: Пример FabricJS Kitchensing.
Просто вставьте код SVG в область «Загрузить SVG», затем измените размер и поверните блок раздела, чтобы отобразить SVG.

Знаете ли вы, какая часть моего кода SVG или часть кода fabricjS вызывает проблему? Если да, могу ли я легко его изменить? Если нет, может ли кто-нибудь исправить или определить местонахождение возможной ошибки?

Спасибо большое за помощь.

EDIT: похоже, FabricJS не нравится эта строка SVG:

<g transform="translate(0,648) scale(0.098780,-0.098780)" fill="#000000" stroke="none">

И особенно атрибуты translate и scale… Как это исправить?

РЕДАКТИРОВАТЬ2: решение будет заключаться в том, что перевод и масштаб соответственно равны (0,0) и (1,1) или, что лучше, применяются к координатам.

Есть ли у кого-нибудь идея сделать это с помощью Potrace или JS-скрипта?


svg fabricjs
person Zorkzyd    schedule 06.05.2012    source источник
comment
Я нашел решение благодаря оптимизатору SVG Питера Коллингриджа: petercollingridge.appspot.com Он применяет все g-преобразования файла SVG!   -  person Zorkzyd    schedule 18.05.2012
comment
если вы нашли решение, вы можете превратить его в вопрос с самостоятельным ответом.   -  person Jason Aller    schedule 10.02.2014
comment
@Zorkzyd, пожалуйста, ответьте, я тоже столкнулся с той же проблемой, с которой столкнулись вы .... Могу я помочь, чтобы решить эту проблему?   -  person kuldipem    schedule 26.08.2015
comment
Привет, кудипем. У меня была эта проблема 3 года назад, и теперь я не могу вспомнить, как я ее исправил ... Извините за это. Но я уверен, что версия fabricJS, которую я использовал, теперь полностью устарела и некоторые ошибки исправлены, как сказал Андреа Богацци. Да прибудет с тобой сила :)   -  person Zorkzyd    schedule 27.08.2015
comment
@Zorkyd Да пребудет с вами источник, звучит здесь более уместно. :)   -  person AndreaBogazzi    schedule 22.02.2016

Ответы (1)


arrow_upward
4
arrow_downward

Спустя 2 года fabricJs теперь может полностью анализировать этот SVG и управлять им. Просто вставьте старый SVG-код pasteBin в демонстрацию kitchenSink, и вы увидите, что он загружается нормально.

В области синтаксического анализа SVG за последнее время произошло много улучшений. Я знаю, что это не ответ, как ожидал бы пользователь stackoverflow, но лучше знать, что думать об этом все еще может быть проблемой.

person AndreaBogazzi    schedule 16.12.2014