# Trouble with

**URL:** <https://talk.observablehq.com/t/trouble-with/6609>\
**Category:** Help\
**Created:** [May 24, 2022, 2:51pm UTC](https://talk.observablehq.com/t/trouble-with/6609 "2022-05-24T14:51:17Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![nzufelt](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/nzufelt/32/6550_2.png) [@nzufelt](https://talk.observablehq.com/u/nzufelt)\
**Post date:** [May 24, 2022, 2:51pm UTC](https://talk.observablehq.com/t/trouble-with/6609/1 "2022-05-24T14:51:17Z")

</div>

Hi all, I’m having trouble with the absolute basics of D3 with Observable. I have a bunch of D3 experience, but I’ve never done anything with Observable. I’m trying to do just a super simple plot with d3, but I’m getting `null` as a response from the following code. Can anyone see what’s wrong?

```auto
testChart = {
  const data = [{x: 5, y:6},{x: 6, y:6.3}, {x: 5.1, y:5.7}]
  const svg = d3.selectAll(DOM.svg(400, 500))

  svg.append("g").selectAll("circle")
    .data(data)
    .enter()
    .append("circle")
    .attr("fill", "#ff0000")
    .attr("cx", function(d) { d["x"] })
    .attr("cy", function(d) { d["y"] })
    .attr("r", 1.5)
    
  return svg.node()
}

```

---

<div class="post-metadata">

**Author:** ![mootari](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mootari/32/581_2.png) [@mootari](https://talk.observablehq.com/u/mootari)\
**Post date:** [May 24, 2022, 3:23pm UTC](https://talk.observablehq.com/t/trouble-with/6609/2 "2022-05-24T15:23:24Z")

</div>

Hi @nzufelt, and welcome!

Let’s dive right in:

```javascript
const svg = d3.selectAll(DOM.svg(400, 500))

```

This might have been a typo. You’ll have to use d3.select() here:

```javascript
const svg = d3.select(DOM.svg(400, 500))

```

or

```javascript
const svg = d3.create("svg").attr("width", 400).attr("height", 500);

```

These two callbacks:

```javascript
    .attr("cx", function(d) { d["x"] })
    .attr("cy", function(d) { d["y"] })

```

don’t return anything. They should instead read

```javascript
    .attr("cx", function(d) { return d["x"] })
    .attr("cy", function(d) { return d["y"] })

```

or more concise

```javascript
    .attr("cx", d => d.x)
    .attr("cy", d => d.y)

```