Carga
Carga
This commit is contained in:
@@ -0,0 +1,902 @@
|
||||
/* *
|
||||
*
|
||||
* Highcharts Breadcrumbs module
|
||||
*
|
||||
* Authors: Grzegorz Blachlinski, Karol Kolodziej
|
||||
*
|
||||
* License: www.highcharts.com/license
|
||||
*
|
||||
* !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
|
||||
*
|
||||
* */
|
||||
'use strict';
|
||||
import Chart from '../Core/Chart/Chart.js';
|
||||
import H from '../Core/Globals.js';
|
||||
import D from '../Core/DefaultOptions.js';
|
||||
var defaultOptions = D.defaultOptions;
|
||||
import U from '../Core/Utilities.js';
|
||||
import F from '../Core/FormatUtilities.js';
|
||||
var format = F.format;
|
||||
var addEvent = U.addEvent, objectEach = U.objectEach, extend = U.extend, fireEvent = U.fireEvent, merge = U.merge, pick = U.pick, defined = U.defined, isString = U.isString;
|
||||
// Add language support.
|
||||
extend(defaultOptions.lang,
|
||||
/**
|
||||
* @optionparent lang
|
||||
*
|
||||
* @private
|
||||
*/
|
||||
{
|
||||
/**
|
||||
* @since 10.0.0
|
||||
* @product highcharts
|
||||
*
|
||||
* @private
|
||||
*/
|
||||
mainBreadcrumb: 'Main'
|
||||
});
|
||||
/**
|
||||
* The Breadcrumbs class
|
||||
*
|
||||
* @private
|
||||
* @class
|
||||
* @name Highcharts.Breadcrumbs
|
||||
*
|
||||
* @param {Highcharts.Chart} chart
|
||||
* Chart object
|
||||
* @param {Highcharts.Options} userOptions
|
||||
* User options
|
||||
*/
|
||||
var Breadcrumbs = /** @class */ (function () {
|
||||
function Breadcrumbs(chart, userOptions) {
|
||||
/* *
|
||||
*
|
||||
* Properties
|
||||
*
|
||||
* */
|
||||
this.group = void 0;
|
||||
this.list = [];
|
||||
this.elementList = {};
|
||||
this.isDirty = true;
|
||||
this.level = 0;
|
||||
this.options = void 0;
|
||||
var chartOptions = merge(chart.options.drilldown &&
|
||||
chart.options.drilldown.drillUpButton, Breadcrumbs.defaultBreadcrumbsOptions, chart.options.navigation && chart.options.navigation.breadcrumbs, userOptions);
|
||||
this.chart = chart;
|
||||
this.options = chartOptions || {};
|
||||
}
|
||||
/**
|
||||
* Update Breadcrumbs properties, like level and list.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#updateProperties
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.updateProperties = function (list) {
|
||||
this.setList(list);
|
||||
this.setLevel();
|
||||
this.isDirty = true;
|
||||
};
|
||||
/**
|
||||
* Set breadcrumbs list.
|
||||
* @function Highcharts.Breadcrumbs#setList
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
* @param {Highcharts.BreadcrumbsOptions} list
|
||||
* Breadcrumbs list.
|
||||
*/
|
||||
Breadcrumbs.prototype.setList = function (list) {
|
||||
this.list = list;
|
||||
};
|
||||
/**
|
||||
* Calcule level on which chart currently is.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#setLevel
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.setLevel = function () {
|
||||
this.level = this.list.length && this.list.length - 1;
|
||||
};
|
||||
/**
|
||||
* Get Breadcrumbs level
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#getLevel
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.getLevel = function () {
|
||||
return this.level;
|
||||
};
|
||||
/**
|
||||
* Default button text formatter.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#getButtonText
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
* @param {Highcharts.Breadcrumbs} breadcrumb
|
||||
* Breadcrumb.
|
||||
* @return {string}
|
||||
* Formatted text.
|
||||
*/
|
||||
Breadcrumbs.prototype.getButtonText = function (breadcrumb) {
|
||||
var breadcrumbs = this, chart = breadcrumbs.chart, breadcrumbsOptions = breadcrumbs.options, lang = chart.options.lang, textFormat = pick(breadcrumbsOptions.format, breadcrumbsOptions.showFullPath ?
|
||||
'{level.name}' : '← {level.name}'), defaultText = lang && pick(lang.drillUpText, lang.mainBreadcrumb);
|
||||
var returnText = breadcrumbsOptions.formatter &&
|
||||
breadcrumbsOptions.formatter(breadcrumb) ||
|
||||
format(textFormat, { level: breadcrumb.levelOptions }, chart) || '';
|
||||
if (((isString(returnText) &&
|
||||
!returnText.length) ||
|
||||
returnText === '← ') &&
|
||||
defined(defaultText)) {
|
||||
returnText = !breadcrumbsOptions.showFullPath ?
|
||||
'← ' + defaultText :
|
||||
defaultText;
|
||||
}
|
||||
return returnText;
|
||||
};
|
||||
/**
|
||||
* Redraw.
|
||||
*
|
||||
* @requires modules/breadcrums
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#redraw
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.redraw = function () {
|
||||
if (this.isDirty) {
|
||||
this.render();
|
||||
}
|
||||
if (this.group) {
|
||||
this.group.align();
|
||||
}
|
||||
this.isDirty = false;
|
||||
};
|
||||
/**
|
||||
* Create a group, then draw breadcrumbs together with the separators.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#render
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.render = function () {
|
||||
var breadcrumbs = this, chart = breadcrumbs.chart, breadcrumbsOptions = breadcrumbs.options;
|
||||
// A main group for the breadcrumbs.
|
||||
if (!breadcrumbs.group && breadcrumbsOptions) {
|
||||
breadcrumbs.group = chart.renderer
|
||||
.g('breadcrumbs-group')
|
||||
.addClass('highcharts-no-tooltip highcharts-breadcrumbs')
|
||||
.attr({
|
||||
zIndex: breadcrumbsOptions.zIndex
|
||||
})
|
||||
.add();
|
||||
}
|
||||
// Draw breadcrumbs.
|
||||
if (breadcrumbsOptions.showFullPath) {
|
||||
this.renderFullPathButtons();
|
||||
}
|
||||
else {
|
||||
this.renderSingleButton();
|
||||
}
|
||||
this.alignBreadcrumbsGroup();
|
||||
};
|
||||
/**
|
||||
* Draw breadcrumbs together with the separators.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#renderFullPathButtons
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.renderFullPathButtons = function () {
|
||||
// Make sure that only one type of button is visible.
|
||||
this.destroySingleButton();
|
||||
this.resetElementListState();
|
||||
this.updateListElements();
|
||||
this.destroyListElements();
|
||||
};
|
||||
/**
|
||||
* Render Single button - when showFullPath is not used. The button is
|
||||
* similar to the old drillUpButton
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#renderSingleButton
|
||||
* @param {Highcharts.Breadcrumbs} this Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.renderSingleButton = function () {
|
||||
var breadcrumbs = this, chart = breadcrumbs.chart, list = breadcrumbs.list, breadcrumbsOptions = breadcrumbs.options, buttonSpacing = breadcrumbsOptions.buttonSpacing;
|
||||
// Make sure that only one type of button is visible.
|
||||
this.destroyListElements();
|
||||
// Draw breadcrumbs. Inital position for calculating the breadcrumbs
|
||||
// group.
|
||||
var posX = breadcrumbs.group ?
|
||||
breadcrumbs.group.getBBox().width :
|
||||
buttonSpacing, posY = buttonSpacing;
|
||||
var previousBreadcrumb = list[list.length - 2];
|
||||
if (!chart.drillUpButton && (this.level > 0)) {
|
||||
chart.drillUpButton = breadcrumbs.renderButton(previousBreadcrumb, posX, posY);
|
||||
}
|
||||
else if (chart.drillUpButton) {
|
||||
if (this.level > 0) {
|
||||
// Update button.
|
||||
this.updateSingleButton();
|
||||
}
|
||||
else {
|
||||
this.destroySingleButton();
|
||||
}
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Update group position based on align and it's width.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#renderSingleButton
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.alignBreadcrumbsGroup = function (xOffset) {
|
||||
var breadcrumbs = this;
|
||||
if (breadcrumbs.group) {
|
||||
var breadcrumbsOptions = breadcrumbs.options, buttonTheme = breadcrumbsOptions.buttonTheme, positionOptions = breadcrumbsOptions.position, alignTo = (breadcrumbsOptions.relativeTo === 'chart' ||
|
||||
breadcrumbsOptions.relativeTo === 'spacingBox' ?
|
||||
void 0 :
|
||||
'scrollablePlotBox'), bBox = breadcrumbs.group.getBBox(), additionalSpace = 2 * (buttonTheme.padding || 0) +
|
||||
breadcrumbsOptions.buttonSpacing;
|
||||
// Store positionOptions
|
||||
positionOptions.width = bBox.width + additionalSpace;
|
||||
positionOptions.height = bBox.height + additionalSpace;
|
||||
var newPositions = merge(positionOptions);
|
||||
// Add x offset if specified.
|
||||
if (xOffset) {
|
||||
newPositions.x += xOffset;
|
||||
}
|
||||
if (breadcrumbs.options.rtl) {
|
||||
newPositions.x += positionOptions.width;
|
||||
}
|
||||
newPositions.y = pick(newPositions.y, this.yOffset, 0);
|
||||
breadcrumbs.group.align(newPositions, true, alignTo);
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Render a button.
|
||||
*
|
||||
* @requires modules/breadcrums
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#renderButton
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
* @param {Highcharts.Breadcrumbs} breadcrumb
|
||||
* Current breadcrumb
|
||||
* @param {Highcharts.Breadcrumbs} posX
|
||||
* Initial horizontal position
|
||||
* @param {Highcharts.Breadcrumbs} posY
|
||||
* Initial vertical position
|
||||
* @return {SVGElement|void}
|
||||
* Returns the SVG button
|
||||
*/
|
||||
Breadcrumbs.prototype.renderButton = function (breadcrumb, posX, posY) {
|
||||
var breadcrumbs = this, chart = this.chart, breadcrumbsOptions = breadcrumbs.options, buttonTheme = merge(breadcrumbsOptions.buttonTheme);
|
||||
var button = chart.renderer
|
||||
.button(breadcrumbs.getButtonText(breadcrumb), posX, posY, function (e) {
|
||||
// Extract events from button object and call
|
||||
var buttonEvents = breadcrumbsOptions.events &&
|
||||
breadcrumbsOptions.events.click;
|
||||
var callDefaultEvent;
|
||||
if (buttonEvents) {
|
||||
callDefaultEvent = buttonEvents.call(breadcrumbs, e, breadcrumb);
|
||||
}
|
||||
// (difference in behaviour of showFullPath and drillUp)
|
||||
if (callDefaultEvent !== false) {
|
||||
// For single button we are not going to the button
|
||||
// level, but the one level up
|
||||
if (!breadcrumbsOptions.showFullPath) {
|
||||
e.newLevel = breadcrumbs.level - 1;
|
||||
}
|
||||
else {
|
||||
e.newLevel = breadcrumb.level;
|
||||
}
|
||||
fireEvent(breadcrumbs, 'up', e);
|
||||
}
|
||||
}, buttonTheme)
|
||||
.addClass('highcharts-breadcrumbs-button')
|
||||
.add(breadcrumbs.group);
|
||||
if (!chart.styledMode) {
|
||||
button.attr(breadcrumbsOptions.style);
|
||||
}
|
||||
return button;
|
||||
};
|
||||
/**
|
||||
* Render a separator.
|
||||
*
|
||||
* @requires modules/breadcrums
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#renderSeparator
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
* @param {Highcharts.Breadcrumbs} posX
|
||||
* Initial horizontal position
|
||||
* @param {Highcharts.Breadcrumbs} posY
|
||||
* Initial vertical position
|
||||
* @return {Highcharts.SVGElement}
|
||||
* Returns the SVG button
|
||||
*/
|
||||
Breadcrumbs.prototype.renderSeparator = function (posX, posY) {
|
||||
var breadcrumbs = this, chart = this.chart, breadcrumbsOptions = breadcrumbs.options, separatorOptions = breadcrumbsOptions.separator;
|
||||
var separator = chart.renderer
|
||||
.label(separatorOptions.text, posX, posY, void 0, void 0, void 0, false)
|
||||
.addClass('highcharts-breadcrumbs-separator')
|
||||
.add(breadcrumbs.group);
|
||||
if (!chart.styledMode) {
|
||||
separator.css(separatorOptions.style);
|
||||
}
|
||||
return separator;
|
||||
};
|
||||
/**
|
||||
* Update.
|
||||
* @function Highcharts.Breadcrumbs#update
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
* @param {Highcharts.BreadcrumbsOptions} options
|
||||
* Breadcrumbs class.
|
||||
* @param {boolean} redraw
|
||||
* Redraw flag
|
||||
*/
|
||||
Breadcrumbs.prototype.update = function (options) {
|
||||
merge(true, this.options, options);
|
||||
this.destroy();
|
||||
this.isDirty = true;
|
||||
};
|
||||
/**
|
||||
* Update button text when the showFullPath set to false.
|
||||
* @function Highcharts.Breadcrumbs#updateSingleButton
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.updateSingleButton = function () {
|
||||
var chart = this.chart, currentBreadcrumb = this.list[this.level - 1];
|
||||
if (chart.drillUpButton) {
|
||||
chart.drillUpButton.attr({
|
||||
text: this.getButtonText(currentBreadcrumb)
|
||||
});
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Destroy the chosen breadcrumbs group
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#destroy
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.destroy = function () {
|
||||
this.destroySingleButton();
|
||||
// Destroy elements one by one. It's necessary beacause
|
||||
// g().destroy() does not remove added HTML
|
||||
this.destroyListElements(true);
|
||||
// Then, destroy the group itself.
|
||||
if (this.group) {
|
||||
this.group.destroy();
|
||||
}
|
||||
this.group = void 0;
|
||||
};
|
||||
/**
|
||||
* Destroy the elements' buttons and separators.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#destroyListElements
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.destroyListElements = function (force) {
|
||||
var elementList = this.elementList;
|
||||
objectEach(elementList, function (element, level) {
|
||||
if (force ||
|
||||
!elementList[level].updated) {
|
||||
element = elementList[level];
|
||||
element.button && element.button.destroy();
|
||||
element.separator && element.separator.destroy();
|
||||
delete element.button;
|
||||
delete element.separator;
|
||||
delete elementList[level];
|
||||
}
|
||||
});
|
||||
if (force) {
|
||||
this.elementList = {};
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Destroy the single button if exists.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#destroySingleButton
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.destroySingleButton = function () {
|
||||
if (this.chart.drillUpButton) {
|
||||
this.chart.drillUpButton.destroy();
|
||||
this.chart.drillUpButton = void 0;
|
||||
}
|
||||
};
|
||||
/**
|
||||
* Reset state for all buttons in elementList.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#resetElementListState
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.resetElementListState = function () {
|
||||
objectEach(this.elementList, function (element) {
|
||||
element.updated = false;
|
||||
});
|
||||
};
|
||||
/**
|
||||
* Update rendered elements inside the elementList.
|
||||
*
|
||||
* @requires modules/breadcrumbs
|
||||
*
|
||||
* @function Highcharts.Breadcrumbs#updateListElements
|
||||
* @param {Highcharts.Breadcrumbs} this
|
||||
* Breadcrumbs class.
|
||||
*/
|
||||
Breadcrumbs.prototype.updateListElements = function () {
|
||||
var breadcrumbs = this, elementList = breadcrumbs.elementList, buttonSpacing = breadcrumbs.options.buttonSpacing, list = breadcrumbs.list, rtl = breadcrumbs.options.rtl, rtlFactor = rtl ? -1 : 1, updateXPosition = function (element, spacing) {
|
||||
return rtlFactor * element.getBBox().width +
|
||||
rtlFactor * spacing;
|
||||
}, adjustToRTL = function (element, posX, posY) {
|
||||
element.translate(posX - element.getBBox().width, posY);
|
||||
};
|
||||
// Inital position for calculating the breadcrumbs group.
|
||||
var posX = breadcrumbs.group ?
|
||||
updateXPosition(breadcrumbs.group, buttonSpacing) :
|
||||
buttonSpacing, posY = buttonSpacing, currentBreadcrumb;
|
||||
list.forEach(function (breadcrumb, index) {
|
||||
var isLast = index === list.length - 1;
|
||||
var button, separator;
|
||||
if (elementList[breadcrumb.level]) {
|
||||
currentBreadcrumb = elementList[breadcrumb.level];
|
||||
button = currentBreadcrumb.button;
|
||||
// Render a separator if it was not created before.
|
||||
if (!currentBreadcrumb.separator &&
|
||||
!isLast) {
|
||||
// Add spacing for the next separator
|
||||
posX += rtlFactor * buttonSpacing;
|
||||
currentBreadcrumb.separator =
|
||||
breadcrumbs.renderSeparator(posX, posY);
|
||||
if (rtl) {
|
||||
adjustToRTL(currentBreadcrumb.separator, posX, posY);
|
||||
}
|
||||
posX += updateXPosition(currentBreadcrumb.separator, buttonSpacing);
|
||||
}
|
||||
else if (currentBreadcrumb.separator &&
|
||||
isLast) {
|
||||
currentBreadcrumb.separator.destroy();
|
||||
delete currentBreadcrumb.separator;
|
||||
}
|
||||
elementList[breadcrumb.level].updated = true;
|
||||
}
|
||||
else {
|
||||
// Render a button.
|
||||
button = breadcrumbs.renderButton(breadcrumb, posX, posY);
|
||||
if (rtl) {
|
||||
adjustToRTL(button, posX, posY);
|
||||
}
|
||||
posX += updateXPosition(button, buttonSpacing);
|
||||
// Render a separator.
|
||||
if (!isLast) {
|
||||
separator = breadcrumbs.renderSeparator(posX, posY);
|
||||
if (rtl) {
|
||||
adjustToRTL(separator, posX, posY);
|
||||
}
|
||||
posX += updateXPosition(separator, buttonSpacing);
|
||||
}
|
||||
elementList[breadcrumb.level] = {
|
||||
button: button,
|
||||
separator: separator,
|
||||
updated: true
|
||||
};
|
||||
}
|
||||
if (button) {
|
||||
button.setState(isLast ? 2 : 0);
|
||||
}
|
||||
});
|
||||
};
|
||||
/**
|
||||
* Options for breadcrumbs. Breadcrumbs general options are defined in
|
||||
* `navigation.breadcrumbs`. Specific options for drilldown are set in
|
||||
* `drilldown.breadcrumbs` and for tree-like series traversing, in
|
||||
* `plotOptions[series].breadcrumbs`.
|
||||
*
|
||||
* @since 10.0.0
|
||||
* @product highcharts
|
||||
* @optionparent navigation.breadcrumbs
|
||||
*/
|
||||
Breadcrumbs.defaultBreadcrumbsOptions = {
|
||||
/**
|
||||
* A collection of attributes for the buttons. The object takes SVG
|
||||
* attributes like `fill`, `stroke`, `stroke-width`, as well as `style`,
|
||||
* a collection of CSS properties for the text.
|
||||
*
|
||||
* The object can also be extended with states, so you can set
|
||||
* presentational options for `hover`, `select` or `disabled` button
|
||||
* states.
|
||||
*
|
||||
* @sample {highcharts} highcharts/breadcrumbs/single-button
|
||||
* Themed, single button
|
||||
*
|
||||
* @type {Highcharts.SVGAttributes}
|
||||
* @since 10.0.0
|
||||
* @product highcharts
|
||||
*/
|
||||
buttonTheme: {
|
||||
/** @ignore */
|
||||
fill: 'none',
|
||||
/** @ignore */
|
||||
height: 18,
|
||||
/** @ignore */
|
||||
padding: 2,
|
||||
/** @ignore */
|
||||
'stroke-width': 0,
|
||||
/** @ignore */
|
||||
zIndex: 7,
|
||||
/** @ignore */
|
||||
states: {
|
||||
select: {
|
||||
fill: 'none'
|
||||
}
|
||||
},
|
||||
style: {
|
||||
color: "#335cad" /* Palette.highlightColor80 */
|
||||
}
|
||||
},
|
||||
/**
|
||||
* The default padding for each button and separator in each direction.
|
||||
*
|
||||
* @type {number}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
buttonSpacing: 5,
|
||||
/**
|
||||
* Fires when clicking on the breadcrumbs button. Two arguments are
|
||||
* passed to the function. First breadcrumb button as an SVG element.
|
||||
* Second is the breadcrumbs class, containing reference to the chart,
|
||||
* series etc.
|
||||
*
|
||||
* ```js
|
||||
* click: function(button, breadcrumbs) {
|
||||
* console.log(button);
|
||||
* }
|
||||
* ```
|
||||
*
|
||||
* Return false to stop default buttons click action.
|
||||
*
|
||||
* @type {Highcharts.BreadcrumbsClickCallbackFunction}
|
||||
* @since 10.0.0
|
||||
* @apioption navigation.breadcrumbs.events.click
|
||||
*/
|
||||
/**
|
||||
* When the breadcrumbs are floating, the plot area will not move to
|
||||
* make space for it. By default, the chart will not make space for the
|
||||
* buttons. This property won't work when positioned in the middle.
|
||||
*
|
||||
* @sample highcharts/breadcrumbs/single-button
|
||||
* Floating button
|
||||
* @type {boolean}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
floating: false,
|
||||
/**
|
||||
* A format string for the breadcrumbs button. Variables are enclosed by
|
||||
* curly brackets. Available values are passed in the declared point
|
||||
* options.
|
||||
*
|
||||
* @type {string|undefined}
|
||||
* @since 10.0.0
|
||||
* @default undefined
|
||||
* @sample {highcharts} highcharts/breadcrumbs/format Display custom
|
||||
* values in breadcrumb button.
|
||||
*/
|
||||
format: void 0,
|
||||
/**
|
||||
* Callback function to format the breadcrumb text from scratch.
|
||||
*
|
||||
* @type {Highcharts.BreadcrumbsFormatterCallbackFunction}
|
||||
* @since 10.0.0
|
||||
* @default undefined
|
||||
* @apioption navigation.breadcrumbs.formatter
|
||||
*/
|
||||
/**
|
||||
* What box to align the button to. Can be either `plotBox` or
|
||||
* `spacingBox`.
|
||||
*
|
||||
* @type {Highcharts.ButtonRelativeToValue}
|
||||
* @default plotBox
|
||||
* @since 10.0.0
|
||||
* @product highcharts highmaps
|
||||
*/
|
||||
relativeTo: 'plotBox',
|
||||
/**
|
||||
* Whether to reverse the order of buttons. This is common in Arabic
|
||||
* and Hebrew.
|
||||
*
|
||||
* @type {boolean}
|
||||
* @since 10.2.0
|
||||
* @sample {highcharts} highcharts/breadcrumbs/rtl
|
||||
* Breadcrumbs in RTL
|
||||
*/
|
||||
rtl: false,
|
||||
/**
|
||||
* Positioning for the button row. The breadcrumbs buttons will be
|
||||
* aligned properly for the default chart layout (title, subtitle,
|
||||
* legend, range selector) for the custom chart layout set the position
|
||||
* properties.
|
||||
* @type {Highcharts.BreadcrumbsAlignOptions}
|
||||
* @since 10.0.0
|
||||
* @product highcharts highmaps
|
||||
* @sample {highcharts} highcharts/breadcrumbs/single-button
|
||||
* Single, right aligned button
|
||||
*/
|
||||
position: {
|
||||
/**
|
||||
* Horizontal alignment of the breadcrumbs buttons.
|
||||
*
|
||||
* @type {Highcharts.AlignValue}
|
||||
*/
|
||||
align: 'left',
|
||||
/**
|
||||
* Vertical alignment of the breadcrumbs buttons.
|
||||
*
|
||||
* @type {Highcharts.VerticalAlignValue}
|
||||
*/
|
||||
verticalAlign: 'top',
|
||||
/**
|
||||
* The X offset of the breadcrumbs button group.
|
||||
*
|
||||
* @type {number}
|
||||
*/
|
||||
x: 0,
|
||||
/**
|
||||
* The Y offset of the breadcrumbs button group. When `undefined`,
|
||||
* and `floating` is `false`, the `y` position is adapted so that
|
||||
* the breadcrumbs are rendered outside the target area.
|
||||
*
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
y: void 0
|
||||
},
|
||||
/**
|
||||
* Options object for Breadcrumbs separator.
|
||||
*
|
||||
* @since 10.0.0
|
||||
*/
|
||||
separator: {
|
||||
/**
|
||||
* @type {string}
|
||||
* @since 10.0.0
|
||||
* @product highcharts
|
||||
*/
|
||||
text: '/',
|
||||
/**
|
||||
* CSS styles for the breadcrumbs separator.
|
||||
*
|
||||
* In styled mode, the breadcrumbs separators are styled by the
|
||||
* `.highcharts-separator` rule with its different states.
|
||||
* @type {Highcharts.CSSObject}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
style: {
|
||||
color: "#666666" /* Palette.neutralColor60 */
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Show full path or only a single button.
|
||||
*
|
||||
* @type {boolean}
|
||||
* @since 10.0.0
|
||||
* @sample {highcharts} highcharts/breadcrumbs/single-button
|
||||
* Single, styled button
|
||||
*/
|
||||
showFullPath: true,
|
||||
/**
|
||||
* CSS styles for all breadcrumbs.
|
||||
*
|
||||
* In styled mode, the breadcrumbs buttons are styled by the
|
||||
* `.highcharts-breadcrumbs-buttons .highcharts-button` rule with its
|
||||
* different states.
|
||||
* @type {Highcharts.SVGAttributes}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
style: {},
|
||||
/**
|
||||
* Whether to use HTML to render the breadcrumbs items texts.
|
||||
*
|
||||
* @type {boolean}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
useHTML: false,
|
||||
/**
|
||||
* The z index of the breadcrumbs group.
|
||||
*
|
||||
* @type {number}
|
||||
* @since 10.0.0
|
||||
*/
|
||||
zIndex: 7
|
||||
};
|
||||
return Breadcrumbs;
|
||||
}());
|
||||
/* eslint-disable no-invalid-this */
|
||||
if (!H.Breadcrumbs) {
|
||||
H.Breadcrumbs = Breadcrumbs;
|
||||
// Logic for making space for the buttons above the plot area
|
||||
addEvent(Chart, 'getMargins', function () {
|
||||
var breadcrumbs = this.breadcrumbs;
|
||||
if (breadcrumbs &&
|
||||
!breadcrumbs.options.floating &&
|
||||
breadcrumbs.level) {
|
||||
var breadcrumbsOptions = breadcrumbs.options, buttonTheme = breadcrumbsOptions.buttonTheme, breadcrumbsHeight = ((buttonTheme.height || 0) +
|
||||
2 * (buttonTheme.padding || 0) +
|
||||
breadcrumbsOptions.buttonSpacing), verticalAlign = breadcrumbsOptions.position.verticalAlign;
|
||||
if (verticalAlign === 'bottom') {
|
||||
this.marginBottom = (this.marginBottom || 0) + breadcrumbsHeight;
|
||||
breadcrumbs.yOffset = breadcrumbsHeight;
|
||||
}
|
||||
else if (verticalAlign !== 'middle') {
|
||||
this.plotTop += breadcrumbsHeight;
|
||||
breadcrumbs.yOffset = -breadcrumbsHeight;
|
||||
}
|
||||
else {
|
||||
breadcrumbs.yOffset = void 0;
|
||||
}
|
||||
}
|
||||
});
|
||||
addEvent(Chart, 'redraw', function () {
|
||||
this.breadcrumbs && this.breadcrumbs.redraw();
|
||||
});
|
||||
// Remove resize/afterSetExtremes at chart destroy
|
||||
addEvent(Chart, 'destroy', function destroyEvents() {
|
||||
if (this.breadcrumbs) {
|
||||
this.breadcrumbs.destroy();
|
||||
this.breadcrumbs = void 0;
|
||||
}
|
||||
});
|
||||
// Shift the drillUpButton to make the space for resetZoomButton, #8095.
|
||||
addEvent(Chart, 'afterShowResetZoom', function () {
|
||||
var chart = this;
|
||||
if (chart.breadcrumbs) {
|
||||
var bbox = chart.resetZoomButton &&
|
||||
chart.resetZoomButton.getBBox(), breadcrumbsOptions = chart.breadcrumbs.options;
|
||||
if (bbox &&
|
||||
breadcrumbsOptions.position.align === 'right' &&
|
||||
breadcrumbsOptions.relativeTo === 'plotBox') {
|
||||
chart.breadcrumbs.alignBreadcrumbsGroup(-bbox.width - breadcrumbsOptions.buttonSpacing);
|
||||
}
|
||||
}
|
||||
});
|
||||
// After zooming out, shift the drillUpButton
|
||||
// to the previous position, #8095.
|
||||
addEvent(Chart, 'selection', function (event) {
|
||||
if (event.resetSelection === true &&
|
||||
this.breadcrumbs) {
|
||||
this.breadcrumbs.alignBreadcrumbsGroup();
|
||||
}
|
||||
});
|
||||
}
|
||||
/* *
|
||||
*
|
||||
* Default Export
|
||||
*
|
||||
* */
|
||||
export default Breadcrumbs;
|
||||
/* *
|
||||
*
|
||||
* API Declarations
|
||||
*
|
||||
* */
|
||||
/**
|
||||
* Callback function to react on button clicks.
|
||||
*
|
||||
* @callback Highcharts.BreadcrumbsClickCallbackFunction
|
||||
*
|
||||
* @param {Highcharts.Event} event
|
||||
* Event.
|
||||
*
|
||||
* @param {Highcharts.BreadcrumbOptions} options
|
||||
* Breadcrumb options.
|
||||
*
|
||||
* @param {global.Event} e
|
||||
* Event arguments.
|
||||
*/
|
||||
/**
|
||||
* Callback function to format the breadcrumb text from scratch.
|
||||
*
|
||||
* @callback Highcharts.BreadcrumbsFormatterCallbackFunction
|
||||
*
|
||||
* @param {Highcharts.Event} event
|
||||
* Event.
|
||||
*
|
||||
* @param {Highcharts.BreadcrumbOptions} options
|
||||
* Breadcrumb options.
|
||||
*
|
||||
* @return {string}
|
||||
* Formatted text or false
|
||||
*/
|
||||
/**
|
||||
* Options for the one breadcrumb.
|
||||
*
|
||||
* @interface Highcharts.BreadcrumbOptions
|
||||
*/
|
||||
/**
|
||||
* Level connected to a specific breadcrumb.
|
||||
* @name Highcharts.BreadcrumbOptions#level
|
||||
* @type {number}
|
||||
*/
|
||||
/**
|
||||
* Options for series or point connected to a specific breadcrumb.
|
||||
* @name Highcharts.BreadcrumbOptions#levelOptions
|
||||
* @type {SeriesOptions|PointOptionsObject}
|
||||
*/
|
||||
/**
|
||||
* Options for aligning breadcrumbs group.
|
||||
*
|
||||
* @interface Highcharts.BreadcrumbsAlignOptions
|
||||
*/
|
||||
/**
|
||||
* Align of a Breadcrumb group.
|
||||
* @default right
|
||||
* @name Highcharts.BreadcrumbsAlignOptions#align
|
||||
* @type {AlignValue}
|
||||
*/
|
||||
/**
|
||||
* Vertical align of a Breadcrumb group.
|
||||
* @default top
|
||||
* @name Highcharts.BreadcrumbsAlignOptions#verticalAlign
|
||||
* @type {VerticalAlignValue}
|
||||
*/
|
||||
/**
|
||||
* X offset of a Breadcrumbs group.
|
||||
* @name Highcharts.BreadcrumbsAlignOptions#x
|
||||
* @type {number}
|
||||
*/
|
||||
/**
|
||||
* Y offset of a Breadcrumbs group.
|
||||
* @name Highcharts.BreadcrumbsAlignOptions#y
|
||||
* @type {number}
|
||||
*/
|
||||
/**
|
||||
* Options for all breadcrumbs.
|
||||
*
|
||||
* @interface Highcharts.BreadcrumbsOptions
|
||||
*/
|
||||
/**
|
||||
* Button theme.
|
||||
* @name Highcharts.BreadcrumbsOptions#buttonTheme
|
||||
* @type { SVGAttributes | undefined }
|
||||
*/
|
||||
(''); // Keeps doclets above in JS file
|
||||
Reference in New Issue
Block a user