Last active
June 23, 2016 15:13
-
-
Save ics-ikeda/cbe9540e3fcdf7af01763251fb94687b to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<style> | |
svg{ | |
background-color: #FFFFFF; | |
} | |
</style> | |
</head> | |
<body> | |
<script src="./SnapSVGAnimator/js/vendor/snap.svg/snap.svg-min.js"></script> | |
<script src="./SnapSVGAnimator/js/SnapSVGAnimator.min.js"></script> | |
<script type="text/javascript"> | |
var jsonfile = "02_Custom.json", | |
fps = 20, | |
width = 320, | |
height = 270, | |
AJAX_req; | |
AJAX_JSON_Req(jsonfile); | |
function handle_AJAX_Complete() { | |
if( AJAX_req.readyState == 4 && AJAX_req.status == 200 ) | |
{ | |
json = JSON.parse(AJAX_req.responseText); | |
comp = new SVGAnim( | |
json, | |
width, | |
height, | |
fps | |
); | |
// --------------------------------------------- | |
// SVG 要素を抜き出す | |
var el = document.querySelector("svg"); | |
// 配置したい要素を探しだす | |
var container = document.querySelector("#myContainer"); | |
// 要素を移動させる | |
container.appendChild(el); | |
// --------------------------------------------- | |
} | |
} | |
function AJAX_JSON_Req( url ) | |
{ | |
AJAX_req = new XMLHttpRequest(); | |
AJAX_req.open("GET", url, true); | |
AJAX_req.setRequestHeader("Content-type", "application/json"); | |
AJAX_req.onreadystatechange = handle_AJAX_Complete; | |
AJAX_req.send(); | |
} | |
</script> | |
<!-- ================================ --> | |
<!-- 移動先のコンテナー --> | |
<div id="myContainer"></div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment