最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - trouble with introduction to d3.js - Stack Overflow

programmeradmin0浏览0评论

So I'm just starting d3.js and I keep getting a JavaScript error and I've no idea why. I've just created three circles with svg and want to select them with d3. Here's my code:

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script src=".v3.min.js"></script>
    <script type="text/javascript"></script>        
</head>
<body>
    <svg width="360" height="180">
        <circle class="little" cx="180" cy="45" r="12"></circle>
        <circle class="little" cx="60" cy="90" r="12"></circle>
        <circle class="little" cx="300" cy="135" r="12"></circle>
    </svg>
    <script type="text/javascript">
        var circle = svg.selectAll("circle");
    </script>
</body>
</html>

This is supposed to select the circles on the page so I can manipulate them but I keep getting a reference error in my Web Console that says svg is not defined? But the introductory tutorial doesn't say anything about defining svg?

So I'm just starting d3.js and I keep getting a JavaScript error and I've no idea why. I've just created three circles with svg and want to select them with d3. Here's my code:

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script src="http://d3js/d3.v3.min.js"></script>
    <script type="text/javascript"></script>        
</head>
<body>
    <svg width="360" height="180">
        <circle class="little" cx="180" cy="45" r="12"></circle>
        <circle class="little" cx="60" cy="90" r="12"></circle>
        <circle class="little" cx="300" cy="135" r="12"></circle>
    </svg>
    <script type="text/javascript">
        var circle = svg.selectAll("circle");
    </script>
</body>
</html>

This is supposed to select the circles on the page so I can manipulate them but I keep getting a reference error in my Web Console that says svg is not defined? But the introductory tutorial doesn't say anything about defining svg?

Share Improve this question asked Mar 26, 2013 at 17:45 aaduaadu 3,25410 gold badges42 silver badges65 bronze badges 4
  • Which tutorial are you following? – Felix Kling Commented Mar 26, 2013 at 17:46
  • This one: mbostock.github./d3/tutorial/circle.html – aadu Commented Mar 26, 2013 at 18:01
  • Yeah, he really doesn't mention it, at least not explicitly, not even in the introduction. What I found helpful in these situations is having a look at the page source and check the actual code. – Felix Kling Commented Mar 26, 2013 at 18:30
  • Yeah, I was doing that but was still getting a bit lost unfortunately. – aadu Commented Mar 27, 2013 at 11:58
Add a ment  | 

1 Answer 1

Reset to default 8

You need to actually select the svg element first before using svg.selectAll.

var svg = d3.select(document.getElementById('sampleSVGId')),
    circle = svg.selectAll('circle');
发布评论

评论列表(0)

  1. 暂无评论