0

So, I've tried following Jason Davies' answer to the Circle clip and projection with D3 orthographic thread...

I've tried 3 different possibilities : 

svg.append("g").attr("class","points")
  .selectAll("path")
    .data(places.features)
    .enter()
    .append("path")
    //THIS COMMENTED PART DOES NOT WORK
    //though the console spits out an array
    /*.datum(function(d){
         console.log(d.geometry.coordinates)
         return d3.geo.circle()
           .origin(d.geometry.coordinates)
           .angle(2)
    })*/

    //THIS UNCOMMENTED PART WORKS
    //and places the circles accordingly with a fixed size radius
    .datum(d3.geo.circle()
      .origin(function(d){return d.geometry.coordinates})
      .angle(2)
    )

    //THIS COMMENTED PART DOES NOT WORK
    //which is a shame, as my goal is to change the angle of each circle
    /*.datum(d3.geo.circle()
          .origin(function(d){return d.geometry.coordinates})
          .angle(function(d){return 2})
    )*/

    .attr("class", "point")
    .attr("d", path)

How do I get the last commented part to work so that I can change the radius of my circles? Thanx a lot.

Community
  • 1
  • 1
Mrpomme
  • 1
  • 1
  • Can you elaborate on how it doesn't work please? Any error messages? What happens and what do you expect to happen? – Lars Kotthoff Jul 31 '14 at 10:18
  • How it doesn't work : the circles are just not created... The first commented part doesn't give me any message error. The second commented part says : "Uncaught TypeError: Cannot read property '0' of undefined " I'm just trying to figure out why it seems I can't put a function with a return in my angle property. – Mrpomme Jul 31 '14 at 10:33
  • You need a `function(d)` just after `.datum()` like in the first commented part. – Lars Kotthoff Jul 31 '14 at 10:48
  • I got it .datum(function(d){ var origin = d.geometry.coordinates var angle = avions[d.properties.index].total_morts/100 return d3.geo.circle().angle(angle).origin(origin)() } ) THIS WORKS!! The trick is in the parenthesis at the end. Why is that, though?? – Mrpomme Jul 31 '14 at 11:42
  • Oh right, didn't see that -- `d3.geo.circle()` is a factory function (i.e. a function that returns a function) which you then still need to call. – Lars Kotthoff Jul 31 '14 at 12:47

1 Answers1

0

After updating to d3 version "5.7.0" I had same issue. Fixed by using geoCircle.center(center).radius(angle) instead of geo.circle().angle(angle).

Here you can find how it could work.

Manuel Schmitzberger
  • 5,162
  • 3
  • 36
  • 45