Question

我试图制作一个组织流程图，我试图使用treant.js。以下是我的代码。我得到这个拉斐尔并没有定义我无法解决的错误。请帮我解决这个问题。这可能是什么原因？

<!DOCTYPE html>
    <html>
    <head>
        <link rel="stylesheet" 
href="https://cdnjs.cloudflare.com/ajax/libs/treant-js/1.0/Treant.css" integrity="sha256-oihWe0KdtBd8G96a/F7odmMuPQowZ9lsl1LZT7m51GM=" crossorigin="anonymous" />

    </head>
    <body>
        <div onclick="spaLoad()">click</div>
        <div id="tree-simple"></div>
        <script type="text/javascript">

            function spaLoad(){

                var xhr = new XMLHttpRequest();
                xhr.open("GET","https://api.myjson.com/bins/xf2rt",true);
                xhr.send();

                    xhr.onreadystatechange=function () {

                        if(xhr.readyState === 4 && xhr.status === 200){

                            var obj = JSON.parse(xhr.responseText);
                            var orgChart = new Treant(obj);

                            }

                        }
                    }   
        </script>
    <!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/treant-js/1.0/Treant.js" integrity="sha256-znpgHNqR9Hjjydllxj3UCvOia54DxgQcIoacHEXUSLo=" crossorigin="anonymous"></script> -->
    <script type="text/javascript" src="Treant.js"></script>
    </body>
    </html>

JSON文件：

{
  "chart": {
    "container": "#tree-simple"
  },
  "nodeStructure": {
    "text": {
      "name": "Parent node"
    },
    "children": [
      {
        "text": {
          "name": "First child"
        }
      },
      {
        "text": {
          "name": "Second child"
        }
      }
    ]
  }
}

Answer 1

我现在解决了...知道raphael是另一个由treant.js引用的js库

编辑：

> <script
> src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.2.7/raphael.js"
> integrity="sha256-MPXjTSEImVJI1834JAHubdK7Lts1VTUPJmCQ9zKAjyA="
> crossorigin="anonymous"></script>

添加这个使它成为wrk：）

使用Treant.js时，Raphael未定义错误

1 个答案: