highcharts
Version:
JavaScript charting framework
341 lines (326 loc) • 12.7 kB
JavaScript
/**
* @license Highcharts JS v12.2.0 (2025-04-07)
* @module highcharts/modules/textpath-support
* @requires highcharts
*
* (c) 2009-2025 Torstein Honsi
*
* License: www.highcharts.com/license
*/
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(root["_Highcharts"]);
else if(typeof define === 'function' && define.amd)
define("highcharts/modules/textpath", ["highcharts/highcharts"], function (amd1) {return factory(amd1);});
else if(typeof exports === 'object')
exports["highcharts/modules/textpath"] = factory(root["_Highcharts"]);
else
root["Highcharts"] = factory(root["Highcharts"]);
})(typeof window === 'undefined' ? this : window, (__WEBPACK_EXTERNAL_MODULE__944__) => {
return /******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ 944:
/***/ ((module) => {
module.exports = __WEBPACK_EXTERNAL_MODULE__944__;
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = (module) => {
/******/ var getter = module && module.__esModule ?
/******/ () => (module['default']) :
/******/ () => (module);
/******/ __webpack_require__.d(getter, { a: getter });
/******/ return getter;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// EXPORTS
__webpack_require__.d(__webpack_exports__, {
"default": () => (/* binding */ textpath_src)
});
// EXTERNAL MODULE: external {"amd":["highcharts/highcharts"],"commonjs":["highcharts"],"commonjs2":["highcharts"],"root":["Highcharts"]}
var highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_ = __webpack_require__(944);
var highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_default = /*#__PURE__*/__webpack_require__.n(highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_);
;// ./code/es-modules/Extensions/TextPath.js
/* *
*
* Highcharts module with textPath functionality.
*
* (c) 2009-2025 Torstein Honsi
*
* License: www.highcharts.com/license
*
* !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
*
* */
const { deg2rad } = (highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_default());
const { addEvent, merge, uniqueKey, defined, extend } = (highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_default());
/**
* Set a text path for a `text` or `label` element, allowing the text to
* flow along a path.
*
* In order to unset the path for an existing element, call `setTextPath`
* with `{ enabled: false }` as the second argument.
*
* Text path support is not bundled into `highcharts.js`, and requires the
* `modules/textpath.js` file. However, it is included in the script files of
* those series types that use it by default
*
* @sample highcharts/members/renderer-textpath/ Text path demonstrated
*
* @function Highcharts.SVGElement#setTextPath
*
* @param {Highcharts.SVGElement|undefined} path
* Path to follow. If undefined, it allows changing options for the
* existing path.
*
* @param {Highcharts.DataLabelsTextPathOptionsObject} textPathOptions
* Options.
*
* @return {Highcharts.SVGElement} Returns the SVGElement for chaining.
*/
function setTextPath(path, textPathOptions) {
// Defaults
textPathOptions = merge(true, {
enabled: true,
attributes: {
dy: -5,
startOffset: '50%',
textAnchor: 'middle'
}
}, textPathOptions);
const url = this.renderer.url, textWrapper = this.text || this, textPath = textWrapper.textPath, { attributes, enabled } = textPathOptions;
path = path || (textPath && textPath.path);
// Remove previously added event
if (textPath) {
textPath.undo();
}
if (path && enabled) {
const undo = addEvent(textWrapper, 'afterModifyTree', (e) => {
if (path && enabled) {
// Set ID for the path
let textPathId = path.attr('id');
if (!textPathId) {
path.attr('id', textPathId = uniqueKey());
}
// Set attributes for the <text>
const textAttribs = {
// `dx`/`dy` options must by set on <text> (parent), the
// rest should be set on <textPath>
x: 0,
y: 0
};
if (defined(attributes.dx)) {
textAttribs.dx = attributes.dx;
delete attributes.dx;
}
if (defined(attributes.dy)) {
textAttribs.dy = attributes.dy;
delete attributes.dy;
}
textWrapper.attr(textAttribs);
// Handle label properties
this.attr({ transform: '' });
if (this.box) {
this.box = this.box.destroy();
}
// Wrap the nodes in a textPath
const children = e.nodes.slice(0);
e.nodes.length = 0;
e.nodes[0] = {
tagName: 'textPath',
attributes: extend(attributes, {
'text-anchor': attributes.textAnchor,
href: `${url}#${textPathId}`
}),
children
};
}
});
// Set the reference
textWrapper.textPath = { path, undo };
}
else {
textWrapper.attr({ dx: 0, dy: 0 });
delete textWrapper.textPath;
}
if (this.added) {
// Rebuild text after added
textWrapper.textCache = '';
this.renderer.buildText(textWrapper);
}
return this;
}
/**
* Attach a polygon to a bounding box if the element contains a textPath.
*
* @function Highcharts.SVGElement#setPolygon
*
* @param {any} event
* An event containing a bounding box object
*
* @return {Highcharts.BBoxObject} Returns the bounding box object.
*/
function setPolygon(event) {
const bBox = event.bBox, tp = this.element?.querySelector('textPath');
if (tp) {
const polygon = [], { b, h } = this.renderer.fontMetrics(this.element), descender = h - b, lineCleanerRegex = new RegExp('(<tspan>|' +
'<tspan(?!\\sclass="highcharts-br")[^>]*>|' +
'<\\/tspan>)', 'g'), lines = tp
.innerHTML
.replace(lineCleanerRegex, '')
.split(/<tspan class="highcharts-br"[^>]*>/), numOfLines = lines.length;
// Calculate top and bottom coordinates for
// either the start or the end of a single
// character, and append it to the polygon.
const appendTopAndBottom = (charIndex, positionOfChar) => {
const { x, y } = positionOfChar, rotation = (tp.getRotationOfChar(charIndex) - 90) * deg2rad, cosRot = Math.cos(rotation), sinRot = Math.sin(rotation);
return [
[
x - descender * cosRot,
y - descender * sinRot
],
[
x + b * cosRot,
y + b * sinRot
]
];
};
for (let i = 0, lineIndex = 0; lineIndex < numOfLines; lineIndex++) {
const line = lines[lineIndex], lineLen = line.length;
for (let lineCharIndex = 0; lineCharIndex < lineLen; lineCharIndex += 5) {
try {
const srcCharIndex = (i +
lineCharIndex +
lineIndex), [lower, upper] = appendTopAndBottom(srcCharIndex, tp.getStartPositionOfChar(srcCharIndex));
if (lineCharIndex === 0) {
polygon.push(upper);
polygon.push(lower);
}
else {
if (lineIndex === 0) {
polygon.unshift(upper);
}
if (lineIndex === numOfLines - 1) {
polygon.push(lower);
}
}
}
catch (e) {
// Safari fails on getStartPositionOfChar even if the
// character is within the `textContent.length`
break;
}
}
i += lineLen - 1;
try {
const srcCharIndex = i + lineIndex, charPos = tp.getEndPositionOfChar(srcCharIndex), [lower, upper] = appendTopAndBottom(srcCharIndex, charPos);
polygon.unshift(upper);
polygon.unshift(lower);
}
catch (e) {
// Safari fails on getStartPositionOfChar even if the character
// is within the `textContent.length`
break;
}
}
// Close it
if (polygon.length) {
polygon.push(polygon[0].slice());
}
bBox.polygon = polygon;
}
return bBox;
}
/**
* Draw text along a textPath for a dataLabel.
*
* @function Highcharts.SVGElement#setTextPath
*
* @param {any} event
* An event containing label options
*
* @return {void}
*/
function drawTextPath(event) {
const labelOptions = event.labelOptions, point = event.point, textPathOptions = (labelOptions[point.formatPrefix + 'TextPath'] ||
labelOptions.textPath);
if (textPathOptions && !labelOptions.useHTML) {
this.setTextPath(point.getDataLabelPath?.(this) || point.graphic, textPathOptions);
if (point.dataLabelPath &&
!textPathOptions.enabled) {
// Clean the DOM
point.dataLabelPath = (point.dataLabelPath.destroy());
}
}
}
function compose(SVGElementClass) {
addEvent(SVGElementClass, 'afterGetBBox', setPolygon);
addEvent(SVGElementClass, 'beforeAddingDataLabel', drawTextPath);
const svgElementProto = SVGElementClass.prototype;
if (!svgElementProto.setTextPath) {
svgElementProto.setTextPath = setTextPath;
}
}
const TextPath = {
compose
};
/* harmony default export */ const Extensions_TextPath = (TextPath);
;// ./code/es-modules/masters/modules/textpath.src.js
const G = (highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_default());
G.TextPath = Extensions_TextPath;
G.TextPath.compose(G.SVGElement);
/* harmony default export */ const textpath_src = ((highcharts_commonjs_highcharts_commonjs2_highcharts_root_Highcharts_default()));
__webpack_exports__ = __webpack_exports__["default"];
/******/ return __webpack_exports__;
/******/ })()
;
});