Firefox 中的内联 SVG

2024-01-09

我对这个有点难住了。我使用 Protovis(一个 JS 库)渲染 SVG 可视化,它在 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 beta 中运行,但我不明白为什么它甚至在 Firefox 3.6 中也不能运行。这是我应该放弃的事情吗?您可以在这里查看演示:

http://www.rioleo.org/protoviewer http://www.rioleo.org/protoviewer(点击“图库”)

再次感谢!


内联 SVG 仅在两种情况下在 Firefox 中有效:

  • Firefox 有实验性HTML5解析器 http://hacks.mozilla.org/2010/05/firefox-4-the-html5-parser-inline-svg-speed-and-more/已启用(即您使用的是 4.0 nightly)
  • 正在解析的文档不是 HTML,而是XHTML http://www.greytower.net/archive/articles/xhtmlcontent.html (Content-type: application/xhtml+xml)

The objectRob 建议的方法应该有效,只要单独的 SVG 文件来自您的服务器Content-type: image/svg+xml并且您使用正确的语法:

<object data="foo.svg" type="image/svg+xml" width="400" height="300">

See Damian Cugley 的文章“SVG:对象还是嵌入?” http://www.alleged.org.uk/pdc/2002/svg-object.html有关其他一些选项的详细信息,或使用SVGWeb http://code.google.com/p/svgweb/.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Firefox 中的内联 SVG 的相关文章

  • 如何提取Firefox会话cookie(Python语言首选)

    我正在尝试从数据库 cookies sqlite 中提取 FF cookie 然而 似乎只能在那里找到具有过期日期的cookie 我正在搜索会话结束时过期的cookie 我什至打开了FF的 记住打开的标签 功能 我不明白 它们之间的根本区别
  • 注入导航错误页面获取:错误:没有匹配的窗口 {"matchesHost":[""]}

    我正在尝试执行一个在指定选项卡上显示绿色边框 按 ID 的脚本 当请求的 URL 的响应出现错误时 应执行该脚本 问题是 当我加载扩展时about debugging 我收到以下错误 在 FF 53 的浏览器控制台中 Error No wi
  • 在 Android 中使用矢量图像在真实设备上出现问题。 SVG-android

    I use svg android jar from https github com pents90 svg android其工作正常 但仅在 Eclipse 中的模拟器设备上 啊啊啊啊 在真实设备上它只是空的imageView在屏幕上
  • 纯 CSS 三角形在 Firefox 中看起来很模糊

    我正在尝试使用本文中 CSS 技巧中使用的纯 css 三角形http css tricks com snippets css css triangle http css tricks com snippets css css triangl
  • 客户端 websocket 限制消息长度

    我正在使用 node js 开发一个 websockter 服务器 并且我发现了 Chrome 中的一些怪癖 Chrome OS X 10 7 64 位 上的最大字符串长度为 17740 而 Firefox 似乎可以毫无问题地处理非常大的字
  • 竖线 (|) 是有效的 CSS 还是 Firefox 特定的?

    我注意到 Firebug 中的这条规则 link color 0000EE 我不确定我是否见过竖线 前 它位于 about PreferenceStyleSheet 中 因此它可能是 Firefox 特定的 这是什么意思 有参考链接吗 我以
  • svg / d3.js 矩形一侧的圆角

    我知道 svg 有一个内置函数可以做圆角 但我只需要在四个角中的 2 个上做圆角 我知道我可以在彼此之上绘制多个矩形来模仿这一点 但这看起来有点俗气 有什么方法可以使用剪辑或任何 d3 js 方法来做到这一点吗 现在我有一个水平条形图 其中
  • SVG 文本在 IE 中消失,直到我单击它

    我在 Internet Explorer Edge 以 Win7 上的为准 中遇到与 SVG 创建和操作相关的问题 在我正在开发的应用程序中 我们使用 d3 生成 SVG 形式的图形 在 Chrome 和 Firefox 中 它们工作得很好
  • SVG 元素出现在 DOM 中但在屏幕上不可见

    我尝试使用 SVG 绘制五线谱Vexflow http www vexflow com and 拉斐尔 js http raphaeljs com当我加载页面时 SVG 元素出现在 DOM 中 但它们不会出现在屏幕上 我检查了是否有任何 C
  • 自 JRE 1.7.0_25 起,Batik 无法进行转换

    自从我更新到 JAVA 1 7 0 25 以来 蜡染在应用转换时会抛出异常 堆栈跟踪是 java awt image ImagingOpException Unable to transform src image at java awt
  • 通过 XSL 查看 XML 到 XHTML 转换中的源代码

    我正在尝试使用 XSL 文件将 XML 文件转换为 XHTML 文件 如何查看转换后输出的XHTML源代码 我目前正在通过 Firefox 查看结果 但我看到的只是 XHTML 文件的渲染版本 我想查看源代码 但是当我转到 查看 gt 页面
  • focusout 事件后,Mouseleave 事件在 Firefox 中无法持续触发

    我正在运行以下代码
  • Snap.svg - 停止在可悬停元素的子元素上重新触发悬停事件

    对于一个项目 我使用的 SVG 形状由背景多边形和背景多边形上方的一些文本 我已将其转换为路径 组成 我正在使用 Snap svg 为我的形状设置动画 当我将鼠标悬停在多边形上时 形状应该缩放到特定尺寸 包括其中的所有内容 鼠标移开时 形状
  • Firefox 30 不再隐藏选择框箭头

    我一直使用的 技巧 是 select moz appearance none text indent 0 01px text overflow 在 FF 上进行自定义选择框 但自从版本 30 发布以来 它完全停止工作 我试图找出这是否已被弃
  • Firefox 背景图像在切换标签后消失

    我在渲染背景图像时遇到一些非常奇怪的问题 我不确定这是 Firefox 的错误还是我的错 每次我在 Firefox 中打开项目站点时 所有背景图像都会正确加载并显示 当我切换到另一个选项卡并在一段时间后切换回来后 所有背景图像都消失了 我检
  • 如何检查浏览器中消失的元素?

    How can I inspect an element which disappears when my mouse moves away 我不知道它的 ID 类别或其他任何信息 但想检查它 我尝试过的解决方案 在控制台内运行 jQuer
  • 如何部分或仅按百分比沿路径过渡

    我是 d3 的初学者 目前无法使用最新版本 但我使用的是 3 x 版本 我想要实现的应该很简单 但遗憾的是我没有找到有关如何做到这一点的资源 目标是在我的 svg 中显示一条路径 然后我想显示例如一个圆并沿着路径过渡 移动 追踪圆 如果我想
  • Firefox 忽略背景大小的 css

    尝试使用背景大小 CSS 规则缩小图像 但 Firefox 3 5 似乎会忽略该规则 CSS privatejoker background aqua url styles images home privatejoker png no r
  • 改进 D3 序列旭日示例

    This D3示例作为我的出发点 http bl ocks org kerryrodden 7090426 http bl ocks org kerryrodden 7090426 我想更改提供图表的数据 并且我做了以下新示例 http j
  • 在 Firefox 中设置自定义协议处理程序?

    我希望 Firefox 在 Linux 上运行 使用外部应用程序打开自定义协议 例如以以下开头的网址gvim 协议名称应该启动 gvim 并传递 url 的其余部分 我尝试设置network protocol handler externa

