我的d3散點圖根本不顯示任何內容
[英]My d3 Scatter plot is not displaying anything at all
問題描述
我一直在嘗試使數據庫代碼正常工作，但無法將其輸出。 現在，即使試圖僅輸出具有數組數據的變量，它也不起作用。
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];
})
})();
1 個解決方案
解決方案1
1 2016-12-04 22:40:44
正如其他人指出的那樣，您有一些錯位; 。 刪除這些將產生運行代碼：
<!DOCTYPE html> <html> <head> <script data-require="d3@4.0.0" 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>
d3 v4的散點圖未顯示Y軸
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.