0

在过去的几天里，我遇到了一个让我有些头疼的问题。

我有一个网页，用户可以在其中创建某种序列图（使用joint.js 和rappid.js v1.7.1）。这个想法是 - 用户有一些可用的节点可以拖到画布上（joint.js 中的纸），然后这些节点可以相互链接。

该功能本身在 chrome 和 Internet Explorer 中运行良好，但我似乎无法让它在 Firefox（版本 47.0.1）中运行。

一旦我在画布上放置一个节点，我就会收到以下错误：在此处输入图像描述

如前所述，此错误仅发生在 Firefox 中，并且使用 Firefox 和 Chrome 调试器功能，我能够判断“相同”对象在 Chrome 中确实接收到 SVG 矩阵，而在 Firefox 中它为空。

该节点包含一个 SVG 图像内容：

defaults: joint.util.deepSupplement({
    type: 'stations.StartPoint',
    attrs: {
        '.stations-point-title-text': { 'text': 'Start' },
        '.stations-point-content-image': { "xlink:href": "data:image/svg+xml;base64,..." }
    }
}, stations.Point.prototype.defaults)

rappid.js 中发生错误的代码行

getTransformToElement: function (a) {
            return a.getScreenCTM().inverse().multiply(this.node.getScreenCTM())
        },

有没有人对joint.js有类似的经验？任何帮助或提示将不胜感激。

谢谢

编辑：我找到了解决这个问题的方法，虽然我必须承认我不太明白。在分析了一个在 Firefox 中运行的演示程序后，我发现不同之处在于我没有在我的代码中调用 Navigator.render() 功能（因为我没有使用导航器）。添加该调用解决了我的问题。（http://jointjs.com/rappid/docs/ui/navigator）

4

1 回答 1

0

一旦移至 0.9.5，问题就消失了。但请确保包含在您的 index.html 中

<脚本> SVGElement.prototype.getTransformToElement = SVGElement.prototype.getTransformToElement || function(toElement) { return toElement.getScreenCTM().inverse().multiply(this.getScreenCTM()); };</脚本>

于 2016-07-05T12:02:20.680 回答