随机推荐

  • CursorIndexOutOfBoundException:请求索引 1,大小为 1

    又是我 遇到了 Android 版 sqlite 的问题 我目前得到一个 CursorIndexOutOfBoundsException 请求索引 1 尺寸为 1 但是 我遇到了索引 1 的异常 然后插入了一个cursor moveToFi
  • 基于 SVN 中的预提交构建

    我知道已经有人问过这个问题 但我们真的很想拒绝任何提交文件的尝试 这会破坏主干中的项目 拒绝已提交文件的决定基于所提交文件所属项目的构建过程的结果 我知道在预提交阶段 存储库无法同时访问 但这对我们来说不是问题 因为我们的构建速度非常快 并
  • 如何在 Angular 2 Typescript 中复制到剪贴板?

    有没有办法在 Angular2 Typescript 框架中复制剪贴板 多浏览器 中的文本 我只找到使用 Javascript 的来源 例如 document execCommand copy 您可以围绕以下内容实现 Angular2 指令
  • MIPS 上适用于 Android 的免费 Pascal

    尝试将 Delphi 库移植到 Android Free Pascal 支持 Android ARM 可以使用适用于 Windows 的预构建编译器 不过 Android NDK 现在也支持 MIPS 和 x86 FPC 人员的支持状况如何
  • Pandas 插值给出奇怪的结果

    我正在使用 Pandas 及时插值数据点 但是在重采样和插值时 使用不同的重采样率时 相同的插值时间会得到不同的结果 这是一个测试示例 import pandas as pd import datetime data pd DataFram
  • 将 15 添加到 R 中列的每个数字[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 我是 R 新手 我正在尝试为特定列的数据集中的每个数字添加 15 并且想知道这是如何实现的 任何帮助将不胜感激 谢谢 假设你有一个 data
  • 如何禁用 DataGridView CheckBox 列中的特定复选框单元格

    我有一个带有 DataGridView 控件的 winForm 它包含 5 列 其中一列是 CheckBox 列 我想根据同一行另一列中存在的值启用 禁用该列的复选框单元格 我可以使用禁用整个列 但它使整个列处于禁用状态 这是 DataGr
  • 在 .js 文件中声明全局变量是不好的做法吗?

    我有一个 js 文件 我正在其中初始化两个使用的参数 在一个单独的函数中 var submyvar1 var submyvar2 function init myvar1 myvar2 submyvar1 myvar1 submyvar2
  • 这种与 splat 运算符的并行赋值在 Ruby 中是如何工作的?

    letters a b c d e first second letters first gt a second gt b c d e 我明白这会产生什么 但无法理解这一点 这基本上是 Ruby 的魔法吗 无法想到任何其他编程语言可以支持使
  • ng-cloak 和 ng-show 在屏幕上闪烁隐藏元素

    我有一个 div 元素 我只想在项目列表为空时显示该元素 所以我输入以下内容 在 haml 中 no items ng cloak ng show gt items length lt 0 ng cloak gt true 然而 即使我完成
  • .net 序列化:如何有选择地忽略数据字段

    在 Net你可以将一个字段标记为不可序列化 并且在序列化过程中它将被跳过 我正在寻找一种简单的方法 它允许我在运行时控制是否应序列化特定字段 您指的是 将字段标记为不可序列化 所以我假设您正在使用BinaryFormatter and No
  • 播放服务广告与 appcompat 冲突

    当我添加implementation com google android gms play services ads 18 2 0 到我的 build gradle Android Studio 亮点implementation com
  • 如何强制mongo以小写形式存储成员?

    我有一个 BsonDocuments 集合 例如 MongoCollection
  • 为什么绑定不适用于动画?

    我对动画绑定属性有一个简单的问题 这是一个简单的例子来说明它 视图模型 public class ViewModel private double myProperty public double MyProperty get return
  • 在 JavaScript 中检测 Lion (OS X 10.7)?

    有没有办法用 Javascript 检测操作系统是否是 OS X Lion Cheers Lion 中 Safari 还有 Firefox 的用户代理类似于 Mozilla 5 0 Macintosh Intel Mac OS X 10 7
  • 如何从 Amazon API Gateway 将查询字符串或路由参数传递到 AWS Lambda

    例如如果我们想使用 GET user name bob or GET user bob 如何将这两个示例作为参数传递给 Lambda 函数 我在文档中看到了有关设置 映射自 的内容 但我在 API Gateway 控制台中找不到该设置 me
  • Kotlin 中具有反向查找功能的有效枚举?

    我正在尝试找到在 Kotlin 中对枚举进行 反向查找 的最佳方法 我从 Effective Java 中得到的收获之一是在枚举中引入静态映射来处理反向查找 使用一个简单的枚举将其移植到 Kotlin 会得到如下所示的代码 enum cla
  • 关于 (POSIX) 信号主题的最佳参考文献是什么?

    信号似乎是概念上应该简单且易于解释的领域之一 但我从未遇到过既全面 清晰又最新的来源 在某种程度上 这似乎是由于历史遗留问题 规则的大量例外 不同的编程标准 混乱的线程 实时添加等 关于 unix linux posix 信号 您写得最好
  • 如何在 Asp.net MVC2 中通过 Ajax 调用处理 UnauthorizedRequest

    Brief 我的框架中有一个子类 AuthorizeAttribute 我在其中进行自定义授权 我正在从普通的 asp net mvc 视图渲染切换到通过 jQuery 的 Ajax 渲染 因此 应用程序中的每个链接都会执行 ajax 调用
  • Firefox 中的内联 SVG

    我对这个有点难住了 我使用 Protovis 一个 JS 库 渲染 SVG 可视化 它在 Chrome 和 Firefox 中运行得非常好 我将渲染的 SVG 保存在我的服务器上 并尝试使用 PHP 函数在 图库 视图中重新渲染它 但这在