Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
d3-flame-graph
Advanced tools
d3-flame-graph - npm Package Compare versions
Comparing version 2.0.2 to 2.0.3
| { | ||
| "name": "d3-flame-graph", | ||
| "version": "2.0.2", | ||
| "version": "2.0.3", | ||
| "description": "A d3.js library to produce flame graphs.", | ||
@@ -5,0 +5,0 @@ "main": "dist/d3-flamegraph.js", |
126
README.md
@@ -17,2 +17,4 @@ # d3-flame-graph | ||
| Click [here](http://spiermar.github.io/d3-flame-graph/differential.html) to check the differential flame graph demo, and [source](https://github.com/spiermar/d3-flame-graph/blob/gh-pages/differential.html) | ||
| Click [here](http://spiermar.github.io/d3-flame-graph/live.html) to check the animated assembly demo, and [source](https://github.com/spiermar/d3-flame-graph/blob/gh-pages/live.html) | ||
@@ -30,11 +32,11 @@ | ||
| <head> | ||
| <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.0.0/dist/d3-flamegraph.css"> | ||
| <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.0.2/dist/d3-flamegraph.css"> | ||
| </head> | ||
| <body> | ||
| <div id="chart"></div> | ||
| <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.10.0/d3.min.js"></script> | ||
| <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3-tip/0.7.1/d3-tip.min.js"></script> | ||
| <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.0.0/dist/d3-flamegraph.min.js"></script> | ||
| <script type="text/javascript" src="https://d3js.org/d3.v4.min.js"></script> | ||
| <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3-tip/0.9.1/d3-tip.min.js"></script> | ||
| <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@2.0.2/dist/d3-flamegraph.min.js"></script> | ||
| <script type="text/javascript"> | ||
| var flamegraph = d3.flameGraph() | ||
| var flamegraph = d3.flamegraph() | ||
| .width(960); | ||
@@ -74,3 +76,3 @@ | ||
| <script type="text/javascript"> | ||
| var flamegraph = d3.flameGraph() | ||
| var flamegraph = d3.flamegraph() | ||
| .width(960); | ||
@@ -88,3 +90,3 @@ | ||
| More detailed examples in the [/example](/example) directory. | ||
| More detailed examples in the [/examples](/examples) directory. | ||
@@ -128,33 +130,33 @@ ## Input Format | ||
| <a name="flameGraph" href="#flameGraph">#</a> d3.flameGraph() | ||
| <a name="flamegraph" href="#flamegraph">#</a> d3.flamegraph() | ||
| Create a new Flame Graph. | ||
| <a name="selfValue" href="#selfValue">#</a> flameGraph.<b>selfValue</b>(<i>[enabled]</i>) | ||
| <a name="selfValue" href="#selfValue">#</a> flamegraph.<b>selfValue</b>(<i>[enabled]</i>) | ||
| Defines if the plugin should use the self value logic to calculate the node value for the Flame Graph frame size. If set to `true`, it will assume the node value from the input callgraph represents only the internal node value, or self value, not the sum of all children. If set to `false` it will assume the value includes the chidren values too. Defaults to `false` if not explicitely set, which if the same behavior 1.x had. | ||
| <a name="width" href="#width">#</a> flameGraph.<b>width</b>(<i>[size]</i>) | ||
| <a name="width" href="#width">#</a> flamegraph.<b>width</b>(<i>[size]</i>) | ||
| Graph width in px. Defaults to 960px if not set. If <i>size</i> is specified, it will set the graph width, otherwise it will return the flameGraph object. | ||
| Graph width in px. Defaults to 960px if not set. If <i>size</i> is specified, it will set the graph width, otherwise it will return the current graph width. | ||
| <a name="height" href="#height">#</a> flameGraph.<b>height</b>(<i>[size]</i>) | ||
| <a name="height" href="#height">#</a> flamegraph.<b>height</b>(<i>[size]</i>) | ||
| Graph height in px. Defaults to the number of cell rows times <a name="cellHeight" href="#cellHeight"><b>cellHeight</b></a> if not set. If <i>size</i> is specified, it will set the cell height, otherwise it will return the flameGraph object. | ||
| Graph height in px. Defaults to the number of cell rows times <a name="cellHeight" href="#cellHeight"><b>cellHeight</b></a> if not set. If <i>size</i> is specified, it will set the cell height, otherwise it will return the current graph height. | ||
| <a name="cellHeight" href="#cellHeight">#</a> flameGraph.<b>cellHeight</b>(<i>[size]</i>) | ||
| <a name="cellHeight" href="#cellHeight">#</a> flamegraph.<b>cellHeight</b>(<i>[size]</i>) | ||
| Cell height in px. Defaults to 18px if not set. If <i>size</i> is specified, it will set the cell height, otherwise it will return the flameGraph object. | ||
| Cell height in px. Defaults to 18px if not set. If <i>size</i> is specified, it will set the cell height, otherwise it will return the current cell height. | ||
| <a name="minFrameSize" href="#minFrameSize">#</a> flameGraph.<b>minFrameSize</b>(<i>[size]</i>) | ||
| <a name="minFrameSize" href="#minFrameSize">#</a> flamegraph.<b>minFrameSize</b>(<i>[size]</i>) | ||
| Minimum size of a frame, in px, to be displayed in the flame graph. Defaults to 0px if not set. If <i>size</i> is specified, it will set the minimum frame size, otherwise it will return the flameGraph object. | ||
| Minimum size of a frame, in px, to be displayed in the flame graph. Defaults to 0px if not set. If <i>size</i> is specified, it will set the minimum frame size, otherwise it will return the current minimum frame size. | ||
| <a name="title" href="#title">#</a> flameGraph.<b>title</b>(<i>[title]</i>) | ||
| <a name="title" href="#title">#</a> flamegraph.<b>title</b>(<i>[title]</i>) | ||
| Title displayed on top of graph. Defaults to empty if not set. If <i>title</i> is specified, it will set the title displayed on the graph, otherwise it will return the flameGraph object. | ||
| Title displayed on top of graph. Defaults to empty if not set. If <i>title</i> is specified, it will set the title displayed on the graph, otherwise it will return the current title. | ||
| <a name="tooltip" href="#tooltip">#</a> flameGraph.<b>tooltip</b>(<i>[enabled]</i>) | ||
| <a name="tooltip" href="#tooltip">#</a> flamegraph.<b>tooltip</b>(<i>[enabled]</i>) | ||
| Enables/disables display of tooltips on frames. Defaults to <i>true</i> if not set. It can be set to a [d3-tip configurable function](https://github.com/Caged/d3-tip/blob/master/docs/initializing-tooltips.md), which will replace the default function and display a fully customized tooltip. Else, if a truthy value, uses a default label function. If a value is specified, it will enable/disable tooltips, otherwise it will return the flameGraph object. | ||
| Enables/disables display of tooltips on frames. Defaults to <i>true</i> if not set. It can be set to a [d3-tip configurable function](https://github.com/Caged/d3-tip/blob/master/docs/initializing-tooltips.md), which will replace the default function and display a fully customized tooltip. Else, if a truthy value, uses a default label function. If a value is specified, it will enable/disable tooltips, otherwise it will return the current tooltip configuration. | ||
@@ -169,9 +171,9 @@ Class should be specified in order to correctly render the tooltip. The default "d3-flame-graph-tip" is available for use too. | ||
| <a name="transitionDuration" href="#transitionDuration">#</a> flameGraph.<b>transitionDuration</b>(<i>[duration]</i>) | ||
| <a name="transitionDuration" href="#transitionDuration">#</a> flamegraph.<b>transitionDuration</b>(<i>[duration]</i>) | ||
| Specifies transition duration in milliseconds. The default duration is 750ms. If <i>duration</i> is not specified, returns the flameGraph object. | ||
| Specifies transition duration in milliseconds. The default duration is 750ms. If <i>duration</i> is not specified, returns the current transition duration. | ||
| See [d3.duration](https://github.com/mbostock/d3/wiki/Transitions#duration). | ||
| <a name="transitionEase" href="#transitionEase">#</a> flameGraph.<b>transitionEase</b>(<i>[ease]</i>) | ||
| <a name="transitionEase" href="#transitionEase">#</a> flamegraph.<b>transitionEase</b>(<i>[ease]</i>) | ||
@@ -182,3 +184,3 @@ Specifies the transition easing function. The default easing function is `d3.easeCubic`. | ||
| <a name="label" href="#label">#</a> flameGraph.<b>label</b>(<i>[function]</i>) | ||
| <a name="label" href="#label">#</a> flamegraph.<b>label</b>(<i>[function]</i>) | ||
@@ -188,3 +190,3 @@ Adds a function that returns a formatted label. Example: | ||
| ```js | ||
| flameGraph.label(function(d) { | ||
| flamegraph.label(function(d) { | ||
| return "name: " + d.name + ", value: " + d.value; | ||
@@ -194,11 +196,15 @@ }); | ||
| <a name="sort" href="#sort">#</a> flameGraph.<b>sort</b>(<i>[enabled]</i>) | ||
| <a name="sort" href="#sort">#</a> flamegraph.<b>sort</b>(<i>[enabled]</i>) | ||
| Enables/disables sorting of children frames. Defaults to <i>true</i> if not set to sort in ascending order by frame's name. If set to a function, the function takes two frames (a,b) and returns -1 if frame a is less than b, 1 if greater, or 0 if equal. If a value is specified, it will enable/disable sorting, otherwise it will return the flameGraph object. | ||
| Enables/disables sorting of children frames. Defaults to <i>true</i> if not set to sort in ascending order by frame's name. If set to a function, the function takes two frames (a,b) and returns -1 if frame a is less than b, 1 if greater, or 0 if equal. If a value is specified, it will enable/disable sorting, otherwise it will return the current sort configuration. | ||
| <a name="resetZoom" href="#resetZoom">#</a> flameGraph.<b>resetZoom</b>() | ||
| <a name="inverted" href="#inverted">#</a> flamegraph.<b>inverted</b>(<i>[inverted]</i>) | ||
| Invert the flame graph direction. A top-down visualization of the flame graph, also known as _icicle_ plot. Defaults to <i>false</i> if not set. If a value is specified, it will enable/disable the inverted flame graphs direction, otherwise it will return the current inverted configuration. | ||
| <a name="resetZoom" href="#resetZoom">#</a> flamegraph.<b>resetZoom</b>() | ||
| Resets the zoom so that everything is visible. | ||
| <a name="onClick" href="#onClick">#</a> flameGraph.<b>onClick</b>(<i>[function]</i>) | ||
| <a name="onClick" href="#onClick">#</a> flamegraph.<b>onClick</b>(<i>[function]</i>) | ||
@@ -208,3 +214,3 @@ Adds a function that will be called when the user clicks on a frame. Example: | ||
| ```js | ||
| flameGraph.onClick(function (d) { | ||
| flamegraph.onClick(function (d) { | ||
| console.info("You clicked on frame "+ d.data.name); | ||
@@ -216,3 +222,3 @@ }); | ||
| <a name="details" href="#details">#</a> flameGraph.<b>details</b>(<i>[element]</i>) | ||
| <a name="setDetailsElement" href="#setDetailsElement">#</a> flamegraph.<b>setDetailsElement</b>(<i>[element]</i>) | ||
@@ -227,18 +233,56 @@ Sets the element that should be updated with the focused sample details text. Example: | ||
| ```js | ||
| flameGraph.details(document.getElementById("details")); | ||
| flamegraph.setDetailsElement(document.getElementById("details")); | ||
| ``` | ||
| If called with no arguments, `details` will return the flameGraph object. | ||
| If called with no arguments, `setDetailsElement` will return the current details element. | ||
| <a name="inverted" href="#inverted">#</a> flameGraph.<b>inverted</b>(<i>[inverted]</i>) | ||
| <a name="setDetailsHandler" href="#setDetailsHandler">#</a> flamegraph.<b>setDetailsHandler</b>(<i>[function]</i>) | ||
| Invert the flame graph direction. A top-down visualization of the flame graph, also known as _icicle_ plot. Defaults to <i>false</i> if not set. If a value is specified, it will enable/disable the inverted flame graphs direction, otherwise it will return the flameGraph object. | ||
| Sets the handler function that is called when the `details` element needs to be updated. The function receives a single paramenter, the details text to be set. Example: | ||
| <a name="color" href="#color">#</a> flameGraph.<b>color</b>(<i>[function]</i>) | ||
| ```js | ||
| flamegraph.setDetailsHandler( | ||
| function (d) { | ||
| if (detailsElement) { | ||
| if (d) { | ||
| detailsElement.innerHTML = d | ||
| } else { | ||
| if (searchSum) { | ||
| setSearchDetails() | ||
| } else { | ||
| detailsElement.innerHTML = '' | ||
| } | ||
| } | ||
| } | ||
| } | ||
| ); | ||
| ``` | ||
| Replaces the built-in node color hash function. Function should take a single argument, the node data structure, and returns a color string. Example: | ||
| If not set, `setDetailsHandler` will default to the above function. | ||
| If called with no arguments, `setDetailsHandler` will reset the details handler function. | ||
| <a name="setSearchHandler" href="#setSearchHandler">#</a> flamegraph.<b>setSearchHandler</b>(<i>[function]</i>) | ||
| Sets the handler function that is called when search results are returned. The function receives a three paramenters, the search results array, the search sample sum, and root value, Example: | ||
| ```js | ||
| flamegraph.setSearchHandler( | ||
| function (searchResults, searchSum, totalValue) { | ||
| if (detailsElement) { detailsElement.innerHTML = `${searchSum} of ${totalValue} samples (${format('.3f')(100 * (searchSum / totalValue), 3)}%)`} | ||
| } | ||
| ); | ||
| ``` | ||
| If not set, `setSearchHandler` will default to the above function. | ||
| If called with no arguments, `setSearchHandler` will reset the search handler function. | ||
| <a name="setColorMapper" href="#setColorMapper">#</a> flamegraph.<b>setColorMapper</b>(<i>[function]</i>) | ||
| Replaces the built-in node color hash function. Function takes a single argument, the node data structure, and returns a color string. Example: | ||
| ```js | ||
| // Purple if highlighted, otherwise a static blue. | ||
| flameGraph.color(function(d) { | ||
| flamegraph.setColorMapper(function(d) { | ||
| return d.highlight ? "#E600E6" : "#0A5BC4"; | ||
@@ -248,4 +292,6 @@ }); | ||
| If called with no arguments, `color` will return the flameGraph object. | ||
| If called with no arguments, `setColorMapper` will return reset the color hash function. | ||
| **All API functions will return the flame graph object if no other behavior is specified in the function details.** | ||
| ## Issues | ||
@@ -252,0 +298,0 @@ |
@@ -23,6 +23,33 @@ import { select } from 'd3-selection' | ||
| var minFrameSize = 0 | ||
| var details = null | ||
| var detailsElement = null | ||
| var selfValue = false | ||
| var differential = false | ||
| var searchSum = 0 | ||
| var totalValue = 0 | ||
| var maxDelta = 0 | ||
| var searchHandler = function () { | ||
| if (detailsElement) { setSearchDetails() } | ||
| } | ||
| var originalSearchHandler = searchHandler | ||
| var detailsHandler = function (d) { | ||
| if (detailsElement) { | ||
| if (d) { | ||
| detailsElement.innerHTML = d | ||
| } else { | ||
| if (searchSum) { | ||
| setSearchDetails() | ||
| } else { | ||
| detailsElement.innerHTML = '' | ||
| } | ||
| } | ||
| } | ||
| } | ||
| var originalDetailsHandler = detailsHandler | ||
| var labelHandler = function (d) { | ||
| return getName(d) + ' (' + format('.3f')(100 * (d.x1 - d.x0), 3) + '%, ' + getValue(d) + ' samples)' | ||
| } | ||
| var tip = d3Tip() | ||
@@ -32,37 +59,34 @@ .direction('s') | ||
| .attr('class', 'd3-flame-graph-tip') | ||
| .html(function (d) { return label(d) }) | ||
| .html(function (d) { return labelHandler(d) }) | ||
| var svg | ||
| function name (d) { | ||
| function getName (d) { | ||
| return d.data.n || d.data.name | ||
| } | ||
| function libtype (d) { | ||
| return d.data.l || d.data.libtype | ||
| function getValue (d) { | ||
| return d.v || d.value | ||
| } | ||
| function getDelta (d) { | ||
| return d.data.d || d.data.delta | ||
| } | ||
| function children (d) { | ||
| function getChildren (d) { | ||
| return d.c || d.children | ||
| } | ||
| function value (d) { | ||
| return d.v || d.value | ||
| function getLibtype (d) { | ||
| return d.data.l || d.data.libtype | ||
| } | ||
| var label = function (d) { | ||
| return name(d) + ' (' + format('.3f')(100 * (d.x1 - d.x0), 3) + '%, ' + value(d) + ' samples)' | ||
| function getDelta (d) { | ||
| return d.data.d || d.data.delta | ||
| } | ||
| function setDetails (t) { | ||
| if (details) { details.innerHTML = t } | ||
| function setSearchDetails () { | ||
| detailsElement.innerHTML = `${searchSum} of ${totalValue} samples (${format('.3f')(100 * (searchSum / totalValue), 3)}%)` | ||
| } | ||
| var colorMapper = function (d) { | ||
| return d.highlight ? '#E600E6' : colorHash(name(d), libtype(d), getDelta(d)) | ||
| return d.highlight ? '#E600E6' : colorHash(getName(d), getLibtype(d), getDelta(d)) | ||
| } | ||
| var originalColorMapper = colorMapper | ||
@@ -181,4 +205,4 @@ function generateHash (name) { | ||
| d.data.hide = true | ||
| if (children(d)) { | ||
| children(d).forEach(hide) | ||
| if (getChildren(d)) { | ||
| getChildren(d).forEach(hide) | ||
| } | ||
@@ -190,4 +214,4 @@ } | ||
| d.data.hide = false | ||
| if (children(d)) { | ||
| children(d).forEach(show) | ||
| if (getChildren(d)) { | ||
| getChildren(d).forEach(show) | ||
| } | ||
@@ -199,4 +223,4 @@ } | ||
| if (d.parent) { | ||
| var me = d.parent.children.indexOf(d) | ||
| siblings = d.parent.children.slice(0) | ||
| var me = getChildren(d.parent).indexOf(d) | ||
| siblings = getChildren(d.parent).slice(0) | ||
| siblings.splice(me, 1) | ||
@@ -244,23 +268,30 @@ } | ||
| var re = new RegExp(term) | ||
| var searchResults = [] | ||
| var results = [] | ||
| var sum = 0 | ||
| function searchInner (d) { | ||
| var label = name(d) | ||
| function searchInner (d, foundParent) { | ||
| var label = getName(d) | ||
| var found = false | ||
| if (children(d)) { | ||
| children(d).forEach(function (child) { | ||
| searchInner(child) | ||
| }) | ||
| } | ||
| if (typeof label !== 'undefined' && label && label.match(re)) { | ||
| d.highlight = true | ||
| searchResults.push(d) | ||
| found = true | ||
| if (!foundParent) { | ||
| sum += getValue(d) | ||
| } | ||
| results.push(d) | ||
| } else { | ||
| d.highlight = false | ||
| } | ||
| if (getChildren(d)) { | ||
| getChildren(d).forEach(function (child) { | ||
| searchInner(child, (foundParent || found)) | ||
| }) | ||
| } | ||
| } | ||
| searchInner(d) | ||
| return searchResults | ||
| searchInner(d, false) | ||
| searchSum = sum | ||
| searchHandler(results, sum, totalValue) | ||
| } | ||
@@ -270,4 +301,4 @@ | ||
| d.highlight = false | ||
| if (children(d)) { | ||
| children(d).forEach(function (child) { | ||
| if (getChildren(d)) { | ||
| getChildren(d).forEach(function (child) { | ||
| clear(child) | ||
@@ -282,3 +313,3 @@ }) | ||
| } else if (sort) { | ||
| return ascending(name(a), name(b)) | ||
| return ascending(getName(a), getName(b)) | ||
| } | ||
@@ -311,7 +342,7 @@ } | ||
| // The node's self value is its total value minus all children. | ||
| var v = value(d) | ||
| if (!selfValue && children(d)) { | ||
| var c = children(d) | ||
| var v = getValue(d) | ||
| if (!selfValue && getChildren(d)) { | ||
| var c = getChildren(d) | ||
| for (var i = 0; i < c.length; i++) { | ||
| v -= value(c[i]) | ||
| v -= getValue(c[i]) | ||
| } | ||
@@ -342,2 +373,5 @@ } | ||
| g.select('rect') | ||
| .transition() | ||
| .duration(transitionDuration) | ||
| .ease(transitionEase) | ||
| .attr('width', width) | ||
@@ -364,3 +398,3 @@ | ||
| .attr('height', function (d) { return c }) | ||
| .attr('name', function (d) { return name(d) }) | ||
| .attr('name', function (d) { return getName(d) }) | ||
| .attr('class', function (d) { return d.data.fade ? 'frame fade' : 'frame' }) | ||
@@ -374,3 +408,3 @@ | ||
| g.select('title') | ||
| .text(label) | ||
| .text(labelHandler) | ||
| } | ||
@@ -386,3 +420,3 @@ | ||
| .delay(transitionDuration) | ||
| .text(name) | ||
| .text(getName) | ||
@@ -396,6 +430,6 @@ g.on('click', zoom) | ||
| if (tooltip) tip.show(d, this) | ||
| setDetails(label(d)) | ||
| detailsHandler(labelHandler(d)) | ||
| }).on('mouseout', function (d) { | ||
| if (tooltip) tip.hide(d) | ||
| setDetails('') | ||
| detailsHandler(null) | ||
| }) | ||
@@ -437,3 +471,3 @@ }) | ||
| node.id = s4() + '-' + s4() + '-' + '-' + s4() + '-' + s4() | ||
| var children = node.c || node.children || [] | ||
| var children = getChildren(node) || [] | ||
| for (var i = 0; i < children.length; i++) { | ||
@@ -444,8 +478,6 @@ injectIds(children[i]) | ||
| var maxDelta = 0 | ||
| function calculateMaxDelta (node) { | ||
| var delta = Math.abs(getDelta(node)) | ||
| maxDelta = delta > maxDelta ? delta : maxDelta | ||
| var children = node.c || node.children || [] | ||
| var children = getChildren(node) || [] | ||
| for (var i = 0; i < children.length; i++) { | ||
@@ -458,6 +490,8 @@ calculateMaxDelta(children[i]) | ||
| var root = hierarchy( | ||
| s.datum(), function (d) { return children(d) } | ||
| s.datum(), function (d) { return getChildren(d) } | ||
| ) | ||
| injectIds(root) | ||
| totalValue = getValue(root) | ||
| if (differential) { | ||
@@ -557,18 +591,20 @@ calculateMaxDelta(root) | ||
| chart.label = function (_) { | ||
| if (!arguments.length) { return label } | ||
| label = _ | ||
| chart.setLabelHandler = function (_) { | ||
| if (!arguments.length) { return labelHandler } | ||
| labelHandler = _ | ||
| return chart | ||
| } | ||
| // Kept for backwards compatibility. | ||
| chart.label = chart.setLabelHandler | ||
| chart.search = function (term) { | ||
| var searchResults = [] | ||
| selection.each(function (data) { | ||
| searchResults = searchTree(data, term) | ||
| searchTree(data, term) | ||
| update() | ||
| }) | ||
| return searchResults | ||
| } | ||
| chart.clear = function () { | ||
| searchSum = 0 | ||
| detailsHandler(null) | ||
| selection.each(function (data) { | ||
@@ -602,3 +638,3 @@ clear(data) | ||
| merge([root.data], [samples]) | ||
| newRoot = hierarchy(root.data, function (d) { return children(d) }) | ||
| newRoot = hierarchy(root.data, function (d) { return getChildren(d) }) | ||
| injectIds(newRoot) | ||
@@ -610,7 +646,12 @@ }) | ||
| chart.color = function (_) { | ||
| if (!arguments.length) { return colorMapper } | ||
| chart.setColorMapper = function (_) { | ||
| if (!arguments.length) { | ||
| colorMapper = originalColorMapper | ||
| return chart | ||
| } | ||
| colorMapper = _ | ||
| return chart | ||
| } | ||
| // Kept for backwards compatibility. | ||
| chart.color = chart.setColorMapper | ||
@@ -623,7 +664,9 @@ chart.minFrameSize = function (_) { | ||
| chart.details = function (_) { | ||
| if (!arguments.length) { return details } | ||
| details = _ | ||
| chart.setDetailsElement = function (_) { | ||
| if (!arguments.length) { return detailsElement } | ||
| detailsElement = _ | ||
| return chart | ||
| } | ||
| // Kept for backwards compatibility. | ||
| chart.details = chart.setDetailsElement | ||
@@ -636,3 +679,21 @@ chart.selfValue = function (_) { | ||
| chart.setSearchHandler = function (_) { | ||
| if (!arguments.length) { | ||
| searchHandler = originalSearchHandler | ||
| return chart | ||
| } | ||
| searchHandler = _ | ||
| return chart | ||
| } | ||
| chart.setDetailsHandler = function (_) { | ||
| if (!arguments.length) { | ||
| detailsHandler = originalDetailsHandler | ||
| return chart | ||
| } | ||
| detailsHandler = _ | ||
| return chart | ||
| } | ||
| return chart | ||
| } |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.08%
12286053
- Number of package files
- increased by14.29%
24
- Lines of code
- increased by1.24%
9122
- Number of lines in readme file
- increased by16.91%
318
No dependency changes