Как вы увеличиваете отступы на разных уровнях компонованного круга d3.js?

Я делаю пузырьковую диаграмму скважин природного газа, принадлежащих различным энергетическим компаниям в Пенсильвании, используя d3.js.

Я построил вложенный объект, который сначала сортируется по компании, а затем по скважинам. Фрагмент:

{
    "name": "Companies",
    "children":[
    {
        "name": "Shell",
        "children": [
            {
                "name": "100",
                "lat": 40.543401,
                "lng": -79.162257,
                "company": "Shell",
                "production": "20000"
            },
            {
                "name": "2",
                "lat": 40.608186,
                "lng": -79.369354,
                "company": "Shell",
                "production": "40000"
            },
            {
                "name": "3",
                "lat": 40.558923,
                "lng": -79.630966,
                "company": "Shell",
                "production": "10000"
            }
        ]
    },
    {
        "name": "Range",
        "children": [
            {
                "name": "4",
                "lat": 40.431514,
                "lng": -79.466171,
                "company": "Range",
                "production": "25000"
            },
            {
                "name": "5",
                "lat": 40.439876,
                "lng": -80.015488,
                "company": "Range",
                "production": "26000"
            }
        ]
    }
]}

С помощью d3.layout.packЯ установил отступ между кругами на 5.

var pack = d3.layout.pack()
  .size([w,h])
  .padding(5)
  .value(function(d) {
      return (d.production)
  });

Но в то время как я в порядке с внутренними кругами, сгруппированными близко друг к другу, как я могу расположить круги верхнего уровня? Я пытался назначен .padding функция безрезультатна.

var pack = d3.layout.pack()
  .size([w,h])
  .padding( function(d) {
      if (d.depth == 1)
          return 50;
      else
          return 5;
  })
  .value( function(d) {
      return (d.production);
  });

1 ответ

Приведенный ниже код позволит вам изменить отступы на основе радиуса, высоты или глубины узла:

var pack = d3.pack()
  .size([diameter - margin, diameter + margin])
  .padding(function(d) {
      return d.height > 1 ? d.r / 0.35 : 3
  });
Другие вопросы по тегам