test-prof 0.1.0.beta1

data/assets/src/d3-tip.js

@@ -0,0 +1,352 @@
+/**
+ * d3.tip
+ * Copyright (c) 2013-2017 Justin Palmer
+ *
+ * Tooltips for d3.js SVG visualizations
+ */
+// eslint-disable-next-line no-extra-semi
+;(function(root, factory) {
+  if (typeof define === 'function' && define.amd) {
+    // AMD. Register as an anonymous module with d3 as a dependency.
+    define([
+      'd3-collection',
+      'd3-selection'
+    ], factory)
+  } else if (typeof module === 'object' && module.exports) {
+    /* eslint-disable global-require */
+    // CommonJS
+    var d3Collection = require('d3-collection'),
+        d3Selection = require('d3-selection')
+    module.exports = factory(d3Collection, d3Selection)
+    /* eslint-enable global-require */
+  } else {
+    // Browser global.
+    var d3 = root.d3
+    // eslint-disable-next-line no-param-reassign
+    root.d3.tip = factory(d3, d3)
+  }
+}(this, function(d3Collection, d3Selection) {
+  // Public - contructs a new tooltip
+  //
+  // Returns a tip
+  return function() {
+    var direction   = d3TipDirection,
+        offset      = d3TipOffset,
+        html        = d3TipHTML,
+        rootElement = document.body,
+        node        = initNode(),
+        svg         = null,
+        point       = null,
+        target      = null
+
+    function tip(vis) {
+      svg = getSVGNode(vis)
+      if (!svg) return
+      point = svg.createSVGPoint()
+      rootElement.appendChild(node)
+    }
+
+    // Public - show the tooltip on the screen
+    //
+    // Returns a tip
+    tip.show = function() {
+      var args = Array.prototype.slice.call(arguments)
+      if (args[args.length - 1] instanceof SVGElement) target = args.pop()
+
+      var content = html.apply(this, args),
+          poffset = offset.apply(this, args),
+          dir     = direction.apply(this, args),
+          nodel   = getNodeEl(),
+          i       = directions.length,
+          coords,
+          scrollTop  = document.documentElement.scrollTop ||
+            rootElement.scrollTop,
+          scrollLeft = document.documentElement.scrollLeft ||
+            rootElement.scrollLeft
+
+      nodel.html(content)
+        .style('opacity', 1).style('pointer-events', 'all')
+
+      while (i--) nodel.classed(directions[i], false)
+      coords = directionCallbacks.get(dir).apply(this)
+      nodel.classed(dir, true)
+        .style('top', (coords.top + poffset[0]) + scrollTop + 'px')
+        .style('left', (coords.left + poffset[1]) + scrollLeft + 'px')
+
+      return tip
+    }
+
+    // Public - hide the tooltip
+    //
+    // Returns a tip
+    tip.hide = function() {
+      var nodel = getNodeEl()
+      nodel.style('opacity', 0).style('pointer-events', 'none')
+      return tip
+    }
+
+    // Public: Proxy attr calls to the d3 tip container.
+    // Sets or gets attribute value.
+    //
+    // n - name of the attribute
+    // v - value of the attribute
+    //
+    // Returns tip or attribute value
+    // eslint-disable-next-line no-unused-vars
+    tip.attr = function(n, v) {
+      if (arguments.length < 2 && typeof n === 'string') {
+        return getNodeEl().attr(n)
+      }
+
+      var args =  Array.prototype.slice.call(arguments)
+      d3Selection.selection.prototype.attr.apply(getNodeEl(), args)
+      return tip
+    }
+
+    // Public: Proxy style calls to the d3 tip container.
+    // Sets or gets a style value.
+    //
+    // n - name of the property
+    // v - value of the property
+    //
+    // Returns tip or style property value
+    // eslint-disable-next-line no-unused-vars
+    tip.style = function(n, v) {
+      if (arguments.length < 2 && typeof n === 'string') {
+        return getNodeEl().style(n)
+      }
+
+      var args = Array.prototype.slice.call(arguments)
+      d3Selection.selection.prototype.style.apply(getNodeEl(), args)
+      return tip
+    }
+
+    // Public: Set or get the direction of the tooltip
+    //
+    // v - One of n(north), s(south), e(east), or w(west), nw(northwest),
+    //     sw(southwest), ne(northeast) or se(southeast)
+    //
+    // Returns tip or direction
+    tip.direction = function(v) {
+      if (!arguments.length) return direction
+      direction = v == null ? v : functor(v)
+
+      return tip
+    }
+
+    // Public: Sets or gets the offset of the tip
+    //
+    // v - Array of [x, y] offset
+    //
+    // Returns offset or
+    tip.offset = function(v) {
+      if (!arguments.length) return offset
+      offset = v == null ? v : functor(v)
+
+      return tip
+    }
+
+    // Public: sets or gets the html value of the tooltip
+    //
+    // v - String value of the tip
+    //
+    // Returns html value or tip
+    tip.html = function(v) {
+      if (!arguments.length) return html
+      html = v == null ? v : functor(v)
+
+      return tip
+    }
+
+    // Public: sets or gets the root element anchor of the tooltip
+    //
+    // v - root element of the tooltip
+    //
+    // Returns root node of tip
+    tip.rootElement = function(v) {
+      if (!arguments.length) return rootElement
+      rootElement = v == null ? v : functor(v)
+
+      return tip
+    }
+
+    // Public: destroys the tooltip and removes it from the DOM
+    //
+    // Returns a tip
+    tip.destroy = function() {
+      if (node) {
+        getNodeEl().remove()
+        node = null
+      }
+      return tip
+    }
+
+    function d3TipDirection() { return 'n' }
+    function d3TipOffset() { return [0, 0] }
+    function d3TipHTML() { return ' ' }
+
+    var directionCallbacks = d3Collection.map({
+          n:  directionNorth,
+          s:  directionSouth,
+          e:  directionEast,
+          w:  directionWest,
+          nw: directionNorthWest,
+          ne: directionNorthEast,
+          sw: directionSouthWest,
+          se: directionSouthEast
+        }),
+        directions = directionCallbacks.keys()
+
+    function directionNorth() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.n.y - node.offsetHeight,
+        left: bbox.n.x - node.offsetWidth / 2
+      }
+    }
+
+    function directionSouth() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.s.y,
+        left: bbox.s.x - node.offsetWidth / 2
+      }
+    }
+
+    function directionEast() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.e.y - node.offsetHeight / 2,
+        left: bbox.e.x
+      }
+    }
+
+    function directionWest() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.w.y - node.offsetHeight / 2,
+        left: bbox.w.x - node.offsetWidth
+      }
+    }
+
+    function directionNorthWest() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.nw.y - node.offsetHeight,
+        left: bbox.nw.x - node.offsetWidth
+      }
+    }
+
+    function directionNorthEast() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.ne.y - node.offsetHeight,
+        left: bbox.ne.x
+      }
+    }
+
+    function directionSouthWest() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.sw.y,
+        left: bbox.sw.x - node.offsetWidth
+      }
+    }
+
+    function directionSouthEast() {
+      var bbox = getScreenBBox()
+      return {
+        top:  bbox.se.y,
+        left: bbox.se.x
+      }
+    }
+
+    function initNode() {
+      var div = d3Selection.select(document.createElement('div'))
+      div
+        .style('position', 'absolute')
+        .style('top', 0)
+        .style('opacity', 0)
+        .style('pointer-events', 'none')
+        .style('box-sizing', 'border-box')
+
+      return div.node()
+    }
+
+    function getSVGNode(element) {
+      var svgNode = element.node()
+      if (!svgNode) return null
+      if (svgNode.tagName.toLowerCase() === 'svg') return svgNode
+      return svgNode.ownerSVGElement
+    }
+
+    function getNodeEl() {
+      if (node == null) {
+        node = initNode()
+        // re-add node to DOM
+        rootElement.appendChild(node)
+      }
+      return d3Selection.select(node)
+    }
+
+    // Private - gets the screen coordinates of a shape
+    //
+    // Given a shape on the screen, will return an SVGPoint for the directions
+    // n(north), s(south), e(east), w(west), ne(northeast), se(southeast),
+    // nw(northwest), sw(southwest).
+    //
+    //    +-+-+
+    //    |   |
+    //    +   +
+    //    |   |
+    //    +-+-+
+    //
+    // Returns an Object {n, s, e, w, nw, sw, ne, se}
+    function getScreenBBox() {
+      var targetel   = target || d3Selection.event.target
+
+      while (targetel.getScreenCTM == null && targetel.parentNode == null) {
+        targetel = targetel.parentNode
+      }
+
+      var bbox       = {},
+          matrix     = targetel.getScreenCTM(),
+          tbbox      = targetel.getBBox(),
+          width      = tbbox.width,
+          height     = tbbox.height,
+          x          = tbbox.x,
+          y          = tbbox.y
+
+      point.x = x
+      point.y = y
+      bbox.nw = point.matrixTransform(matrix)
+      point.x += width
+      bbox.ne = point.matrixTransform(matrix)
+      point.y += height
+      bbox.se = point.matrixTransform(matrix)
+      point.x -= width
+      bbox.sw = point.matrixTransform(matrix)
+      point.y -= height / 2
+      bbox.w = point.matrixTransform(matrix)
+      point.x += width
+      bbox.e = point.matrixTransform(matrix)
+      point.x -= width / 2
+      point.y -= height / 2
+      bbox.n = point.matrixTransform(matrix)
+      point.y += height
+      bbox.s = point.matrixTransform(matrix)
+
+      return bbox
+    }
+
+    // Private - replace D3JS 3.X d3.functor() function
+    function functor(v) {
+      return typeof v === 'function' ? v : function() {
+        return v
+      }
+    }
+
+    return tip
+  }
+// eslint-disable-next-line semi
+}));

