D3版本4獲得空對象

我試圖讓D3 V4工作基本簡單的渲染與V3工作之前，我得到空對象。下面的代碼的簡單版本：D3版本4獲得空對象

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.4.0/d3.min.js"></script> 
<script> 
    var dataset = [23, 45, 66, 77, 88, 99]; 
    var svg = d3.select("body").append("svg").attr({width: 500, height: 500}); 
    console.log('svg : '+svg); 
</script>

結果上面的代碼是：

SVG：空

寫作與V3相同的代碼，結果

SVG：[對象SVGSVGElement]」

我在這裏錯過了什麼？我正在關注這些教程，其中大部分都在v3中。

來源

2016-12-02 Joe Saad

的attr函數可以接受兩個參數 - 屬性名稱和屬性值。試試這個：

var dataset = [23, 45, 66, 77, 88, 99]; 
var svg = d3.select("body").append("svg") 
    .attr("height", 500) 
    .attr("width", 500); 

console.log('svg : '+svg);

來源

2016-12-02 19:29:25

我只是試過，它的工作..所以我不能把我所有的屬性在一個對象？我是否必須使用.attr（）方法逐個指定？ –

這是正確的。你可以在這裏找到更多關於如何使用選擇的信息：https：//github.com/d3/d3-selection –

你是對的。我剛剛在這裏發現了這個問題：https：//github.com/d3/d3/issues/2907，並使用你提到的那個庫和https://github.com/d3/d3-selection-multi並且工作。感謝大家 –

儘管說，否則所有的答案（包括目前公認的答案），你可以在 D3 4.x版本傳遞一個對象來attr和style，只要：

首先，您引用「選擇的多」：

<script src="https://d3js.org/d3-selection-multi.v1.min.js"></script>

其次，使用attrs和styles，作爲複數：

d3.select("body").append("div") 
    .attrs({ 
     title: "A cheery, timeless greeting.", 
     class: "greeting" 
    }) 
    .text("Hello, world!");

所以，在你的代碼，它應該是：

var svg = d3.select("body") 
    .append("svg") 
    .attrs({width: 500, height: 500});

這裏是你展示它的工作原理演示：

var svg = d3.select("body") 
 
    .append("svg") 
 
    .attrs({width: 500, height: 500}); 
 
\t \t \t \t 
 
console.log('svg : ' +JSON.stringify(svg));

<script src="https://d3js.org/d3.v4.min.js"></script> 
 
<script src="https://d3js.org/d3-selection-multi.v1.min.js"></script>

來源

2016-12-02 23:03:28

D3版本4獲得空對象

回答

相關問題