I cannot seem to find a reusable D3 Angular Treemap Directive that zooms like Mike Bostock's here. If anyone has created one in the past or can give me any information pertaining to where I could find one I would be very greatful!
Heck, it doesn't absolutely have to be D3 either, I just need to get this working in an angular project.
Thanks!
You will need to create a div like this in html here we will hook our treemap:
<div linear-chart></div>
Next make a directive to map the linear-chart attribute:
app.directive('linearChart', function() {
return {
restrict: 'EA',
link: function(scope, elem, attrs) {
var root = scope.data;
//here you make your svg to the elem
var svg = d3.select(elem[0]).append("svg")
//tree map code
}
Inside the link function you can copy the example code, such that you hook the tree map to the element as shown above.
Full working code here
Hope this helps!
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments