0
treant.js를 사용하려고하는 조직의 흐름도를 만들려고합니다. 아래는 제 코드입니다. 이 라파엘이 정의 할 수없는 오류가 아니라서 해결할 수 없어요. 이걸 도와 줘. 왜 그럴 수있어?Treant.js를 사용하는 동안 Raphael이 정의되지 않았습니다.
<!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"
}
}
]
}
}