Forum Discussion

Anonymous's avatar
Anonymous
Not applicable
6 years ago

Custom visuals: support for .size in partition (sunburst) layout

Hello, I have created a sunburst visual. I need to add a .sort function to the partition layout, as I can in d3. When I try this, i get "Error TS2339 (TS) Property 'sort' does not exist on type 'PartitionLayout<unknown>'. " Do I need to declare var partition as a particular type? If so, which type please? Thanks

 

var partition = d3.partition().size([2 * Math.PI, radius * radius]);

 

 

Need Help

1 Reply

  • dm-p's avatar
    dm-p
    Icon for Super User rankSuper User
    6 years ago

    Hi Anonymous,

    I'm not sure if you're using a D3 v3 example or doc as your reference, but I just reviewed the typings for v5 (which is the default version packaged with custom visuals now) and the object generated by a partition layout no longer returns something you can call a sort method on.

    I digged further into the D3 hierarchy API docs, and found this for both v4 and v5:

    You must call root.sum before passing the hierarchy to the partition layout. You probably also want to call root.sort to order the hierarchy before computing the layout.

    Looks like this was a breaking change introduced between v3 and 4:

    It also simplifies the API: rather than each hierarchy layout needing to implement value and sorting accessors, there are now generic node.sum and node.sort methods that work with any hierarchy layout.

    So, it now looks like you need to pre-sort your data prior to calling the partition function.

    I've looked and found an updated example you can refer to - I notice that they are indeed pre-sorting the data, e.g.:

    partition = data => {
  const root = d3.hierarchy(data)
      .sum(d => d.value)
      .sort((a, b) => b.value - a.value);
  return d3.partition()
      .size([2 * Math.PI, root.height + 1])
    (root);
}

    Hopefully this helps get you moving. Good luck!

    Regards,

    Daniel