data/assets/src/d3-tip.min.js

@@ -0,0 +1 @@
+!function(t,e){if("function"==typeof define&&define.amd)define(["d3-collection","d3-selection"],e);else if("object"==typeof module&&module.exports){var n=require("d3-collection"),r=require("d3-selection");module.exports=e(n,r)}else{var o=t.d3;t.d3.tip=e(o,o)}}(this,function(t,e){return function(){function n(t){(C=m(t))&&(H=C.createSVGPoint(),b.appendChild(E))}function r(){return"n"}function o(){return[0,0]}function l(){return" "}function i(){var t=x();return{top:t.n.y-E.offsetHeight,left:t.n.x-E.offsetWidth/2}}function f(){var t=x();return{top:t.s.y,left:t.s.x-E.offsetWidth/2}}function u(){var t=x();return{top:t.e.y-E.offsetHeight/2,left:t.e.x}}function s(){var t=x();return{top:t.w.y-E.offsetHeight/2,left:t.w.x-E.offsetWidth}}function a(){var t=x();return{top:t.nw.y-E.offsetHeight,left:t.nw.x-E.offsetWidth}}function c(){var t=x();return{top:t.ne.y-E.offsetHeight,left:t.ne.x}}function p(){var t=x();return{top:t.sw.y,left:t.sw.x-E.offsetWidth}}function y(){var t=x();return{top:t.se.y,left:t.se.x}}function d(){var t=e.select(document.createElement("div"));return t.style("position","absolute").style("top",0).style("opacity",0).style("pointer-events","none").style("box-sizing","border-box"),t.node()}function m(t){var e=t.node();return e?"svg"===e.tagName.toLowerCase()?e:e.ownerSVGElement:null}function h(){return null==E&&(E=d(),b.appendChild(E)),e.select(E)}function x(){for(var t=S||e.event.target;null==t.getScreenCTM&&null==t.parentNode;)t=t.parentNode;var n={},r=t.getScreenCTM(),o=t.getBBox(),l=o.width,i=o.height,f=o.x,u=o.y;return H.x=f,H.y=u,n.nw=H.matrixTransform(r),H.x+=l,n.ne=H.matrixTransform(r),H.y+=i,n.se=H.matrixTransform(r),H.x-=l,n.sw=H.matrixTransform(r),H.y-=i/2,n.w=H.matrixTransform(r),H.x+=l,n.e=H.matrixTransform(r),H.x-=l/2,H.y-=i/2,n.n=H.matrixTransform(r),H.y+=i,n.s=H.matrixTransform(r),n}function v(t){return"function"==typeof t?t:function(){return t}}var g=r,w=o,T=l,b=document.body,E=d(),C=null,H=null,S=null;n.show=function(){var t=Array.prototype.slice.call(arguments);t[t.length-1]instanceof SVGElement&&(S=t.pop());var e,r=T.apply(this,t),o=w.apply(this,t),l=g.apply(this,t),i=h(),f=A.length,u=document.documentElement.scrollTop||b.scrollTop,s=document.documentElement.scrollLeft||b.scrollLeft;for(i.html(r).style("opacity",1).style("pointer-events","all");f--;)i.classed(A[f],!1);return e=W.get(l).apply(this),i.classed(l,!0).style("top",e.top+o[0]+u+"px").style("left",e.left+o[1]+s+"px"),n},n.hide=function(){return h().style("opacity",0).style("pointer-events","none"),n},n.attr=function(t,r){if(arguments.length<2&&"string"==typeof t)return h().attr(t);var o=Array.prototype.slice.call(arguments);return e.selection.prototype.attr.apply(h(),o),n},n.style=function(t,r){if(arguments.length<2&&"string"==typeof t)return h().style(t);var o=Array.prototype.slice.call(arguments);return e.selection.prototype.style.apply(h(),o),n},n.direction=function(t){return arguments.length?(g=null==t?t:v(t),n):g},n.offset=function(t){return arguments.length?(w=null==t?t:v(t),n):w},n.html=function(t){return arguments.length?(T=null==t?t:v(t),n):T},n.rootElement=function(t){return arguments.length?(b=null==t?t:v(t),n):b},n.destroy=function(){return E&&(h().remove(),E=null),n};var W=t.map({n:i,s:f,e:u,w:s,nw:a,ne:c,sw:p,se:y}),A=W.keys();return n}});

data/assets/src/d3.flameGraph.css

@@ -0,0 +1,92 @@
+.d3-flame-graph rect {
+  stroke: #EEEEEE;
+  fill-opacity: .8;
+}
+
+.d3-flame-graph rect:hover {
+  stroke: #474747;
+  stroke-width: 0.5;
+  cursor: pointer;
+}
+
+.d3-flame-graph .label {
+  pointer-events: none;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  font-size: 12px;
+  font-family: Verdana;
+  margin-left: 4px;
+  margin-right: 4px;
+  line-height: 1.5;
+  padding: 0 0 0;
+  font-weight: 400;
+  color: black;
+  text-align: left;
+}
+
+.d3-flame-graph .fade {
+  opacity: 0.6 !important;
+}
+
+.d3-flame-graph .title {
+  font-size: 20px;
+  font-family: Verdana;
+}
+
+.d3-flame-graph-tip {
+  line-height: 1;
+  font-family: Verdana;
+  font-size: 12px;
+  padding: 12px;
+  background: rgba(0, 0, 0, 0.8);
+  color: #fff;
+  border-radius: 2px;
+  pointer-events: none;
+}
+
+/* Creates a small triangle extender for the tooltip */
+.d3-flame-graph-tip:after {
+  box-sizing: border-box;
+  display: inline;
+  font-size: 10px;
+  width: 100%;
+  line-height: 1;
+  color: rgba(0, 0, 0, 0.8);
+  position: absolute;
+  pointer-events: none;
+}
+
+/* Northward tooltips */
+.d3-flame-graph-tip.n:after {
+  content: "\25BC";
+  margin: -1px 0 0 0;
+  top: 100%;
+  left: 0;
+  text-align: center;
+}
+
+/* Eastward tooltips */
+.d3-flame-graph-tip.e:after {
+  content: "\25C0";
+  margin: -4px 0 0 0;
+  top: 50%;
+  left: -8px;
+}
+
+/* Southward tooltips */
+.d3-flame-graph-tip.s:after {
+  content: "\25B2";
+  margin: 0 0 1px 0;
+  top: -8px;
+  left: 0;
+  text-align: center;
+}
+
+/* Westward tooltips */
+.d3-flame-graph-tip.w:after {
+  content: "\25B6";
+  margin: -4px 0 0 -1px;
+  top: 50%;
+  left: 100%;
+}

data/assets/src/d3.flameGraph.js

@@ -0,0 +1,459 @@
+(function() {
+  'use strict';
+
+  function flameGraph() {
+
+    var w = 960, // graph width
+      h = 540, // graph height
+      c = 18, // cell height
+      selection = null, // selection
+      tooltip = true, // enable tooltip
+      title = "", // graph title
+      transitionDuration = 750,
+      transitionEase = d3.easeCubic, // tooltip offset
+      sort = true,
+      reversed = false, // reverse the graph direction
+      clickHandler = null;
+
+    var tip = d3.tip()
+      .direction("s")
+      .offset([8, 0])
+      .attr('class', 'd3-flame-graph-tip')
+      .html(function(d) { return label(d); });
+
+    var svg;
+
+    var label = function(d) {
+      return d.data.name + " (" + d3.format(".3f")(100 * (d.x1 - d.x0), 3) + "%, " + d.data.value + " samples)";
+    };
+
+    function setDetails(t) {
+      var details = document.getElementById("details");
+      if (details)
+        details.innerHTML = t;
+    }
+
+    function name(d) {
+      return d.data.name;
+    }
+
+    var colorMapper = function(d) {
+      return d.highlight ? "#E600E6" : colorHash(d.data);
+    };
+
+    function generateHash(name) {
+      // Return a vector (0.0->1.0) that is a hash of the input string.
+      // The hash is computed to favor early characters over later ones, so
+      // that strings with similar starts have similar vectors. Only the first
+      // 6 characters are considered.
+      var hash = 0, weight = 1, max_hash = 0, mod = 10, max_char = 6;
+      if (name) {
+        for (var i = 0; i < name.length; i++) {
+          if (i > max_char) { break; }
+          hash += weight * (name.charCodeAt(i) % mod);
+          max_hash += weight * (mod - 1);
+          weight *= 0.70;
+        }
+        if (max_hash > 0) { hash = hash / max_hash; }
+      }
+      return hash;
+    }
+
+    function colorHash(data) {
+      var name = data.name;
+
+      if (data.color) {
+        return data.color;
+      }
+      // Return an rgb() color string that is a hash of the provided name,
+      // and with a warm palette.
+      var vector = 0;
+      if (name) {
+        name = name.replace(/.*`/, "");		// drop module name if present
+        name = name.replace(/\(.*/, "");	// drop extra info
+        vector = generateHash(name);
+      }
+      var r = 200 + Math.round(55 * vector);
+      var g = 0 + Math.round(230 * vector);
+      var b = 0 + Math.round(55 * vector);
+      data.color = "rgb(" + r + "," + g + "," + b + ")";
+      return data.color;
+    }
+
+    function hide(d) {
+      if(!d.data.original) {
+        d.data.original = d.data.value;
+      }
+      d.data.value = 0;
+      if(d.children) {
+        d.children.forEach(hide);
+      }
+    }
+
+    function show(d) {
+      d.data.fade = false;
+      if(d.data.original) {
+        d.data.value = d.data.original;
+      }
+      if(d.children) {
+        d.children.forEach(show);
+      }
+    }
+
+    function getSiblings(d) {
+      var siblings = [];
+      if (d.parent) {
+        var me = d.parent.children.indexOf(d);
+        siblings = d.parent.children.slice(0);
+        siblings.splice(me, 1);
+      }
+      return siblings;
+    }
+
+    function hideSiblings(d) {
+      var siblings = getSiblings(d);
+      siblings.forEach(function(s) {
+        hide(s);
+      });
+      if(d.parent) {
+        hideSiblings(d.parent);
+      }
+    }
+
+    function fadeAncestors(d) {
+      if(d.parent) {
+        d.parent.data.fade = true;
+        fadeAncestors(d.parent);
+      }
+    }
+
+    function getRoot(d) {
+      if(d.parent) {
+        return getRoot(d.parent);
+      }
+      return d;
+    }
+
+    function zoom(d) {
+      tip.hide(d);
+      hideSiblings(d);
+      show(d);
+      fadeAncestors(d);
+      update();
+      if (typeof clickHandler === 'function') {
+        clickHandler(d);
+      }
+    }
+
+    function searchTree(d, term) {
+      var re = new RegExp(term),
+          searchResults = [];
+
+      function searchInner(d) {
+        var label = d.data.name;
+
+        if (d.children) {
+          d.children.forEach(function (child) {
+            searchInner(child);
+          });
+        }
+
+        if (label.match(re)) {
+          d.highlight = true;
+          searchResults.push(d);
+        } else {
+          d.highlight = false;
+        }
+      }
+
+      searchInner(d);
+      return searchResults;
+    }
+
+    function clear(d) {
+      d.highlight = false;
+      if(d.children) {
+        d.children.forEach(function(child) {
+          clear(child);
+        });
+      }
+    }
+
+    function doSort(a, b) {
+      if (typeof sort === 'function') {
+        return sort(a, b);
+      } else if (sort) {
+        return d3.ascending(a.data.name, b.data.name);
+      } else {
+        return 0;
+      }
+    }
+
+    var partition = d3.partition();
+
+    function update() {
+
+      selection.each(function(root) {
+        var x = d3.scaleLinear().range([0, w]),
+            y = d3.scaleLinear().range([0, c]);
+
+        root.sort(doSort);
+        root.sum(function(d) {
+          if (d.fade) {
+            return 0;
+          }
+          // The node's self value is its total value minus all children.
+          var v = d.v || d.value || 0;
+          if (d.children) {
+            for (var i = 0; i < d.children.length; i++) {
+              v -= d.children[i].value;
+            }
+          }
+          return v;
+        });
+        partition(root);
+
+        var kx = w / (root.x1 - root.x0);
+        function width(d) { return (d.x1 - d.x0) * kx; }
+
+        var g = d3.select(this).select("svg").selectAll("g").data(root.descendants());
+
+        g.transition()
+          .duration(transitionDuration)
+          .ease(transitionEase)
+          .attr("transform", function(d) { return "translate(" + x(d.x0) + ","
+            + (reversed ? y(d.depth) : (h - y(d.depth) - c)) + ")"; });
+
+        g.select("rect").transition()
+          .duration(transitionDuration)
+          .ease(transitionEase)
+          .attr("width", width);
+
+        var node = g.enter()
+          .append("svg:g")
+          .attr("transform", function(d) { return "translate(" + x(d.x0) + ","
+            + (reversed ? y(d.depth) : (h - y(d.depth) - c)) + ")"; });
+
+        node.append("svg:rect").attr("width", width);
+
+        if (!tooltip)
+          node.append("svg:title");
+
+        node.append("foreignObject")
+          .append("xhtml:div");
+
+        // Now we have to re-select to see the new elements (why?).
+        g = d3.select(this).select("svg").selectAll("g").data(root.descendants());
+
+        g.attr("width", width)
+          .attr("height", function(d) { return c; })
+          .attr("name", function(d) { return d.data.name; })
+          .attr("class", function(d) { return d.data.fade ? "frame fade" : "frame"; });
+
+        g.select("rect")
+          .attr("height", function(d) { return c; })
+          .attr("fill", function(d) { return colorMapper(d); });
+
+        if (!tooltip)
+          g.select("title")
+            .text(label);
+
+        g.select("foreignObject")
+          .attr("width", width)
+          .attr("height", function(d) { return c; })
+          .select("div")
+          .attr("class", "label")
+          .style("display", function(d) { return (width(d) < 35) ? "none" : "block";})
+          .text(name);
+
+        g.on('click', zoom);
+
+        g.exit().remove();
+
+        g.on('mouseover', function(d) {
+          if (tooltip) tip.show(d);
+          setDetails(label(d));
+        }).on('mouseout', function(d) {
+          if (tooltip) tip.hide(d);
+          setDetails("");
+        });
+      });
+    }
+
+    function merge(data, samples) {
+      samples.forEach(function (sample) {
+        var node = _.find(data, function (element) {
+          return element.name === sample.name;
+        });
+
+        if (node) {
+          if (node.original) {
+            node.original += sample.value;
+          } else {
+            node.value += sample.value;
+          }
+          if (sample.children) {
+            if (!node.children) {
+              node.children = [];
+            }
+            merge(node.children, sample.children)
+          }
+        } else {
+          data.push(sample);
+        }
+      });
+    }
+
+    function chart(s) {
+      var root = d3.hierarchy(s.datum(), function(d) { return d.c || d.children; });
+      selection = s.datum(root);
+
+      if (!arguments.length) return chart;
+
+      selection.each(function(data) {
+
+	      if (!svg) {
+          svg = d3.select(this)
+            .append("svg:svg")
+            .attr("width", w)
+            .attr("height", h)
+            .attr("class", "partition d3-flame-graph")
+            .call(tip);
+
+          svg.append("svg:text")
+            .attr("class", "title")
+            .attr("text-anchor", "middle")
+            .attr("y", "25")
+            .attr("x", w/2)
+            .attr("fill", "#808080")
+            .text(title);
+        }
+      });
+
+      // first draw
+      update();
+    }
+
+    chart.height = function (_) {
+      if (!arguments.length) { return h; }
+      h = _;
+      return chart;
+    };
+
+    chart.width = function (_) {
+      if (!arguments.length) { return w; }
+      w = _;
+      return chart;
+    };
+
+    chart.cellHeight = function (_) {
+      if (!arguments.length) { return c; }
+      c = _;
+      return chart;
+    };
+
+    chart.tooltip = function (_) {
+      if (!arguments.length) { return tooltip; }
+      if (typeof _ === "function") {
+        tip = _;
+      }
+      tooltip = true;
+      return chart;
+    };
+
+    chart.title = function (_) {
+      if (!arguments.length) { return title; }
+      title = _;
+      return chart;
+    };
+
+    chart.transitionDuration = function (_) {
+      if (!arguments.length) { return transitionDuration; }
+      transitionDuration = _;
+      return chart;
+    };
+
+    chart.transitionEase = function (_) {
+      if (!arguments.length) { return transitionEase; }
+      transitionEase = _;
+      return chart;
+    };
+
+    chart.sort = function (_) {
+      if (!arguments.length) { return sort; }
+      sort = _;
+      return chart;
+    };
+
+    chart.reversed = function (_) {
+      if (!arguments.length) { return reversed; }
+      reversed = _;
+      return chart;
+    };
+
+    chart.label = function(_) {
+      if (!arguments.length) { return label; }
+      label = _;
+      return chart;
+    };
+
+    chart.search = function(term) {
+      var searchResults = [];
+      selection.each(function(data) {
+        searchResults = searchTree(data, term);
+        update();
+      });
+      return searchResults;
+    };
+
+    chart.clear = function() {
+      selection.each(function(data) {
+        clear(data);
+        update();
+      });
+    };
+
+    chart.zoomTo = function(d) {
+      zoom(d);
+    };
+
+    chart.resetZoom = function() {
+      selection.each(function (data) {
+        zoom(data); // zoom to root
+      });
+    };
+
+    chart.onClick = function(_) {
+      if (!arguments.length) {
+        return clickHandler;
+      }
+      clickHandler = _;
+      return chart;
+    };
+    
+    chart.merge = function(samples) {
+      var newRoot; // Need to re-create hierarchy after data changes.
+      selection.each(function (root) {
+        merge([root.data], [samples]);
+        newRoot = d3.hierarchy(root.data, function(d) { return d.c || d.children; });
+      });
+      selection = selection.datum(newRoot);
+      update();
+    }
+    
+    chart.color = function(_) {
+      if (!arguments.length) { return colorMapper; }
+      colorMapper = _;
+      return chart;
+    };
+
+    return chart;
+  }
+
+  if (typeof module !== 'undefined' && module.exports){
+		module.exports = flameGraph;
+	}
+	else {
+		d3.flameGraph = flameGraph;
+	}
+})();