私のd3スキャッタプロットはまったく表示されません

データベースコードを取得しようとしていますが、出力することができません。今ではデータの配列でただただvaraibleを出力しようとしていて、うまくいきません。私のd3スキャッタプロットはまったく表示されません

のJavaScriptファイル：

var w = 600; 
var h = 300; 

var dataset = [ 
    [ 5,  20 ], 
    [ 480, 90 ], 
    [ 250, 50 ], 
    [ 100, 33 ], 
    [ 330, 95 ], 
    [ 410, 12 ], 
    [ 475, 44 ], 
    [ 25, 67 ], 
    [ 85, 21 ], 
    [ 220, 88 ] 
]; 


var svg = d3.select("#scatterPlot") 
    .append("svg") 
    .attr("width", w) 
    .attr("height", h); 

svg.selectAll("circle") 
    .data(dataset) //this will be dataa 
    .enter() 
    .append("circle") 

    .attr("cx", function(d) { //function is getting our data 
    return d[0]; 
    }) 
    .attr("cy", function(d) { 
    return d[1]; 
    }) 
    .attr("r", function(d) { 
    return Math.sqrt(h - d[1]); 
    }); 

    .attr("fill", "#00aa88"); 

    svg.selectAll("text") 
    .data(dataset) 
    .enter() 
    .append("text") 
    .attr("font-size", "11px") 
    .attr("fill", "red"); 
    .text(function(d) { 
    return d[0] + "," + d[1]; 
    }) 



    .attr("x", function(d) { 
    return d[0]; 
    }) 
.attr("y", function(d) { 
return d[1]; 
}) 




    })();

出典

2016-12-04 Meaghan Florence

あなたの構文を確認してください。例えば、セミコロンで終わる行の後ろに '.text（...） 'があります。 – PakkuDon

あなたのコードの最後の行で判断する}}（）; 'もっと多くのJSコードが必要だと思いますよね？どのようなあなたのHTMLは次のように見えますか？どのバージョンのD3を使用していますか？スタックスニペットまたはJSFiddleとして[mcve]を設定してみてください。 – altocumulus

あなたは2つの構文エラーがあります： '.attr（ 'fill'、...'はセミコロンの後に、 '.text（function ...）'の後にさらに}}（）; '' atあなたのコードの実際のサンプルのためのファイルの終わり。 – JulCh

他の人が指摘したように、あなたには、いくつかの紛失;を持っています。これらを取り出すことは、コードを実行している生産：

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <script data-require="[email protected]" data-semver="4.0.0" src="https://d3js.org/d3.v4.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <div id="scatterPlot"></div> 
 
    <script> 
 
    var w = 600; 
 
    var h = 300; 
 

 
    var dataset = [ 
 
     [5, 20], 
 
     [480, 90], 
 
     [250, 50], 
 
     [100, 33], 
 
     [330, 95], 
 
     [410, 12], 
 
     [475, 44], 
 
     [25, 67], 
 
     [85, 21], 
 
     [220, 88] 
 
    ]; 
 
    
 
    var svg = d3.select("#scatterPlot") 
 
     .append("svg") 
 
     .attr("width", w) 
 
     .attr("height", h); 
 

 
    svg.selectAll("circle") 
 
     .data(dataset) //this will be dataa 
 
     .enter() 
 
     .append("circle") 
 

 
    .attr("cx", function(d) { //function is getting our data 
 
     return d[0]; 
 
     }) 
 
     .attr("cy", function(d) { 
 
     return d[1]; 
 
     }) 
 
     .attr("r", function(d) { 
 
     return Math.sqrt(h - d[1]); 
 
     }) 
 
     .attr("fill", "#00aa88"); 
 

 
    svg.selectAll("text") 
 
     .data(dataset) 
 
     .enter() 
 
     .append("text") 
 
     .attr("font-size", "11px") 
 
     .attr("fill", "red") 
 
     .text(function(d) { 
 
     return d[0] + "," + d[1]; 
 
     }) 
 
     .attr("x", function(d) { 
 
     return d[0]; 
 
     }) 
 
     .attr("y", function(d) { 
 
     return d[1]; 
 
     }); 
 

 
    </script> 
 
</body> 
 

 
</html>

出典

2016-12-04 22:40:44 Mark

私のd3スキャッタプロットはまったく表示されません

答えて

関連する問題