Mike Bostock’s Block 5649592を例としてストロークダッシュ補間を描画しようとしています。ストロークダッシュ補間サンプルコードが機能しない
コードをindex.htmlの例から自分のローカルコンピュータのhtmlファイルにコピーしましたが、htmlファイルを開いたときに何も表示されません。誰がここで何が起こっているのか知っていますか?ここに何もないのですか?
私はここで自分のコードをコピーしています:
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<style>
path {
fill: none;
stroke: #000;
stroke-width: 3px;
}
</style>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
var points = [
[480, 200],
[580, 400],
[680, 100],
[780, 300],
[180, 300],
[280, 100],
[380, 400]
];
var line = d3.svg.line()
.tension(0) // Catmull–Rom
.interpolate("cardinal-closed");
var svg = d3.select("body").append("svg")
.datum(points)
.attr("width", 960)
.attr("height", 500);
svg.append("path")
.style("stroke", "#ddd")
.style("stroke-dasharray", "4,4")
.attr("d", line);
svg.append("path")
.attr("d", line)
.call(transition);
function transition(path) {
path.transition()
.duration(7500)
.attrTween("stroke-dasharray", tweenDash)
.each("end", function() { d3.select(this).call(transition); });
}
function tweenDash() {
var l = this.getTotalLength(),
i = d3.interpolateString("0," + l, l + "," + l);
return function(t) { return i(t); };
}
</script>
すべてのヘルプは歓迎です!ありがとう。
問題は、以下の私の答えの記事を参照してください
を解決しました。 BJKへの名誉!
私はライブラリをダウンロードしていないと確信していますので、D3のオンラインリファレンスを提供してください: ''。 –
@GerardoFurtado素敵ではありませんが、それは問題ではありません! [* "すべてのhttp://リンクを//?" *](/ q/4831741)とhttps://www.paulirish.com/2010/the-protocol-relative-url/に変更することができます。 – altocumulus
@altocumulusはい、あなたが正しいです、私は私のコメントで不注意でした:私はコードをスキミングし、それは絶対パスだったが。 my(tyred)myndで '' /d3.v3.min.js」 'を読みました。 –