Javascript D3.js sunburst按大小排序

我正试图根据弧的大小对我的太阳暴流图进行排序。这是我正在使用的代码

    browsable(tagList(
  html_dependency_vue(),
  tags$script(src = "https://unpkg.com/d3"),
  tags$script(src = "https://unpkg.com/d2b@0.5.1/build/d2b.js"),
  tags$script(src = "https://unpkg.com/vue-d2b"),
  tags$script(src = "https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"),
  tags$script(src = 'https://d3js.org/d3-hierarchy.v1.min.js'),
  tags$div(
    id = "app",
    style = "height:400px",
    tag(
      "sunburst-chart",
      list(":data" = "sunburstChartData", ":config" = "sunburstChartConfig")
    )),
  tags$script(HTML(
    sprintf(
"
var app = new Vue({
  el: '#app',
  components: {
  'sunburst-chart': vued2b.ChartSunburst
},
  data: {
    sunburstChartData: %s,
    sunburstChartConfig: function(chart) {
      var d3_category30 = [
  '#1f77b4', '#aec7e8',
  '#ff7f0e', '#ffbb78',
  '#2ca02c', '#98df8a',
  '#d62728', '#ff9896',
  '#9467bd', '#c5b0d5',
  '#e377c2', '#f7b6d2',
  '#7f7f7f', '#c7c7c7',
  '#bcbd22', '#dbdb8d',
  '#17becf', '#9edae5',
  'salmon','lightsalmon',
  'lightsteelblue','steelblue',
  'yellow','orange',
  '#cccccc','#dddddd','#eee','#aaa',
  '#123456','black'];
d3.scale.category30 = function() {
    return d3.scale.ordinal().range(d3_category30);
};
      var color = d3.scale.category30();
      chart.label(function(d){return d.name});
     // chart.sunburst().size(function(d){return d.size});
     chart.color(function(d){return color(d.name);})
     var namesize = d3.nest()
                    .key(function(d) { return d.name; })
                    .rollup(function(a){return a.length;})
                    .entries(data)
                    .sort(function(a, b){ return d3.ascending(a.values, b.values); });


    //chart.color(function(d){return typeof(d.color) === 'undefined' ? '#BBB' : d.color; })
      }
  },
})
",
      hier_json1
    )
  ))
))

在它的其他变体中，我还尝试了以下代码

var root = d3.hierarchy(root)
.sum(function (d) { return d.size; })
.sort(function(a, b) { return b.value - a.value; });

但我知道他们都没有为我工作过。层次结构是使用d3_嵌套在R中生成的。发布的所有代码都在R中，介于“”之间的代码是javascript。我对javascript缺乏经验。非常感谢您的帮助，谢谢

好的，我在这里浏览了源代码：找到了负责排序的代码

 base(sunburst, $$).addProp('pie', d3.pie().sort(null)).addProp('ancestorBanding', d3.scaleLinear()).addProp('descendantBanding', d3.scalePow().exponent(0.85))
// Datum Level Accessors
.addPropFunctor('duration', 250).addPropFunctor('innerRadius', 30).addPropFunctor('outerRadius', 200).addPropFunctor('ancestorPadding', 10).addPropFunctor('ancestorRatio', 0.2).addPropFunctor('descendantLevels', Infinity).addPropFunctor('startAngle', 0).addPropFunctor('endAngle', 2 * Math.PI).addPropFunctor('showLabels', false).addPropFunctor('zoomable', true).addPropFunctor('highlight', true)
// Node Level Accessors
.addPropFunctor('key', function (d) {
  return $$.label(d);
}).addPropFunctor('label', function (d) {
  return d.label;
}).addPropFunctor('color', function (d) {
  return color($$.label(d));
}).addPropFunctor('children', function (d) {
  return d.children;
}).addPropFunctor('size', function (d) {
  return d.size;
});

我一直在尝试将

.sort（null）更改为.sort（函数（a，b）{return b.value-a.value}）

---

不幸的是，我没有成功地做到这一点。任何反馈都会有帮助

所以对于有一天会有同样问题的人来说。如果使用vue.d2b创建sunburst图形，则使用以下代码对图形进行排序

 chart.sunburst().pie().sort(function(a,b){return d3.descending(a.value, b.value)});

---

您确定排序函数实际上是在对实际值进行排序吗？我不知道您的数据集是什么，但如果没有名为value或values的属性，我认为sort实际上不会对任何内容进行排序。嗨，谢谢您的反馈。的确，我的数据集没有任何称为value或value的内容。我的价值观叫做尺寸。但即使我将.value替换为.size，我仍然什么也得不到。有时候数据会被转换。您可能需要使用类似于a.data.size的值。尝试使用console.log并验证其中是否存在真正的值。我不确定如何执行console.log，我正在R中运行此操作。该信息是否在嵌套的JSON中？如果有意义，请在排序函数中执行console.log（'size:'+a.size）。