diff --git a/packages/core/src/components/essentials/tooltip-bar.ts b/packages/core/src/components/essentials/tooltip-bar.ts index 2f3f40a5ba..81dce64954 100644 --- a/packages/core/src/components/essentials/tooltip-bar.ts +++ b/packages/core/src/components/essentials/tooltip-bar.ts @@ -31,23 +31,25 @@ export class TooltipBar extends Tooltip { const hoveredElement = e.detail.hoveredElement.node(); - // if there is a provided tooltip HTML function - if (Tools.getProperty(this.model.getOptions(), "tooltip", "customHTML")) { - tooltipTextContainer.html(this.model.getOptions().tooltip.customHTML(hoveredElement)); - } else if (e.detail.multidata) { + let defaultTooltip; + if (e.detail.multidata) { // multi tooltip - tooltipTextContainer.html(this.getMultilineTooltipHTML(e.detail.multidata)); - // Position the tooltip - this.positionTooltip(); + defaultTooltip = this.getMultilineTooltipHTML(e.detail.multidata) } else { - const data = e.detail.hoveredElement.datum(); - tooltipTextContainer.html(this.getTooltipHTML(data)); - - const position = this.getTooltipPosition(hoveredElement); + defaultTooltip = this.getTooltipHTML(e.detail.hoveredElement.datum()) + } - // Position the tooltip relative to the bars - this.positionTooltip(position); + // if there is a provided tooltip HTML function call it and pass the defaultTooltip + if (Tools.getProperty(this.model.getOptions(), "tooltip", "customHTML")) { + tooltipTextContainer.html(this.model.getOptions().tooltip.customHTML(hoveredElement, defaultTooltip)); + } else { + // default tooltip + tooltipTextContainer.html(defaultTooltip); } + + const position = this.getTooltipPosition(hoveredElement); + // Position the tooltip relative to the bars + this.positionTooltip(e.detail.multidata ? undefined : position ); // Fade in this.tooltip.classed("hidden", false); } diff --git a/packages/core/src/interfaces/components.ts b/packages/core/src/interfaces/components.ts index 4ef69e69b6..231e0da700 100644 --- a/packages/core/src/interfaces/components.ts +++ b/packages/core/src/interfaces/components.ts @@ -55,6 +55,7 @@ export interface TooltipOptions { formatter?: Function; /** * custom function for returning tooltip HTML + * passed an array or object with the data, and then the default tooltip markup */ customHTML?: Function; /** diff --git a/packages/core/webpack.config.js b/packages/core/webpack.config.js index 82194926a3..7bc2d7ce6d 100644 --- a/packages/core/webpack.config.js +++ b/packages/core/webpack.config.js @@ -80,7 +80,7 @@ module.exports = { devServer: { contentBase: "./demo", host: "0.0.0.0", - port: 9001, + port: process.env.PORT || 9001, historyApiFallback: true, disableHostCheck: true }