Question

我正在通过本教程学习Raphael.js：http://net.tutsplus.com/tutorials/javascript-ajax/an-introduction-to-the-raphael-js-library/但我在路径上被阻止了（第4节）。这是我的测试代码：

<html>  
    <head>  
        <title>Raphael Play</title>  
        <script type="text/javascript" src="js/raphael-min.js"></script>  
        <script type="text/javascript">
window.onload = function() {  
    var paper = new Raphael(document.getElementById('canvas_container'), 500, 500);  
    var tetronimo = paper.path("M 250 250 l 0 -50 l -50 0 l 0 -50 l -50 0 l 0 50 l -50 0 l 0 50 z");  
}
        </script>  
        <style type="text/css">  
            #canvas_container {  
                width: 500px;  
                border: 1px solid #aaa;  
            }  
        </style>  
    </head>  
    <body>  
        <div id="canvas_container"></div>  
    </body>  
</html>

出于某种原因，路径是空的：

<svg height="500" version="1.1" width="500" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative;">
    <desc>Created with RaphaÃ«l 2.1.0</desc>
    <defs/>
    <path style="" fill="none" stroke="#000000" d=""/>
</svg>

我甚至尝试在d =“”param中设置手工制作的路径，但是没有去。在OSX上测试FF和Chrome。

感谢您的帮助。

Answer 1

奇怪的是，当我将代码直接粘贴到桌面上的新.html文件中，并用public version on CloudFlare替换Raphael库的<script> src时，它运行正常：我看到了俄罗斯方块片。

    <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>

你的拉斐尔本地副本可能有问题吗？它仍然设法制作<svg>元素，很难知道。

拉斐尔产生空路

1 个答案: