File:D3 Example Data-binding.svg
上述预览文件（SVG）的大小为：120 × 120 像素。 其他解析度：250 × 250 像素 | 500 × 500 像素 | 960 × 960 像素 | 1,280 × 1,280 像素 | 3,840 × 3,840 像素。
原始檔案 （SVG 檔案，表面大小：120 × 120 像素，檔案大小：778位元組）
摘要
| 描述 |
中文（臺灣）：用於w:zh:D3.js條目測試樣例的結果圖 |
| 日期 | |
| 來源 | 自己的作品 |
| 作者 | A2569875 |
- 產生此圖的程式碼
// Data
var countriesData = [
{ name:"Ireland", income:53000, life: 78, pop:6378, color: "black"},
{ name:"Norway", income:73000, life: 87, pop:5084, color: "blue" },
{ name:"Tanzania", income:27000, life: 50, pop:3407, color: "grey" }
];
// Create SVG container
var svg = d3.select("#hook").append("svg")
.attr("width", 120)
.attr("height", 120)
.style("background-color", "#D0D0D0");
// Create SVG elements from data
svg.selectAll("circle") // create virtual circle template
.data(countriesData) // bind data
.enter() // for each row in data...
.append("circle") // bind circle & data row such that...
.attr("id", function(d) { return d.name }) // set the circle's id according to the country name
.attr("cx", function(d) { return d.income / 1000 }) // set the circle's horizontal position according to income
.attr("cy", function(d) { return d.life }) // set the circle's vertical position according to life expectancy
.attr("r", function(d) { return d.pop / 1000 *2 }) // set the circle's radius according to country's population
.attr("fill", function(d) { return d.color }); // set the circle's color according to country's color
- 原先輸出的SVG程式碼（無法直接被MediaWiki支援，因此有做修改）
<div id="hook">
<svg width="120" height="120" style="background-color: rgb(208, 208, 208);">
<circle id="Ireland" cx="53" cy="78" r="12.756" fill="black"></circle>
<circle id="Norway" cx="73" cy="87" r="10.168" fill="blue"></circle>
<circle id="Tanzania" cx="27" cy="50" r="6.814" fill="grey"></circle>
</svg>
</div>
授權條款
|
由於本圖像只屬於簡單的幾何圖形圖片，而其完全包含公眾財產資訊，且不包含原創内容，因此著作權不適用於此並歸公有領域所有。 |  |
檔案歷史
點選某个日期/時間檢視對應時刻的檔案。
| 日期/時間 | 縮圖 | 大小 | 使用者 | 備註 | |
|---|---|---|---|---|---|
| 目前 | 2018年9月12日 (三) 19:46 | | 120 × 120（778位元組） | A2569875 | User created page with UploadWizard |
檔案用途
下列頁面有用到此檔案：
