@carbon/charts 0.33.0 → 0.34.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +45 -1
- package/axis-chart.d.ts +2 -2
- package/axis-chart.js +6 -4
- package/axis-chart.js.map +1 -1
- package/build/demo/data/bar.d.ts +12 -48
- package/build/demo/data/bubble.d.ts +1 -0
- package/build/src/axis-chart.d.ts +2 -2
- package/build/src/chart.d.ts +2 -2
- package/build/src/components/axes/ruler-stacked-bar.d.ts +4 -0
- package/build/src/components/axes/ruler.d.ts +6 -1
- package/build/src/components/essentials/tooltip-axis.d.ts +4 -0
- package/build/src/components/essentials/tooltip.d.ts +4 -10
- package/build/src/components/index.d.ts +2 -4
- package/build/src/configuration.d.ts +1 -3
- package/build/src/interfaces/a11y.d.ts +2 -1
- package/build/src/interfaces/charts.d.ts +1 -3
- package/build/src/interfaces/components.d.ts +7 -52
- package/build/src/interfaces/enums.d.ts +0 -10
- package/build/src/interfaces/events.d.ts +1 -0
- package/build/src/services/scales-cartesian.d.ts +6 -1
- package/bundle.js +1 -1
- package/chart.d.ts +2 -2
- package/chart.js +2 -1
- package/chart.js.map +1 -1
- package/charts/area-stacked.js +1 -3
- package/charts/area-stacked.js.map +1 -1
- package/charts/area.js +1 -2
- package/charts/area.js.map +1 -1
- package/charts/bar-grouped.js +1 -2
- package/charts/bar-grouped.js.map +1 -1
- package/charts/bar-simple.js +1 -2
- package/charts/bar-simple.js.map +1 -1
- package/charts/bar-stacked.js +2 -2
- package/charts/bar-stacked.js.map +1 -1
- package/charts/bubble.js +1 -2
- package/charts/bubble.js.map +1 -1
- package/charts/donut.js +1 -2
- package/charts/donut.js.map +1 -1
- package/charts/gauge.js +1 -2
- package/charts/gauge.js.map +1 -1
- package/charts/line.js +1 -2
- package/charts/line.js.map +1 -1
- package/charts/pie.js +1 -4
- package/charts/pie.js.map +1 -1
- package/charts/radar.js +0 -3
- package/charts/radar.js.map +1 -1
- package/charts/scatter.js +1 -2
- package/charts/scatter.js.map +1 -1
- package/components/axes/axis.js +23 -8
- package/components/axes/axis.js.map +1 -1
- package/components/axes/grid.js.map +1 -1
- package/components/axes/ruler-stacked-bar.d.ts +4 -0
- package/components/axes/ruler-stacked-bar.js +26 -0
- package/components/axes/ruler-stacked-bar.js.map +1 -0
- package/components/axes/ruler.d.ts +6 -1
- package/components/axes/ruler.js +25 -13
- package/components/axes/ruler.js.map +1 -1
- package/components/essentials/legend.js +15 -14
- package/components/essentials/legend.js.map +1 -1
- package/components/essentials/threshold.js +2 -2
- package/components/essentials/threshold.js.map +1 -1
- package/components/essentials/title.js +10 -9
- package/components/essentials/title.js.map +1 -1
- package/components/essentials/tooltip-axis.d.ts +4 -0
- package/components/essentials/tooltip-axis.js +120 -0
- package/components/essentials/tooltip-axis.js.map +1 -0
- package/components/essentials/tooltip.d.ts +4 -10
- package/components/essentials/tooltip.js +73 -100
- package/components/essentials/tooltip.js.map +1 -1
- package/components/graphs/area-stacked.js.map +1 -1
- package/components/graphs/bar-grouped.js +5 -3
- package/components/graphs/bar-grouped.js.map +1 -1
- package/components/graphs/bar-simple.js +4 -2
- package/components/graphs/bar-simple.js.map +1 -1
- package/components/graphs/bar-stacked.js +17 -14
- package/components/graphs/bar-stacked.js.map +1 -1
- package/components/graphs/pie.js +31 -12
- package/components/graphs/pie.js.map +1 -1
- package/components/graphs/radar.js +23 -18
- package/components/graphs/radar.js.map +1 -1
- package/components/graphs/scatter-stacked.js.map +1 -1
- package/components/graphs/scatter.js +18 -13
- package/components/graphs/scatter.js.map +1 -1
- package/components/graphs/skeleton.js +2 -5
- package/components/graphs/skeleton.js.map +1 -1
- package/components/index.d.ts +2 -4
- package/components/index.js +2 -4
- package/components/index.js.map +1 -1
- package/components/layout/layout.js +3 -1
- package/components/layout/layout.js.map +1 -1
- package/configuration.d.ts +1 -3
- package/configuration.js +6 -26
- package/configuration.js.map +1 -1
- package/demo/data/bar.d.ts +12 -48
- package/demo/data/bar.js +22 -58
- package/demo/data/bar.js.map +1 -1
- package/demo/data/bubble.d.ts +1 -0
- package/demo/data/bubble.js +2 -1
- package/demo/data/bubble.js.map +1 -1
- package/demo/data/bundle.js +1 -1
- package/demo/data/index.js +1 -1
- package/demo/data/index.js.map +1 -1
- package/demo/data/line.js +5 -5
- package/demo/data/line.js.map +1 -1
- package/demo/styles.css +48 -100
- package/demo/styles.css.map +1 -1
- package/demo/styles.min.css +1 -1
- package/demo/styles.min.css.map +1 -1
- package/demo/tsconfig.tsbuildinfo +16 -16
- package/interfaces/a11y.d.ts +2 -1
- package/interfaces/a11y.js +1 -0
- package/interfaces/a11y.js.map +1 -1
- package/interfaces/charts.d.ts +1 -3
- package/interfaces/charts.js.map +1 -1
- package/interfaces/components.d.ts +7 -52
- package/interfaces/components.js.map +1 -1
- package/interfaces/enums.d.ts +0 -10
- package/interfaces/enums.js +0 -11
- package/interfaces/enums.js.map +1 -1
- package/interfaces/events.d.ts +1 -0
- package/interfaces/events.js +1 -0
- package/interfaces/events.js.map +1 -1
- package/model.js +3 -5
- package/model.js.map +1 -1
- package/package.json +1 -1
- package/services/essentials/dom-utils.js +3 -1
- package/services/essentials/dom-utils.js.map +1 -1
- package/services/scales-cartesian.d.ts +6 -1
- package/services/scales-cartesian.js +20 -1
- package/services/scales-cartesian.js.map +1 -1
- package/styles/components/_ruler.scss +0 -6
- package/styles/components/_tooltip.scss +3 -9
- package/styles/graphs/_scatter-stacked.scss +10 -0
- package/styles/graphs/index.scss +1 -0
- package/styles-g10.css +13 -25
- package/styles-g10.css.map +1 -1
- package/styles-g10.min.css +1 -1
- package/styles-g10.min.css.map +1 -1
- package/styles-g100.css +13 -25
- package/styles-g100.css.map +1 -1
- package/styles-g100.min.css +1 -1
- package/styles-g100.min.css.map +1 -1
- package/styles-g90.css +13 -25
- package/styles-g90.css.map +1 -1
- package/styles-g90.min.css +1 -1
- package/styles-g90.min.css.map +1 -1
- package/styles.css +13 -25
- package/styles.css.map +1 -1
- package/styles.min.css +1 -1
- package/styles.min.css.map +1 -1
- package/tsconfig.tsbuildinfo +81 -138
- package/build/src/components/essentials/tooltip-bar.d.ts +0 -27
- package/build/src/components/essentials/tooltip-pie.d.ts +0 -5
- package/build/src/components/essentials/tooltip-radar.d.ts +0 -5
- package/build/src/components/essentials/tooltip-scatter.d.ts +0 -5
- package/components/essentials/tooltip-bar.d.ts +0 -27
- package/components/essentials/tooltip-bar.js +0 -193
- package/components/essentials/tooltip-bar.js.map +0 -1
- package/components/essentials/tooltip-pie.d.ts +0 -5
- package/components/essentials/tooltip-pie.js +0 -44
- package/components/essentials/tooltip-pie.js.map +0 -1
- package/components/essentials/tooltip-radar.d.ts +0 -5
- package/components/essentials/tooltip-radar.js +0 -45
- package/components/essentials/tooltip-radar.js.map +0 -1
- package/components/essentials/tooltip-scatter.d.ts +0 -5
- package/components/essentials/tooltip-scatter.js +0 -46
- package/components/essentials/tooltip-scatter.js.map +0 -1
|
@@ -19,8 +19,8 @@ import Position, { PLACEMENTS } from "@carbon/utils-position";
|
|
|
19
19
|
// import the settings for the css prefix
|
|
20
20
|
import settings from "carbon-components/es/globals/js/settings";
|
|
21
21
|
// D3 Imports
|
|
22
|
-
import { select, mouse
|
|
23
|
-
import {
|
|
22
|
+
import { select, mouse } from "d3-selection";
|
|
23
|
+
import { TooltipPosition, Events, TruncationTypes } from "../../interfaces";
|
|
24
24
|
var Tooltip = /** @class */ (function (_super) {
|
|
25
25
|
__extends(Tooltip, _super);
|
|
26
26
|
function Tooltip(model, services, configs) {
|
|
@@ -39,49 +39,26 @@ var Tooltip = /** @class */ (function (_super) {
|
|
|
39
39
|
// Apply html content to the tooltip
|
|
40
40
|
var tooltipTextContainer = DOMUtils.appendOrSelect(this.tooltip, "div.content-box");
|
|
41
41
|
this.tooltip.style("max-width", null);
|
|
42
|
+
// listen to move-tooltip Custom Events to move the tooltip
|
|
43
|
+
this.services.events.addEventListener(Events.Tooltip.MOVE, function () {
|
|
44
|
+
_this.positionTooltip();
|
|
45
|
+
});
|
|
42
46
|
// listen to show-tooltip Custom Events to render the tooltip
|
|
43
47
|
this.services.events.addEventListener(Events.Tooltip.SHOW, function (e) {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
var data = select(event.target).datum();
|
|
52
|
-
// Generate default tooltip
|
|
53
|
-
var defaultHTML = void 0;
|
|
54
|
-
if (e.detail.multidata) {
|
|
55
|
-
// multi tooltip
|
|
56
|
-
data = e.detail.multidata;
|
|
57
|
-
defaultHTML = _this.getMultilineTooltipHTML(data, e.detail.type);
|
|
58
|
-
}
|
|
59
|
-
else {
|
|
60
|
-
defaultHTML = _this.getTooltipHTML(data, e.detail.type);
|
|
61
|
-
}
|
|
62
|
-
// if there is a provided tooltip HTML function call it
|
|
63
|
-
if (Tools.getProperty(_this.model.getOptions(), "tooltip", "customHTML")) {
|
|
64
|
-
tooltipTextContainer.html(_this.model
|
|
65
|
-
.getOptions()
|
|
66
|
-
.tooltip.customHTML(data, defaultHTML));
|
|
67
|
-
}
|
|
68
|
-
else {
|
|
69
|
-
// Use default tooltip
|
|
70
|
-
tooltipTextContainer.html(defaultHTML);
|
|
71
|
-
}
|
|
72
|
-
// Position the tooltip
|
|
73
|
-
_this.positionTooltip();
|
|
48
|
+
var data = e.detail.data;
|
|
49
|
+
var defaultHTML = _this.getTooltipHTML(e);
|
|
50
|
+
// if there is a provided tooltip HTML function call it
|
|
51
|
+
if (Tools.getProperty(_this.model.getOptions(), "tooltip", "customHTML")) {
|
|
52
|
+
tooltipTextContainer.html(_this.model
|
|
53
|
+
.getOptions()
|
|
54
|
+
.tooltip.customHTML(data, defaultHTML));
|
|
74
55
|
}
|
|
75
|
-
else
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
Tools.getProperty(_this.model.getOptions(), "tooltip", "title", "width");
|
|
79
|
-
_this.tooltip.style("max-width", chartWidth);
|
|
80
|
-
tooltipTextContainer.html(_this.getTooltipHTML(e.detail.hoveredElement, TooltipTypes.TITLE));
|
|
81
|
-
// get the position based on the title positioning (static)
|
|
82
|
-
var position = _this.getTooltipPosition(e.detail.hoveredElement.node(), e.detail.type);
|
|
83
|
-
_this.positionTooltip(position);
|
|
56
|
+
else {
|
|
57
|
+
// Use default tooltip
|
|
58
|
+
tooltipTextContainer.html(defaultHTML);
|
|
84
59
|
}
|
|
60
|
+
// Position the tooltip
|
|
61
|
+
_this.positionTooltip();
|
|
85
62
|
// Fade in
|
|
86
63
|
_this.tooltip.classed("hidden", false);
|
|
87
64
|
});
|
|
@@ -90,71 +67,67 @@ var Tooltip = /** @class */ (function (_super) {
|
|
|
90
67
|
_this.tooltip.classed("hidden", true);
|
|
91
68
|
});
|
|
92
69
|
};
|
|
93
|
-
Tooltip.prototype.
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
var title = this.model.getOptions().title;
|
|
97
|
-
return "<div class=\"title-tooltip\"><text>" + title + "</text></div>";
|
|
70
|
+
Tooltip.prototype.getItems = function (e) {
|
|
71
|
+
if (e.detail.items) {
|
|
72
|
+
return e.detail.items;
|
|
98
73
|
}
|
|
99
|
-
|
|
100
|
-
|
|
74
|
+
return [];
|
|
75
|
+
};
|
|
76
|
+
Tooltip.prototype.formatItems = function (items) {
|
|
77
|
+
var options = this.model.getOptions();
|
|
78
|
+
// get user provided custom values for truncation
|
|
79
|
+
var truncationType = Tools.getProperty(options, "tooltip", "truncation", "type");
|
|
80
|
+
var truncationThreshold = Tools.getProperty(options, "tooltip", "truncation", "threshold");
|
|
81
|
+
var truncationNumCharacter = Tools.getProperty(options, "tooltip", "truncation", "numCharacter");
|
|
82
|
+
// truncate the label if it's too long
|
|
83
|
+
// only applies to discrete type
|
|
84
|
+
if (truncationType !== TruncationTypes.NONE) {
|
|
85
|
+
return items.map(function (item) {
|
|
86
|
+
if (item.label && item.label.length > truncationThreshold) {
|
|
87
|
+
item.label = Tools.truncateLabel(item.label, truncationType, truncationNumCharacter);
|
|
88
|
+
}
|
|
89
|
+
if (item.value && item.value.length > truncationThreshold) {
|
|
90
|
+
item.value = Tools.truncateLabel(item.value, truncationType, truncationNumCharacter);
|
|
91
|
+
}
|
|
92
|
+
return item;
|
|
93
|
+
});
|
|
101
94
|
}
|
|
102
|
-
|
|
103
|
-
var dataVal = Tools.getProperty(data, "data") ? data.data : data;
|
|
104
|
-
var groupMapsTo = this.model.getOptions().data.groupMapsTo;
|
|
105
|
-
var rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();
|
|
106
|
-
// format the value if needed
|
|
107
|
-
var formattedValue = Tools.getProperty(this.model.getOptions(), "tooltip", "valueFormatter")
|
|
108
|
-
? this.model
|
|
109
|
-
.getOptions()
|
|
110
|
-
.tooltip.valueFormatter(dataVal[rangeIdentifier])
|
|
111
|
-
: dataVal[rangeIdentifier].toLocaleString("en");
|
|
112
|
-
// pie charts don't have a dataset label since they only support one dataset
|
|
113
|
-
var label = dataVal[groupMapsTo];
|
|
114
|
-
return "<div class=\"datapoint-tooltip\">\n\t\t\t\t\t<p class=\"label\">" + label + "</p>\n\t\t\t\t\t<p class=\"value\">" + formattedValue + "</p>\n\t\t\t\t</div>";
|
|
95
|
+
return items;
|
|
115
96
|
};
|
|
116
|
-
Tooltip.prototype.
|
|
117
|
-
var
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
.
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
97
|
+
Tooltip.prototype.getTooltipHTML = function (e) {
|
|
98
|
+
var defaultHTML;
|
|
99
|
+
if (e.detail.content) {
|
|
100
|
+
defaultHTML = "<div class=\"title-tooltip\">" + e.detail.content + "</div>";
|
|
101
|
+
}
|
|
102
|
+
else {
|
|
103
|
+
var items = this.getItems(e);
|
|
104
|
+
var formattedItems = this.formatItems(items);
|
|
105
|
+
defaultHTML =
|
|
106
|
+
"<ul class='multi-tooltip'>" +
|
|
107
|
+
formattedItems
|
|
108
|
+
.map(function (item) {
|
|
109
|
+
return "<li>\n\t\t\t\t\t\t\t<div class=\"datapoint-tooltip " + (item.bold ? "bold" : "") + "\">\n\t\t\t\t\t\t\t\t" + (item.color
|
|
110
|
+
? '<a style="background-color: ' +
|
|
111
|
+
item.color +
|
|
112
|
+
'" class="tooltip-color"></a>'
|
|
113
|
+
: "") + "\n\t\t\t\t\t\t\t\t<p class=\"label\">" + item.label + "</p>\n\t\t\t\t\t\t\t\t<p class=\"value\">" + item.value + "</p>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</li>";
|
|
114
|
+
})
|
|
115
|
+
.join("") +
|
|
116
|
+
"</ul>";
|
|
117
|
+
}
|
|
118
|
+
return defaultHTML;
|
|
119
|
+
};
|
|
120
|
+
Tooltip.prototype.valueFormatter = function (value) {
|
|
121
|
+
var options = this.model.getOptions();
|
|
122
|
+
var valueFormatter = Tools.getProperty(options, "tooltip", "valueFormatter");
|
|
123
|
+
if (valueFormatter) {
|
|
124
|
+
return valueFormatter(value);
|
|
125
|
+
}
|
|
126
|
+
return value.toLocaleString();
|
|
138
127
|
};
|
|
139
128
|
Tooltip.prototype.render = function () {
|
|
140
129
|
this.tooltip.classed("hidden", true);
|
|
141
130
|
};
|
|
142
|
-
// returns static position based on the element
|
|
143
|
-
Tooltip.prototype.getTooltipPosition = function (hoveredElement, type) {
|
|
144
|
-
var holderPosition = select(this.services.domUtils.getHolder())
|
|
145
|
-
.node()
|
|
146
|
-
.getBoundingClientRect();
|
|
147
|
-
var elementPosition = hoveredElement.getBoundingClientRect();
|
|
148
|
-
// get the vertical offset
|
|
149
|
-
var verticalOffset = this.model.getOptions().tooltip.title.verticalOffset;
|
|
150
|
-
var tooltipPos = {
|
|
151
|
-
left: elementPosition.left -
|
|
152
|
-
holderPosition.left +
|
|
153
|
-
elementPosition.width / 2,
|
|
154
|
-
top: elementPosition.top - holderPosition.top - verticalOffset
|
|
155
|
-
};
|
|
156
|
-
return { placement: TooltipPosition.BOTTOM, position: tooltipPos };
|
|
157
|
-
};
|
|
158
131
|
Tooltip.prototype.positionTooltip = function (positionOverride) {
|
|
159
132
|
var holder = this.services.domUtils.getHolder();
|
|
160
133
|
var target = this.tooltip.node();
|
|
@@ -182,7 +155,7 @@ var Tooltip = /** @class */ (function (_super) {
|
|
|
182
155
|
width: holder.offsetWidth,
|
|
183
156
|
height: holder.offsetHeight
|
|
184
157
|
}); });
|
|
185
|
-
var horizontalOffset = this.model.getOptions().tooltip.
|
|
158
|
+
var horizontalOffset = this.model.getOptions().tooltip.horizontalOffset;
|
|
186
159
|
if (bestPlacementOption === PLACEMENTS.LEFT) {
|
|
187
160
|
horizontalOffset *= -1;
|
|
188
161
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import * as Configuration from \"../../configuration\";\nimport { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select, mouse, event } from \"d3-selection\";\nimport { TooltipTypes, TooltipPosition, Events } from \"../../interfaces\";\n\nexport class Tooltip extends Component {\n\ttype = \"tooltip\";\n\n\ttooltip: any;\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\n\t\tthis.init();\n\t}\n\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"style\",\n\t\t\t\"prefix\"\n\t\t);\n\t\tthis.tooltip = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${settings.prefix}--${chartprefix}--tooltip`\n\t\t);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(\n\t\t\tthis.tooltip,\n\t\t\t\"div.content-box\"\n\t\t);\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, (e) => {\n\t\t\t// check the type of tooltip and that it is enabled\n\t\t\tif (\n\t\t\t\t(e.detail.type === TooltipTypes.DATAPOINT &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"datapoint\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t)) ||\n\t\t\t\t(e.detail.type === TooltipTypes.GRIDLINE &&\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"gridline\",\n\t\t\t\t\t\t\"enabled\"\n\t\t\t\t\t)) ||\n\t\t\t\te.detail.type === TooltipTypes.LEGEND ||\n\t\t\t\te.detail.type === TooltipTypes.AXISLABEL\n\t\t\t) {\n\t\t\t\tlet data = select(event.target).datum() as any;\n\n\t\t\t\t// Generate default tooltip\n\t\t\t\tlet defaultHTML;\n\t\t\t\tif (e.detail.multidata) {\n\t\t\t\t\t// multi tooltip\n\t\t\t\t\tdata = e.detail.multidata;\n\t\t\t\t\tdefaultHTML = this.getMultilineTooltipHTML(\n\t\t\t\t\t\tdata,\n\t\t\t\t\t\te.detail.type\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tdefaultHTML = this.getTooltipHTML(data, e.detail.type);\n\t\t\t\t}\n\n\t\t\t\t// if there is a provided tooltip HTML function call it\n\t\t\t\tif (\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"customHTML\"\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\t\tthis.model\n\t\t\t\t\t\t\t.getOptions()\n\t\t\t\t\t\t\t.tooltip.customHTML(data, defaultHTML)\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\t// Use default tooltip\n\t\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t\t}\n\n\t\t\t\t// Position the tooltip\n\t\t\t\tthis.positionTooltip();\n\t\t\t} else if (e.detail.type === TooltipTypes.TITLE) {\n\t\t\t\tconst chart = DOMUtils.appendOrSelect(\n\t\t\t\t\tholder,\n\t\t\t\t\t`svg.${settings.prefix}--${chartprefix}--chart-svg`\n\t\t\t\t);\n\t\t\t\tconst chartWidth =\n\t\t\t\t\tDOMUtils.getSVGElementSize(chart).width *\n\t\t\t\t\tTools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"title\",\n\t\t\t\t\t\t\"width\"\n\t\t\t\t\t);\n\n\t\t\t\tthis.tooltip.style(\"max-width\", chartWidth);\n\n\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\tthis.getTooltipHTML(\n\t\t\t\t\t\te.detail.hoveredElement,\n\t\t\t\t\t\tTooltipTypes.TITLE\n\t\t\t\t\t)\n\t\t\t\t);\n\n\t\t\t\t// get the position based on the title positioning (static)\n\t\t\t\tconst position = this.getTooltipPosition(\n\t\t\t\t\te.detail.hoveredElement.node(),\n\t\t\t\t\te.detail.type\n\t\t\t\t);\n\t\t\t\tthis.positionTooltip(position);\n\t\t\t}\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\tgetTooltipHTML(data: any, type: TooltipTypes) {\n\t\t// check if it is getting styles for a tooltip type\n\t\tif (type === TooltipTypes.TITLE) {\n\t\t\tconst title = this.model.getOptions().title;\n\t\t\treturn `<div class=\"title-tooltip\"><text>${title}</text></div>`;\n\t\t} else if (type === TooltipTypes.LEGEND) {\n\t\t\treturn `<div class=\"legend-tooltip\"><p class=\"label\">${data.name}</p></div>`;\n\t\t}\n\t\t// this cleans up the data item, pie slices have the data within the data.data but other datapoints are self contained within data\n\t\tconst dataVal = Tools.getProperty(data, \"data\") ? data.data : data;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t// format the value if needed\n\t\tconst formattedValue = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t)\n\t\t\t? this.model\n\t\t\t\t\t.getOptions()\n\t\t\t\t\t.tooltip.valueFormatter(dataVal[rangeIdentifier])\n\t\t\t: dataVal[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t// pie charts don't have a dataset label since they only support one dataset\n\t\tconst label = dataVal[groupMapsTo];\n\n\t\treturn `<div class=\"datapoint-tooltip\">\n\t\t\t\t\t<p class=\"label\">${label}</p>\n\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t</div>`;\n\t}\n\n\tgetMultilineTooltipHTML(data: any, type: TooltipTypes) {\n\t\t// sort them so they are in the same order as the graph\n\t\tdata.sort((a, b) => b.value - a.value);\n\n\t\t// tells us which value to use\n\t\tconst scaleType = this.services.cartesianScales.getDomainScale()\n\t\t\t.scaleType;\n\n\t\treturn (\n\t\t\t\"<ul class='multi-tooltip'>\" +\n\t\t\tdata\n\t\t\t\t.map((datum) => {\n\t\t\t\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\t\t\t\t\tconst rangeIdentifier = this.services.cartesianScales.getRangeIdentifier();\n\n\t\t\t\t\tconst userProvidedValueFormatter = Tools.getProperty(\n\t\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\t\"valueFormatter\"\n\t\t\t\t\t);\n\t\t\t\t\tconst formattedValue = userProvidedValueFormatter\n\t\t\t\t\t\t? userProvidedValueFormatter(datum[rangeIdentifier])\n\t\t\t\t\t\t: datum[rangeIdentifier].toLocaleString(\"en\");\n\n\t\t\t\t\t// For the tooltip color, we always want the normal stroke color, not dynamically determined by data value.\n\t\t\t\t\tconst indicatorColor = this.model.getStrokeColor(\n\t\t\t\t\t\tdatum[groupMapsTo]\n\t\t\t\t\t);\n\n\t\t\t\t\treturn `\n\t\t\t\t<li>\n\t\t\t\t\t<div class=\"datapoint-tooltip\">\n\t\t\t\t\t\t<a style=\"background-color:${indicatorColor}\" class=\"tooltip-color\"></a>\n\t\t\t\t\t\t<p class=\"label\">${datum[groupMapsTo]}</p>\n\t\t\t\t\t\t<p class=\"value\">${formattedValue}</p>\n\t\t\t\t\t</div>\n\t\t\t\t</li>`;\n\t\t\t\t})\n\t\t\t\t.join(\"\") +\n\t\t\t\"</ul>\"\n\t\t);\n\t}\n\n\trender() {\n\t\tthis.tooltip.classed(\"hidden\", true);\n\t}\n\n\t// returns static position based on the element\n\tgetTooltipPosition(hoveredElement, type: TooltipTypes) {\n\t\tconst holderPosition = select(this.services.domUtils.getHolder())\n\t\t\t.node()\n\t\t\t.getBoundingClientRect();\n\t\tconst elementPosition = hoveredElement.getBoundingClientRect();\n\n\t\t// get the vertical offset\n\t\tconst { verticalOffset } = this.model.getOptions().tooltip.title;\n\n\t\tconst tooltipPos = {\n\t\t\tleft:\n\t\t\t\telementPosition.left -\n\t\t\t\tholderPosition.left +\n\t\t\t\telementPosition.width / 2,\n\t\t\ttop: elementPosition.top - holderPosition.top - verticalOffset\n\t\t};\n\n\t\treturn { placement: TooltipPosition.BOTTOM, position: tooltipPos };\n\t}\n\n\tpositionTooltip(positionOverride?: any) {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.tooltip.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\t\tlet pos;\n\n\t\t// override position to place tooltip at {placement:.., position:{top:.. , left:..}}\n\t\tif (positionOverride) {\n\t\t\t// placement determines whether the tooltip is centered above or below the position provided\n\t\t\tconst placement =\n\t\t\t\tpositionOverride.placement === TooltipPosition.TOP\n\t\t\t\t\t? PLACEMENTS.TOP\n\t\t\t\t\t: PLACEMENTS.BOTTOM;\n\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\tpositionOverride.position,\n\t\t\t\ttarget,\n\t\t\t\tplacement\n\t\t\t);\n\t\t} else {\n\t\t\t// Find out whether tooltip should be shown on the left or right side\n\t\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\t[\n\t\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t\t],\n\t\t\t\t() => ({\n\t\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\t\theight: holder.offsetHeight\n\t\t\t\t})\n\t\t\t);\n\n\t\t\tlet {\n\t\t\t\thorizontalOffset\n\t\t\t} = this.model.getOptions().tooltip.datapoint;\n\t\t\tif (bestPlacementOption === PLACEMENTS.LEFT) {\n\t\t\t\thorizontalOffset *= -1;\n\t\t\t}\n\n\t\t\t// Get coordinates to where tooltip should be positioned\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0] + horizontalOffset,\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\tbestPlacementOption\n\t\t\t);\n\t\t}\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\n// D3 Imports\nimport { select, mouse } from \"d3-selection\";\nimport { TooltipPosition, Events, TruncationTypes } from \"../../interfaces\";\n\nexport class Tooltip extends Component {\n\ttype = \"tooltip\";\n\n\ttooltip: any;\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\n\t\tthis.init();\n\t}\n\n\tinit() {\n\t\t// Grab the tooltip element\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"style\",\n\t\t\t\"prefix\"\n\t\t);\n\t\tthis.tooltip = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${settings.prefix}--${chartprefix}--tooltip`\n\t\t);\n\n\t\t// Apply html content to the tooltip\n\t\tconst tooltipTextContainer = DOMUtils.appendOrSelect(\n\t\t\tthis.tooltip,\n\t\t\t\"div.content-box\"\n\t\t);\n\t\tthis.tooltip.style(\"max-width\", null);\n\n\t\t// listen to move-tooltip Custom Events to move the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.MOVE, () => {\n\t\t\tthis.positionTooltip();\n\t\t});\n\n\t\t// listen to show-tooltip Custom Events to render the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.SHOW, (e) => {\n\t\t\tconst data = e.detail.data;\n\t\t\tconst defaultHTML = this.getTooltipHTML(e);\n\n\t\t\t// if there is a provided tooltip HTML function call it\n\t\t\tif (\n\t\t\t\tTools.getProperty(\n\t\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\t\"tooltip\",\n\t\t\t\t\t\"customHTML\"\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\ttooltipTextContainer.html(\n\t\t\t\t\tthis.model\n\t\t\t\t\t\t.getOptions()\n\t\t\t\t\t\t.tooltip.customHTML(data, defaultHTML)\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\t// Use default tooltip\n\t\t\t\ttooltipTextContainer.html(defaultHTML);\n\t\t\t}\n\n\t\t\t// Position the tooltip\n\t\t\tthis.positionTooltip();\n\n\t\t\t// Fade in\n\t\t\tthis.tooltip.classed(\"hidden\", false);\n\t\t});\n\n\t\t// listen to hide-tooltip Custom Events to hide the tooltip\n\t\tthis.services.events.addEventListener(Events.Tooltip.HIDE, () => {\n\t\t\tthis.tooltip.classed(\"hidden\", true);\n\t\t});\n\t}\n\n\tgetItems(e: CustomEvent) {\n\t\tif (e.detail.items) {\n\t\t\treturn e.detail.items;\n\t\t}\n\n\t\treturn [];\n\t}\n\n\tformatItems(items) {\n\t\tconst options = this.model.getOptions();\n\n\t\t// get user provided custom values for truncation\n\t\tconst truncationType = Tools.getProperty(\n\t\t\toptions,\n\t\t\t\"tooltip\",\n\t\t\t\"truncation\",\n\t\t\t\"type\"\n\t\t);\n\n\t\tconst truncationThreshold = Tools.getProperty(\n\t\t\toptions,\n\t\t\t\"tooltip\",\n\t\t\t\"truncation\",\n\t\t\t\"threshold\"\n\t\t);\n\n\t\tconst truncationNumCharacter = Tools.getProperty(\n\t\t\toptions,\n\t\t\t\"tooltip\",\n\t\t\t\"truncation\",\n\t\t\t\"numCharacter\"\n\t\t);\n\n\t\t// truncate the label if it's too long\n\t\t// only applies to discrete type\n\t\tif (truncationType !== TruncationTypes.NONE) {\n\t\t\treturn items.map((item) => {\n\t\t\t\tif (item.label && item.label.length > truncationThreshold) {\n\t\t\t\t\titem.label = Tools.truncateLabel(\n\t\t\t\t\t\titem.label,\n\t\t\t\t\t\ttruncationType,\n\t\t\t\t\t\ttruncationNumCharacter\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\tif (item.value && item.value.length > truncationThreshold) {\n\t\t\t\t\titem.value = Tools.truncateLabel(\n\t\t\t\t\t\titem.value,\n\t\t\t\t\t\ttruncationType,\n\t\t\t\t\t\ttruncationNumCharacter\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn item;\n\t\t\t});\n\t\t}\n\n\t\treturn items;\n\t}\n\n\tgetTooltipHTML(e: CustomEvent) {\n\t\tlet defaultHTML;\n\t\tif (e.detail.content) {\n\t\t\tdefaultHTML = `<div class=\"title-tooltip\">${e.detail.content}</div>`;\n\t\t} else {\n\t\t\tconst items = this.getItems(e);\n\t\t\tconst formattedItems = this.formatItems(items);\n\t\t\tdefaultHTML =\n\t\t\t\t`<ul class='multi-tooltip'>` +\n\t\t\t\tformattedItems\n\t\t\t\t\t.map(\n\t\t\t\t\t\t(item) =>\n\t\t\t\t\t\t\t`<li>\n\t\t\t\t\t\t\t<div class=\"datapoint-tooltip ${item.bold ? \"bold\" : \"\"}\">\n\t\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\t\titem.color\n\t\t\t\t\t\t\t\t\t\t? '<a style=\"background-color: ' +\n\t\t\t\t\t\t\t\t\t\t item.color +\n\t\t\t\t\t\t\t\t\t\t '\" class=\"tooltip-color\"></a>'\n\t\t\t\t\t\t\t\t\t\t: \"\"\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t<p class=\"label\">${item.label}</p>\n\t\t\t\t\t\t\t\t<p class=\"value\">${item.value}</p>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</li>`\n\t\t\t\t\t)\n\t\t\t\t\t.join(\"\") +\n\t\t\t\t`</ul>`;\n\t\t}\n\n\t\treturn defaultHTML;\n\t}\n\n\tvalueFormatter(value: any) {\n\t\tconst options = this.model.getOptions();\n\t\tconst valueFormatter = Tools.getProperty(\n\t\t\toptions,\n\t\t\t\"tooltip\",\n\t\t\t\"valueFormatter\"\n\t\t);\n\n\t\tif (valueFormatter) {\n\t\t\treturn valueFormatter(value);\n\t\t}\n\n\t\treturn value.toLocaleString();\n\t}\n\n\trender() {\n\t\tthis.tooltip.classed(\"hidden\", true);\n\t}\n\n\tpositionTooltip(positionOverride?: any) {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.tooltip.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\t\tlet pos;\n\n\t\t// override position to place tooltip at {placement:.., position:{top:.. , left:..}}\n\t\tif (positionOverride) {\n\t\t\t// placement determines whether the tooltip is centered above or below the position provided\n\t\t\tconst placement =\n\t\t\t\tpositionOverride.placement === TooltipPosition.TOP\n\t\t\t\t\t? PLACEMENTS.TOP\n\t\t\t\t\t: PLACEMENTS.BOTTOM;\n\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\tpositionOverride.position,\n\t\t\t\ttarget,\n\t\t\t\tplacement\n\t\t\t);\n\t\t} else {\n\t\t\t// Find out whether tooltip should be shown on the left or right side\n\t\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\t[\n\t\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t\t],\n\t\t\t\t() => ({\n\t\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\t\theight: holder.offsetHeight\n\t\t\t\t})\n\t\t\t);\n\n\t\t\tlet { horizontalOffset } = this.model.getOptions().tooltip;\n\t\t\tif (bestPlacementOption === PLACEMENTS.LEFT) {\n\t\t\t\thorizontalOffset *= -1;\n\t\t\t}\n\n\t\t\t// Get coordinates to where tooltip should be positioned\n\t\t\tpos = this.positionService.findPositionAt(\n\t\t\t\t{\n\t\t\t\t\tleft: mouseRelativePos[0] + horizontalOffset,\n\t\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t\t},\n\t\t\t\ttarget,\n\t\t\t\tbestPlacementOption\n\t\t\t);\n\t\t}\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"area-stacked.js","sourceRoot":"","sources":["area-stacked.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,aAAa,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"area-stacked.js","sourceRoot":"","sources":["area-stacked.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport * as Configuration from \"../../configuration\";\nimport { Roles, ScaleTypes, Events } from \"../../interfaces\";\n\n// D3 Imports\nimport { area } from \"d3-shape\";\n\nexport class StackedArea extends Component {\n\ttype = \"area-stacked\";\n\n\tareaGenerator: any;\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct area on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight area on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate = true) {\n\t\tconst svg = this.getContainerSVG();\n\t\tconst self = this;\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tconst mainXScale = this.services.cartesianScales.getMainXScale();\n\t\tconst mainYScale = this.services.cartesianScales.getMainYScale();\n\n\t\tconst domainAxisPosition = this.services.cartesianScales.getDomainAxisPosition();\n\t\tconst domainScaleType = this.services.cartesianScales.getScaleTypeByPosition(\n\t\t\tdomainAxisPosition\n\t\t);\n\t\tconst isTimeSeries = domainScaleType === ScaleTypes.TIME;\n\n\t\tif (!isTimeSeries) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst percentage = Object.keys(options.axes).some(\n\t\t\t(axis) => options.axes[axis].percentage\n\t\t);\n\n\t\tconst stackedData = this.model.getStackedData({ percentage });\n\n\t\tconst areas = svg\n\t\t\t.selectAll(\"path.area\")\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo]);\n\n\t\t// D3 area generator function\n\t\tthis.areaGenerator = area()\n\t\t\t// @ts-ignore\n\t\t\t.x((d) => mainXScale(new Date(d.data.sharedStackKey)))\n\t\t\t.y0((d) => mainYScale(d[0]))\n\t\t\t.y1((d) => mainYScale(d[1]))\n\t\t\t.curve(this.services.curves.getD3Curve());\n\n\t\tareas.exit().attr(\"opacity\", 0).remove();\n\n\t\tconst enteringAreas = areas.enter().append(\"path\").attr(\"opacity\", 0);\n\n\t\tenteringAreas\n\t\t\t.merge(areas)\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo])\n\t\t\t.attr(\"fill\", (d) => self.model.getFillColor(d[0][groupMapsTo]))\n\t\t\t.attr(\"role\", Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr(\"aria-roledescription\", \"area\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"area-update-enter\",\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"opacity\", Configuration.area.opacity.selected)\n\t\t\t.attr(\"class\", \"area\")\n\t\t\t.attr(\"d\", this.areaGenerator);\n\t}\n\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.area\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-hover-area\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", (d) => {\n\t\t\t\tif (d[0][groupMapsTo] !== hoveredElement.datum().name) {\n\t\t\t\t\treturn Configuration.area.opacity.unselected;\n\t\t\t\t}\n\n\t\t\t\treturn Configuration.area.opacity.selected;\n\t\t\t});\n\t};\n\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll(\"path.area\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-mouseout-area\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", Configuration.area.opacity.selected);\n\t};\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll(\"path.area\")\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"mousemove\", null)\n\t\t\t.on(\"mouseout\", null);\n\t}\n}\n"]}
|
|
@@ -14,7 +14,7 @@ var __extends = (this && this.__extends) || (function () {
|
|
|
14
14
|
// Internal Imports
|
|
15
15
|
import { Bar } from "./bar";
|
|
16
16
|
import { Tools } from "../../tools";
|
|
17
|
-
import { CartesianOrientations, Events, Roles
|
|
17
|
+
import { CartesianOrientations, Events, Roles } from "../../interfaces";
|
|
18
18
|
// D3 Imports
|
|
19
19
|
import { map } from "d3-collection";
|
|
20
20
|
import { select } from "d3-selection";
|
|
@@ -152,15 +152,17 @@ var GroupedBar = /** @class */ (function (_super) {
|
|
|
152
152
|
// Show tooltip
|
|
153
153
|
self.services.events.dispatchEvent(Events.Tooltip.SHOW, {
|
|
154
154
|
hoveredElement: hoveredElement,
|
|
155
|
-
|
|
155
|
+
data: [datum]
|
|
156
156
|
});
|
|
157
157
|
})
|
|
158
158
|
.on("mousemove", function (datum) {
|
|
159
|
+
var hoveredElement = select(this);
|
|
159
160
|
// Dispatch mouse event
|
|
160
161
|
self.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {
|
|
161
|
-
element:
|
|
162
|
+
element: hoveredElement,
|
|
162
163
|
datum: datum
|
|
163
164
|
});
|
|
165
|
+
self.services.events.dispatchEvent(Events.Tooltip.MOVE);
|
|
164
166
|
})
|
|
165
167
|
.on("click", function (datum) {
|
|
166
168
|
// Dispatch mouse event
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bar-grouped.js","sourceRoot":"","sources":["bar-grouped.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Bar } from \"./bar\";\nimport { Tools } from \"../../tools\";\nimport {\n\tCartesianOrientations,\n\tEvents,\n\tRoles,\n\tTooltipTypes\n} from \"../../interfaces\";\n\n// D3 Imports\nimport { map } from \"d3-collection\";\nimport { select } from \"d3-selection\";\nimport { color } from \"d3-color\";\nimport { ScaleBand, scaleBand } from \"d3-scale\";\n\nexport class GroupedBar extends Bar {\n\ttype = \"grouped-bar\";\n\n\tgroupScale: ScaleBand<any>;\n\n\tpadding = 5;\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct circle on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight circles on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate: boolean) {\n\t\t// Chart options mixed with the internal configurations\n\t\tconst displayData = this.model.getDisplayData();\n\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\t\tconst domainIdentifier = this.services.cartesianScales.getDomainIdentifier();\n\n\t\t// Get unique labels\n\t\tthis.setGroupScale();\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\tconst allDataLabels = map(\n\t\t\tdisplayData,\n\t\t\t(datum) => datum[domainIdentifier]\n\t\t).keys();\n\n\t\t// Update data on bar groups\n\t\tconst barGroups = svg\n\t\t\t.selectAll(\"g.bars\")\n\t\t\t.data(allDataLabels, (label) => label);\n\n\t\t// Remove dot groups that need to be removed\n\t\tbarGroups.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the bar groups that need to be introduced\n\t\tconst barGroupsEnter = barGroups\n\t\t\t.enter()\n\t\t\t.append(\"g\")\n\t\t\t.classed(\"bars\", true)\n\t\t\t.attr(\"role\", Roles.GROUP)\n\t\t\t.attr(\"aria-labelledby\", (d) => d);\n\n\t\t// Update data on all bars\n\t\tconst bars = barGroupsEnter\n\t\t\t.merge(barGroups)\n\t\t\t.attr(\"transform\", (label, i) => {\n\t\t\t\tconst scaleValue = this.services.cartesianScales.getDomainValue(\n\t\t\t\t\tlabel,\n\t\t\t\t\ti\n\t\t\t\t);\n\t\t\t\tconst translateBy = scaleValue - this.getGroupWidth() / 2;\n\t\t\t\t// const translateBy = scaleValue - this.getGroupWidth(null) / 2 + this.getBarWidth(null);\n\n\t\t\t\tif (\n\t\t\t\t\tthis.services.cartesianScales.getOrientation() ===\n\t\t\t\t\tCartesianOrientations.VERTICAL\n\t\t\t\t) {\n\t\t\t\t\treturn `translate(${translateBy}, 0)`;\n\t\t\t\t} else {\n\t\t\t\t\t// translate in the y direction for horizontal groups\n\t\t\t\t\treturn `translate(0, ${translateBy})`;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.data((label) => this.getDataCorrespondingToLabel(label));\n\n\t\t// Remove bars that are no longer needed\n\t\tbars.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the circles that need to be introduced\n\t\tconst barsEnter = bars.enter().append(\"path\").attr(\"opacity\", 0);\n\n\t\t// code for vertical grouped bar charts\n\t\tbarsEnter\n\t\t\t.merge(bars)\n\t\t\t.classed(\"bar\", true)\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"bar-update-enter\",\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"fill\", (d) => this.model.getFillColor(d[groupMapsTo]))\n\t\t\t.attr(\"d\", (d) => {\n\t\t\t\t/*\n\t\t\t\t * Orientation support for horizontal/vertical bar charts\n\t\t\t\t * Determine coordinates needed for a vertical set of paths\n\t\t\t\t * to draw the bars needed, and pass those coordinates down to\n\t\t\t\t * generateSVGPathString() to decide whether it needs to flip them\n\t\t\t\t */\n\t\t\t\tconst startX = this.groupScale(d[groupMapsTo]);\n\t\t\t\tconst barWidth = this.getBarWidth();\n\n\t\t\t\tconst x0 = startX;\n\t\t\t\tconst x1 = startX + barWidth;\n\t\t\t\tconst y0 = this.services.cartesianScales.getRangeValue(0);\n\t\t\t\tconst y1 = this.services.cartesianScales.getRangeValue(d.value);\n\n\t\t\t\treturn Tools.generateSVGPathString(\n\t\t\t\t\t{ x0, x1, y0, y1 },\n\t\t\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t\t\t);\n\t\t\t})\n\t\t\t.attr(\"opacity\", 1)\n\t\t\t// a11y\n\t\t\t.attr(\"role\", Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr(\"aria-roledescription\", \"bar\")\n\t\t\t.attr(\"aria-label\", (d) => d.value);\n\n\t\t// Add event listeners to elements drawn\n\t\tthis.addEventListeners();\n\t}\n\n\t// Highlight elements that match the hovered legend item\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-hover-bar\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", (d) =>\n\t\t\t\td[groupMapsTo] !== hoveredElement.datum()[\"name\"] ? 0.3 : 1\n\t\t\t);\n\t};\n\n\t// Un-highlight all elements\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-mouseout-bar\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", 1);\n\t};\n\n\taddEventListeners() {\n\t\tconst self = this;\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseover_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tcolor(self.model.getFillColor(d[groupMapsTo]))\n\t\t\t\t\t\t\t.darker(0.7)\n\t\t\t\t\t\t\t.toString()\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOVER, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Show tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\thoveredElement,\n\t\t\t\t\ttype: TooltipTypes.DATAPOINT\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mousemove\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"click\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_CLICK, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", false);\n\n\t\t\t\tconst { groupMapsTo } = self.model.getOptions().data;\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseout_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tself.model.getFillColor(d[groupMapsTo])\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOUT, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Hide tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE, {\n\t\t\t\t\thoveredElement\n\t\t\t\t});\n\t\t\t});\n\t}\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"mousemove\", null)\n\t\t\t.on(\"mouseout\", null);\n\n\t\t// Remove legend listeners\n\t\tconst eventsFragment = this.services.events;\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\tprotected getDataCorrespondingToLabel(label: string) {\n\t\tconst displayData = this.model.getDisplayData();\n\t\tconst domainIdentifier = this.services.cartesianScales.getDomainIdentifier();\n\n\t\treturn displayData.filter((datum) => datum[domainIdentifier] === label);\n\t}\n\n\tprotected getGroupWidth() {\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\t\tconst totalGroupPadding = this.getTotalGroupPadding();\n\n\t\treturn this.getBarWidth() * numOfActiveDataGroups + totalGroupPadding;\n\t}\n\n\tprotected getTotalGroupPadding() {\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\n\t\tif (numOfActiveDataGroups === 1) {\n\t\t\treturn 0;\n\t\t}\n\n\t\tconst domainScale = this.services.cartesianScales.getDomainScale();\n\t\tconst padding = Math.min(5, 5 * (domainScale.step() / 70));\n\n\t\treturn padding * (numOfActiveDataGroups - 1);\n\t}\n\n\t// Gets the correct width for bars based on options & configurations\n\tprotected getBarWidth() {\n\t\tconst options = this.model.getOptions();\n\t\tconst providedWidth = Tools.getProperty(options, \"bars\", \"width\");\n\t\tconst providedMaxWidth = Tools.getProperty(options, \"bars\", \"maxWidth\");\n\n\t\t// If there's a provided width, compare with maxWidth and\n\t\t// Determine which to return\n\t\tif (providedWidth !== null) {\n\t\t\tif (providedMaxWidth === null) {\n\t\t\t\treturn providedWidth;\n\t\t\t} else if (providedWidth <= providedMaxWidth) {\n\t\t\t\treturn providedWidth;\n\t\t\t}\n\t\t}\n\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\t\tconst totalGroupPadding = this.getTotalGroupPadding();\n\n\t\tconst domainScale = this.services.cartesianScales.getDomainScale();\n\t\treturn Math.min(\n\t\t\tprovidedMaxWidth,\n\t\t\t(domainScale.step() - totalGroupPadding) / numOfActiveDataGroups\n\t\t);\n\t}\n\n\tprotected setGroupScale() {\n\t\tthis.groupScale = scaleBand()\n\t\t\t.domain(this.model.getActiveDataGroupNames())\n\t\t\t.rangeRound([0, this.getGroupWidth()]);\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"bar-grouped.js","sourceRoot":"","sources":["bar-grouped.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Bar } from \"./bar\";\nimport { Tools } from \"../../tools\";\nimport { CartesianOrientations, Events, Roles } from \"../../interfaces\";\n\n// D3 Imports\nimport { map } from \"d3-collection\";\nimport { select } from \"d3-selection\";\nimport { color } from \"d3-color\";\nimport { ScaleBand, scaleBand } from \"d3-scale\";\n\nexport class GroupedBar extends Bar {\n\ttype = \"grouped-bar\";\n\n\tgroupScale: ScaleBand<any>;\n\n\tpadding = 5;\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct circle on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight circles on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate: boolean) {\n\t\t// Chart options mixed with the internal configurations\n\t\tconst displayData = this.model.getDisplayData();\n\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\t\tconst domainIdentifier = this.services.cartesianScales.getDomainIdentifier();\n\n\t\t// Get unique labels\n\t\tthis.setGroupScale();\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\tconst allDataLabels = map(\n\t\t\tdisplayData,\n\t\t\t(datum) => datum[domainIdentifier]\n\t\t).keys();\n\n\t\t// Update data on bar groups\n\t\tconst barGroups = svg\n\t\t\t.selectAll(\"g.bars\")\n\t\t\t.data(allDataLabels, (label) => label);\n\n\t\t// Remove dot groups that need to be removed\n\t\tbarGroups.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the bar groups that need to be introduced\n\t\tconst barGroupsEnter = barGroups\n\t\t\t.enter()\n\t\t\t.append(\"g\")\n\t\t\t.classed(\"bars\", true)\n\t\t\t.attr(\"role\", Roles.GROUP)\n\t\t\t.attr(\"aria-labelledby\", (d) => d);\n\n\t\t// Update data on all bars\n\t\tconst bars = barGroupsEnter\n\t\t\t.merge(barGroups)\n\t\t\t.attr(\"transform\", (label, i) => {\n\t\t\t\tconst scaleValue = this.services.cartesianScales.getDomainValue(\n\t\t\t\t\tlabel,\n\t\t\t\t\ti\n\t\t\t\t);\n\t\t\t\tconst translateBy = scaleValue - this.getGroupWidth() / 2;\n\t\t\t\t// const translateBy = scaleValue - this.getGroupWidth(null) / 2 + this.getBarWidth(null);\n\n\t\t\t\tif (\n\t\t\t\t\tthis.services.cartesianScales.getOrientation() ===\n\t\t\t\t\tCartesianOrientations.VERTICAL\n\t\t\t\t) {\n\t\t\t\t\treturn `translate(${translateBy}, 0)`;\n\t\t\t\t} else {\n\t\t\t\t\t// translate in the y direction for horizontal groups\n\t\t\t\t\treturn `translate(0, ${translateBy})`;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.data((label) => this.getDataCorrespondingToLabel(label));\n\n\t\t// Remove bars that are no longer needed\n\t\tbars.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the circles that need to be introduced\n\t\tconst barsEnter = bars.enter().append(\"path\").attr(\"opacity\", 0);\n\n\t\t// code for vertical grouped bar charts\n\t\tbarsEnter\n\t\t\t.merge(bars)\n\t\t\t.classed(\"bar\", true)\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"bar-update-enter\",\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"fill\", (d) => this.model.getFillColor(d[groupMapsTo]))\n\t\t\t.attr(\"d\", (d) => {\n\t\t\t\t/*\n\t\t\t\t * Orientation support for horizontal/vertical bar charts\n\t\t\t\t * Determine coordinates needed for a vertical set of paths\n\t\t\t\t * to draw the bars needed, and pass those coordinates down to\n\t\t\t\t * generateSVGPathString() to decide whether it needs to flip them\n\t\t\t\t */\n\t\t\t\tconst startX = this.groupScale(d[groupMapsTo]);\n\t\t\t\tconst barWidth = this.getBarWidth();\n\n\t\t\t\tconst x0 = startX;\n\t\t\t\tconst x1 = startX + barWidth;\n\t\t\t\tconst y0 = this.services.cartesianScales.getRangeValue(0);\n\t\t\t\tconst y1 = this.services.cartesianScales.getRangeValue(d.value);\n\n\t\t\t\treturn Tools.generateSVGPathString(\n\t\t\t\t\t{ x0, x1, y0, y1 },\n\t\t\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t\t\t);\n\t\t\t})\n\t\t\t.attr(\"opacity\", 1)\n\t\t\t// a11y\n\t\t\t.attr(\"role\", Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr(\"aria-roledescription\", \"bar\")\n\t\t\t.attr(\"aria-label\", (d) => d.value);\n\n\t\t// Add event listeners to elements drawn\n\t\tthis.addEventListeners();\n\t}\n\n\t// Highlight elements that match the hovered legend item\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-hover-bar\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", (d) =>\n\t\t\t\td[groupMapsTo] !== hoveredElement.datum()[\"name\"] ? 0.3 : 1\n\t\t\t);\n\t};\n\n\t// Un-highlight all elements\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\"legend-mouseout-bar\")\n\t\t\t)\n\t\t\t.attr(\"opacity\", 1);\n\t};\n\n\taddEventListeners() {\n\t\tconst self = this;\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseover_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tcolor(self.model.getFillColor(d[groupMapsTo]))\n\t\t\t\t\t\t\t.darker(0.7)\n\t\t\t\t\t\t\t.toString()\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOVER, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Show tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\thoveredElement,\n\t\t\t\t\tdata: [datum]\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mousemove\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.MOVE);\n\t\t\t})\n\t\t\t.on(\"click\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_CLICK, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", false);\n\n\t\t\t\tconst { groupMapsTo } = self.model.getOptions().data;\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseout_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tself.model.getFillColor(d[groupMapsTo])\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOUT, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Hide tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE, {\n\t\t\t\t\thoveredElement\n\t\t\t\t});\n\t\t\t});\n\t}\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"mousemove\", null)\n\t\t\t.on(\"mouseout\", null);\n\n\t\t// Remove legend listeners\n\t\tconst eventsFragment = this.services.events;\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\tprotected getDataCorrespondingToLabel(label: string) {\n\t\tconst displayData = this.model.getDisplayData();\n\t\tconst domainIdentifier = this.services.cartesianScales.getDomainIdentifier();\n\n\t\treturn displayData.filter((datum) => datum[domainIdentifier] === label);\n\t}\n\n\tprotected getGroupWidth() {\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\t\tconst totalGroupPadding = this.getTotalGroupPadding();\n\n\t\treturn this.getBarWidth() * numOfActiveDataGroups + totalGroupPadding;\n\t}\n\n\tprotected getTotalGroupPadding() {\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\n\t\tif (numOfActiveDataGroups === 1) {\n\t\t\treturn 0;\n\t\t}\n\n\t\tconst domainScale = this.services.cartesianScales.getDomainScale();\n\t\tconst padding = Math.min(5, 5 * (domainScale.step() / 70));\n\n\t\treturn padding * (numOfActiveDataGroups - 1);\n\t}\n\n\t// Gets the correct width for bars based on options & configurations\n\tprotected getBarWidth() {\n\t\tconst options = this.model.getOptions();\n\t\tconst providedWidth = Tools.getProperty(options, \"bars\", \"width\");\n\t\tconst providedMaxWidth = Tools.getProperty(options, \"bars\", \"maxWidth\");\n\n\t\t// If there's a provided width, compare with maxWidth and\n\t\t// Determine which to return\n\t\tif (providedWidth !== null) {\n\t\t\tif (providedMaxWidth === null) {\n\t\t\t\treturn providedWidth;\n\t\t\t} else if (providedWidth <= providedMaxWidth) {\n\t\t\t\treturn providedWidth;\n\t\t\t}\n\t\t}\n\n\t\tconst numOfActiveDataGroups = this.model.getActiveDataGroupNames()\n\t\t\t.length;\n\t\tconst totalGroupPadding = this.getTotalGroupPadding();\n\n\t\tconst domainScale = this.services.cartesianScales.getDomainScale();\n\t\treturn Math.min(\n\t\t\tprovidedMaxWidth,\n\t\t\t(domainScale.step() - totalGroupPadding) / numOfActiveDataGroups\n\t\t);\n\t}\n\n\tprotected setGroupScale() {\n\t\tthis.groupScale = scaleBand()\n\t\t\t.domain(this.model.getActiveDataGroupNames())\n\t\t\t.rangeRound([0, this.getGroupWidth()]);\n\t}\n}\n"]}
|
|
@@ -13,7 +13,7 @@ var __extends = (this && this.__extends) || (function () {
|
|
|
13
13
|
})();
|
|
14
14
|
// Internal Imports
|
|
15
15
|
import { Bar } from "./bar";
|
|
16
|
-
import { Events, Roles
|
|
16
|
+
import { Events, Roles } from "../../interfaces";
|
|
17
17
|
import { Tools } from "../../tools";
|
|
18
18
|
// D3 Imports
|
|
19
19
|
import { select } from "d3-selection";
|
|
@@ -114,15 +114,17 @@ var SimpleBar = /** @class */ (function (_super) {
|
|
|
114
114
|
});
|
|
115
115
|
self.services.events.dispatchEvent(Events.Tooltip.SHOW, {
|
|
116
116
|
hoveredElement: hoveredElement,
|
|
117
|
-
|
|
117
|
+
data: [datum]
|
|
118
118
|
});
|
|
119
119
|
})
|
|
120
120
|
.on("mousemove", function (datum) {
|
|
121
|
+
var hoveredElement = select(this);
|
|
121
122
|
// Dispatch mouse event
|
|
122
123
|
self.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {
|
|
123
124
|
element: select(this),
|
|
124
125
|
datum: datum
|
|
125
126
|
});
|
|
127
|
+
self.services.events.dispatchEvent(Events.Tooltip.MOVE);
|
|
126
128
|
})
|
|
127
129
|
.on("click", function (datum) {
|
|
128
130
|
// Dispatch mouse event
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bar-simple.js","sourceRoot":"","sources":["bar-simple.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Bar } from \"./bar\";\nimport { Events, Roles, TooltipTypes } from \"../../interfaces\";\nimport { Tools } from \"../../tools\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\nimport { color } from \"d3-color\";\n\nexport class SimpleBar extends Bar {\n\ttype = \"simple-bar\";\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct circle on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight circles on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate: boolean) {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\t// Update data on all bars\n\t\tconst bars = svg\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.data(this.model.getDisplayData(), (datum) => datum[groupMapsTo]);\n\n\t\t// Remove bars that are no longer needed\n\t\tbars.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the paths that need to be introduced\n\t\tconst barsEnter = bars.enter().append(\"path\").attr(\"opacity\", 0);\n\n\t\tbarsEnter\n\t\t\t.merge(bars)\n\t\t\t.classed(\"bar\", true)\n\t\t\t.attr(\"width\", this.getBarWidth.bind(this))\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"bar-update-enter\",\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"fill\", (d) => this.model.getFillColor(d[groupMapsTo]))\n\t\t\t.attr(\"d\", (d, i) => {\n\t\t\t\t/*\n\t\t\t\t * Orientation support for horizontal/vertical bar charts\n\t\t\t\t * Determine coordinates needed for a vertical set of paths\n\t\t\t\t * to draw the bars needed, and pass those coordinates down to\n\t\t\t\t * generateSVGPathString() to decide whether it needs to flip them\n\t\t\t\t */\n\t\t\t\tconst barWidth = this.getBarWidth();\n\t\t\t\tconst x0 =\n\t\t\t\t\tthis.services.cartesianScales.getDomainValue(d, i) -\n\t\t\t\t\tbarWidth / 2;\n\t\t\t\tconst x1 = x0 + barWidth;\n\t\t\t\tconst y0 = this.services.cartesianScales.getRangeValue(0);\n\t\t\t\tconst y1 = this.services.cartesianScales.getRangeValue(d, i);\n\n\t\t\t\treturn Tools.generateSVGPathString(\n\t\t\t\t\t{ x0, x1, y0, y1 },\n\t\t\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t\t\t);\n\t\t\t})\n\t\t\t.attr(\"opacity\", 1)\n\t\t\t// a11y\n\t\t\t.attr(\"role\", Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr(\"aria-roledescription\", \"bar\")\n\t\t\t.attr(\"aria-label\", (d) => d.value);\n\n\t\t// Add event listeners to elements drawn\n\t\tthis.addEventListeners();\n\t}\n\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"legend-hover-simple-bar\"\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"opacity\", (d) =>\n\t\t\t\td[groupMapsTo] !== hoveredElement.datum()[\"name\"] ? 0.3 : 1\n\t\t\t);\n\t};\n\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"legend-mouseout-simple-bar\"\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"opacity\", 1);\n\t};\n\n\taddEventListeners() {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tconst self = this;\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", true);\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseover_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tcolor(self.model.getFillColor(d[groupMapsTo]))\n\t\t\t\t\t\t\t.darker(0.7)\n\t\t\t\t\t\t\t.toString()\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOVER, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\thoveredElement,\n\t\t\t\t\ttype: TooltipTypes.DATAPOINT\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mousemove\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"click\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_CLICK, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", false);\n\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseout_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tself.model.getFillColor(d[groupMapsTo])\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOUT, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Hide tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE, {\n\t\t\t\t\thoveredElement\n\t\t\t\t});\n\t\t\t});\n\t}\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"mousemove\", null)\n\t\t\t.on(\"mouseout\", null);\n\n\t\t// Remove legend listeners\n\t\tconst eventsFragment = this.services.events;\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"bar-simple.js","sourceRoot":"","sources":["bar-simple.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Bar } from \"./bar\";\nimport { Events, Roles } from \"../../interfaces\";\nimport { Tools } from \"../../tools\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\nimport { color } from \"d3-color\";\n\nexport class SimpleBar extends Bar {\n\ttype = \"simple-bar\";\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct circle on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight circles on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate: boolean) {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\t// Update data on all bars\n\t\tconst bars = svg\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.data(this.model.getDisplayData(), (datum) => datum[groupMapsTo]);\n\n\t\t// Remove bars that are no longer needed\n\t\tbars.exit().attr(\"opacity\", 0).remove();\n\n\t\t// Add the paths that need to be introduced\n\t\tconst barsEnter = bars.enter().append(\"path\").attr(\"opacity\", 0);\n\n\t\tbarsEnter\n\t\t\t.merge(bars)\n\t\t\t.classed(\"bar\", true)\n\t\t\t.attr(\"width\", this.getBarWidth.bind(this))\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"bar-update-enter\",\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"fill\", (d) => this.model.getFillColor(d[groupMapsTo]))\n\t\t\t.attr(\"d\", (d, i) => {\n\t\t\t\t/*\n\t\t\t\t * Orientation support for horizontal/vertical bar charts\n\t\t\t\t * Determine coordinates needed for a vertical set of paths\n\t\t\t\t * to draw the bars needed, and pass those coordinates down to\n\t\t\t\t * generateSVGPathString() to decide whether it needs to flip them\n\t\t\t\t */\n\t\t\t\tconst barWidth = this.getBarWidth();\n\t\t\t\tconst x0 =\n\t\t\t\t\tthis.services.cartesianScales.getDomainValue(d, i) -\n\t\t\t\t\tbarWidth / 2;\n\t\t\t\tconst x1 = x0 + barWidth;\n\t\t\t\tconst y0 = this.services.cartesianScales.getRangeValue(0);\n\t\t\t\tconst y1 = this.services.cartesianScales.getRangeValue(d, i);\n\n\t\t\t\treturn Tools.generateSVGPathString(\n\t\t\t\t\t{ x0, x1, y0, y1 },\n\t\t\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t\t\t);\n\t\t\t})\n\t\t\t.attr(\"opacity\", 1)\n\t\t\t// a11y\n\t\t\t.attr(\"role\", Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr(\"aria-roledescription\", \"bar\")\n\t\t\t.attr(\"aria-label\", (d) => d.value);\n\n\t\t// Add event listeners to elements drawn\n\t\tthis.addEventListeners();\n\t}\n\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\t\tconst { groupMapsTo } = this.model.getOptions().data;\n\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"legend-hover-simple-bar\"\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"opacity\", (d) =>\n\t\t\t\td[groupMapsTo] !== hoveredElement.datum()[\"name\"] ? 0.3 : 1\n\t\t\t);\n\t};\n\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\"legend-mouseout-simple-bar\"\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr(\"opacity\", 1);\n\t};\n\n\taddEventListeners() {\n\t\tconst options = this.model.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tconst self = this;\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", true);\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseover_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tcolor(self.model.getFillColor(d[groupMapsTo]))\n\t\t\t\t\t\t\t.darker(0.7)\n\t\t\t\t\t\t\t.toString()\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOVER, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\thoveredElement,\n\t\t\t\t\tdata: [datum]\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mousemove\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEMOVE, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.MOVE);\n\t\t\t})\n\t\t\t.on(\"click\", function (datum) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_CLICK, {\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function (datum) {\n\t\t\t\tconst hoveredElement = select(this);\n\t\t\t\thoveredElement.classed(\"hovered\", false);\n\n\t\t\t\thoveredElement\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t\"graph_element_mouseout_fill_update\"\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"fill\", (d: any) =>\n\t\t\t\t\t\tself.model.getFillColor(d[groupMapsTo])\n\t\t\t\t\t);\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Bar.BAR_MOUSEOUT, {\n\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\tdatum\n\t\t\t\t});\n\n\t\t\t\t// Hide tooltip\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE, {\n\t\t\t\t\thoveredElement\n\t\t\t\t});\n\t\t\t});\n\t}\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll(\"path.bar\")\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"mousemove\", null)\n\t\t\t.on(\"mouseout\", null);\n\n\t\t// Remove legend listeners\n\t\tconst eventsFragment = this.services.events;\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\t\teventsFragment.removeEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n}\n"]}
|