Встроенный SVG в Firefox
Я немного озадачен этим. Я визуализирую SVG-визуализации, используя Protovis, библиотеку JS, и она отлично работает как в Chrome, так и в Firefox. Я сохраняю визуализированный SVG на своем сервере и пытаюсь перерисовать его в виде "галереи", используя функцию PHP, но в Firefox это не удается. Я вижу только текст в SVG, но не SVG.
Я сохраняю полный SVG-контент, вот так:
<svg height="220" width="880" stroke-width="1.5" stroke="none" fill="none" font-family="sans-serif" font-size="10px"><g transform="translate(30, 10)"><line stroke-width="1"
Я пытался использовать <object> но все, что делает, это заставляет Firefox загрузить плагин, который он не может найти.
Он работает в бета-версии FF4, но я не понимаю, почему он не будет работать даже в Firefox 3.6. Это то, от чего я должен отказаться? Вы можете увидеть демо здесь:
http://www.rioleo.org/protoviewer (нажмите на "галерею")
Еще раз спасибо!
3 ответа
Inline SVG работает только в Firefox в двух ситуациях:
- В Firefox включен экспериментальный парсер HTML5 (т. Е. Вы используете 4.0 ночью)
- Анализируемый документ не HTML, а XHTML (
Content-type: application/xhtml+xml)
object подход, предложенный Робом, должен работать, пока отдельный файл SVG приходит с вашего сервера с Content-type: image/svg+xml и вы используете правильный синтаксис:
<object data="foo.svg" type="image/svg+xml" width="400" height="300">
См. Статью Дамиана Кьюгли "SVG: объект или вставка?" для получения подробной информации о некоторых других опциях, или используйте SVGWeb.
Убедитесь, что вы используете правильные атрибуты с элементом объекта и конечным тегом:
<object data="yourimage.svg"></object>
Этот пример может быть полезным для вас, объяснение. Поддержка рендеринга SVG во время загрузки, а MIME text/html - это поддерживаемая функция веб-фреймворка ItsNat Java, в любом случае она была вдохновлена этим кодом JS, последний может быть полезен для вас в вашем контексте (PHP).