text: /*=========================================================================================
      File Name: line.js
      Description: D3 simple line chart
      ----------------------------------------------------------------------------------------
      Item Name: Modern Admin - Clean Bootstrap 4 Dashboard HTML Template
      Version: 1.0
      Author: PIXINVENT
      Author URL: http://www.themeforest.net/user/pixinvent
  ==========================================================================================*/
  
  // Line chart
  // ------------------------------
  $(window).on("load", function(){
  
      var ele = d3.select("#zoomable-sunburst"),
      width = ele.node().getBoundingClientRect().width,
      height = 400;
      radius = (Math.min(width, height) / 2) - 10;
  
      var formatNumber = d3.format(",d");
  
      var x = d3.scale.linear()
          .range([0, 2 * Math.PI]);
  
      var y = d3.scale.sqrt()
          .range([0, radius]);
  
      // Color
      var color = d3.scale.ordinal()
          .range(["#99B898", "#FECEA8", "#FF847C", "#E84A5F", "#C06C84", "#6C5B7B", "#355C7D"]);
  
      var partition = d3.layout.partition()
          .value(function(d) { return d.size; });
  
      var arc = d3.svg.arc()
          .startAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x))); })
          .endAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx))); })
          .innerRadius(function(d) { return Math.max(0, y(d.y)); })
          .outerRadius(function(d) { return Math.max(0, y(d.y + d.dy)); });
  
      var svg = ele.append("svg")
          .attr("width", width)
          .attr("height", height)
        .append("g")
          .attr("transform", "translate(" + width / 2 + "," + (height / 2) + ")");
  
      d3.json("../../../app-assets/data/d3/circle/flare.json", function(error, root) {
        if (error) throw error;
  
        svg.selectAll("path")
            .data(partition.nodes(root))
          .enter().append("path")
            .attr("d", arc)
            .style("fill", function(d) { return color((d.children ? d : d.parent).name); })
            .on("click", click)
          .append("title")
            .text(function(d) { return d.name + "\n" + formatNumber(d.value); });
      });
  
      function click(d) {
        svg.transition()
            .duration(750)
            .tween("scale", function() {
              var xd = d3.interpolate(x.domain(), [d.x, d.x + d.dx]),
                  yd = d3.interpolate(y.domain(), [d.y, 1]),
                  yr = d3.interpolate(y.range(), [d.y ? 20 : 0, radius]);
              return function(t) { x.domain(xd(t)); y.domain(yd(t)).range(yr(t)); };
            })
          .selectAll("path")
            .attrTween("d", function(d) { return function() { return arc(d); }; });
      }
  
      d3.select(self.frameElement).style("height", height + "px");
  
  });