survey-analytics 2.5.16 → 3.0.0-beta.1

package/fesm/survey.analytics.apexcharts.mjs

@@ -0,0 +1,1082 @@
+/*!
+ * surveyjs - SurveyJS Dashboard library v3.0.0-beta.1
+ * Copyright (c) 2015-2026 Devsoft Baltic OÜ  - http://surveyjs.io/
+ * License: MIT (http://www.opensource.org/licenses/mit-license.php)
+ */
+
+import { Event, ItemValue } from 'survey-core';
+import { l as localization, d as DataHelper, D as DashboardTheme } from './shared3.mjs';
+export { a as DocumentHelper, c as createActionDropdown, s as setupLocale, b as surveyStrings } from './shared3.mjs';
+import { h as NumberModel, s as VisualizerBase, _ as __awaiter, S as SelectBase } from './shared2.mjs';
+export { A as AlternativeVisualizersWrapper, B as BooleanModel, C as CardAdapter, a as CardVisualizer, b as CardVisualizerWidget, D as Dashboard, c as DataProvider, H as HistogramModel, L as LayoutEngine, M as Matrix, d as MatrixDropdownGrouped, e as MuuriLayoutEngine, N as NpsAdapter, f as NpsVisualizer, g as NpsVisualizerWidget, P as PivotModel, i as PostponeHelper, R as RankingModel, j as StatisticsTable, k as StatisticsTableAdapter, l as StatisticsTableBoolean, T as Text, m as TextTableAdapter, V as VisualizationComposite, n as VisualizationManager, o as VisualizationMatrixDropdown, p as VisualizationMatrixDynamic, q as VisualizationPanel, r as VisualizationPanelDynamic, t as VisualizerFactory, W as WordCloud, u as WordCloudAdapter, v as createDropdown, w as getBestIntervalMode, x as getVisualizerDescriptions, y as hideEmptyAnswersInData, z as intervalCalculators, E as textHelper } from './shared2.mjs';
+import { i as isAllZeros, r as reverseAll, a as removeUndefinedProperties } from './shared4.mjs';
+import ApexCharts from 'apexcharts';
+
+class ApexChartsSetup {
+    static defaultDataLabelsConfig(theme) {
+        const insideLabelFont = theme.insideLabelFont;
+        return {
+            enabled: true,
+            style: {
+                colors: [insideLabelFont.color],
+                fontSize: insideLabelFont.size,
+                fontFamily: insideLabelFont.family,
+                fontWeight: insideLabelFont.weight,
+            }
+        };
+    }
+    static defaultTooltipConfig(theme) {
+        const font = theme.tooltipFont;
+        return {
+            enabled: true,
+            fillSeriesColor: false,
+            style: {
+                fontSize: font.size,
+                fontFamily: font.family,
+            },
+            marker: {
+                show: false,
+            },
+            x: {
+                formatter: () => "",
+            },
+            y: {
+                formatter: function (val) {
+                    return val.toString();
+                },
+                title: {
+                    formatter: () => "",
+                },
+            }
+        };
+    }
+    static defaultLegendConfig(model) {
+        const font = model.theme.legendLabelFont;
+        return {
+            position: model.legendPosition,
+            horizontalAlign: "left",
+            verticalAlign: "top",
+            fontSize: font.size,
+            fontFamily: font.family,
+            fontWeight: font.weight,
+            labels: {
+                colors: font.color
+            },
+            markers: {
+                size: 10,
+                strokeWidth: 1,
+                shape: "square",
+                // customHTML: function() {
+                //   return '<span class="sa-legend-item-marker"><i class="sa-legend-item-text"></i></span>';
+                // }
+            },
+        };
+    }
+    static defaultAxisZerolineConfig(theme) {
+        return {
+            show: false,
+            color: theme.axisGridColor,
+        };
+    }
+    static defaultGridConfig(theme) {
+        return {
+            borderColor: theme.axisGridColor,
+            strokeDashArray: 4,
+            position: "back",
+            xaxis: {
+                lines: {
+                    show: false,
+                }
+            },
+            yaxis: {
+                lines: {
+                    show: false,
+                }
+            }
+        };
+    }
+    static defaultAxisTitleFont(theme) {
+        const font = theme.axisTitleFont;
+        return {
+            colors: font.color,
+            fontSize: font.size,
+            fontFamily: font.family,
+            fontWeight: font.weight,
+        };
+    }
+    static defaultAxisLabelFont(theme) {
+        const font = theme.axisLabelFont;
+        return {
+            colors: font.color,
+            fontSize: font.size,
+            fontFamily: font.family,
+            fontWeight: font.weight,
+        };
+    }
+    static defaultAxisConfig(theme) {
+        return {
+            title: {
+                style: Object.assign({}, ApexChartsSetup.defaultAxisTitleFont(theme)),
+            },
+            min: 0,
+            labels: {
+                trim: true,
+                hideOverlappingLabels: false,
+                style: Object.assign({}, ApexChartsSetup.defaultAxisLabelFont(theme)),
+            },
+        };
+    }
+    static defaultGaugeValueFont(theme) {
+        const font = theme.gaugeValueFont;
+        return {
+            colors: font.color,
+            fontSize: font.size,
+            fontFamily: font.family,
+            fontWeight: font.weight,
+        };
+    }
+    static defaultGaugeTickFont(theme) {
+        const font = theme.gaugeTickFont;
+        return {
+            colors: font.color,
+            fontSize: font.size,
+            fontFamily: font.family,
+            fontWeight: font.weight,
+        };
+    }
+    static defaultNoDataConfig(theme) {
+        const font = theme.noDataFont;
+        return {
+            text: localization.getString("noData"),
+            align: "center",
+            verticalAlign: "middle",
+            offsetX: 0,
+            offsetY: 0,
+            style: {
+                color: font.color,
+                fontSize: font.size,
+                fontFamily: font.family
+            }
+        };
+    }
+    static dataListFormatter(model, text, value) {
+        if (model.showPercentages) {
+            if (model.showOnlyPercentages) {
+                return text + "%";
+            }
+            else {
+                return value + " (" + text + "%)";
+            }
+        }
+        return value;
+    }
+    static setup(charType, model, answersData) {
+        return this.setups[charType](model, answersData);
+    }
+    static setupPie(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                if (!isAllZeros(dataset)) {
+                    series.push({
+                        series: dataset,
+                        labels: labels,
+                        title: seriesLabels[index]
+                    });
+                }
+            });
+        }
+        else {
+            // For simple questions
+            if (!isAllZeros(datasets[0])) {
+                series = datasets[0];
+            }
+        }
+        const diameter = labels.length < 10 ? labels.length * 50 + 100 : 550;
+        // Chart settings
+        const chart = {
+            type: model.chartType === "doughnut" ? "donut" : "pie",
+            height: diameter,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Data label settings
+        const dataLabels = Object.assign(Object.assign({}, ApexChartsSetup.defaultDataLabelsConfig(model.theme)), { formatter: function (val, opts) {
+                const name = opts.w.globals.labels[opts.seriesIndex];
+                const text = name.length > 15 ? name.substring(0, 15) + "..." : name;
+                return [text, val.toFixed(model.percentagePrecision) + "%"];
+            } });
+        // Chart options settings
+        const plotOptions = {
+            pie: {
+                donut: {
+                    size: model.chartType === "doughnut" ? "40%" : "0%",
+                },
+                customScale: 1,
+                offsetX: 0,
+                offsetY: 0,
+                startAngle: 0,
+                endAngle: 360,
+                expandOnClick: true,
+                dataLabels: {
+                    offset: model.chartType === "doughnut" ? -10 : -25,
+                }
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        tooltip.y.title.formatter = (seriesName, opts) => {
+            const val = opts.w.globals.seriesPercent[opts.seriesIndex][0];
+            return [seriesName, val.toFixed(model.percentagePrecision) + "%"];
+        };
+        const legend = {
+            show: false,
+        };
+        const options = {
+            series,
+            chart,
+            labels: hasSeries ? seriesLabels : labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            noData: ApexChartsSetup.defaultNoDataConfig(model.theme),
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries
+        };
+        if (hasSeries) {
+            options.title = {
+                align: "center",
+                style: Object.assign({}, ApexChartsSetup.defaultAxisLabelFont(model.theme)),
+            };
+        }
+        return options;
+    }
+    static setupBar(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        const isHistogram = model.type === "histogram";
+        if (!isHistogram) {
+            const reversedAnswersData = reverseAll(labels, seriesLabels, colors, hasSeries, texts, datasets);
+            labels = reversedAnswersData.labels;
+            datasets = reversedAnswersData.datasets;
+        }
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                series.push({
+                    name: seriesLabels[index],
+                    data: dataset
+                });
+            });
+        }
+        else {
+            // For simple questions
+            series.push({
+                name: "Values",
+                data: datasets[0]
+            });
+        }
+        let lineHeight = 30;
+        let margin = 35;
+        let height = (labels.length) * lineHeight + 2 * margin;
+        if (hasSeries && (model.legendPosition === "top" || model.legendPosition === "bottom")) {
+            height += (labels.length * seriesLabels.length) * lineHeight;
+        }
+        else if (hasSeries) {
+            height = (labels.length * seriesLabels.length) * lineHeight + 2 * margin;
+        }
+        // Chart settings
+        const chart = {
+            type: "bar",
+            height: height,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Axis settings
+        const xaxis = Object.assign(Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme)), { categories: labels, axisBorder: {
+                show: false,
+            } });
+        const yaxis = Object.assign(Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme)), { axisBorder: Object.assign({}, ApexChartsSetup.defaultAxisZerolineConfig(model.theme)) });
+        const grid = Object.assign(Object.assign({}, ApexChartsSetup.defaultGridConfig(model.theme)), { xaxis: {
+                lines: {
+                    show: true
+                }
+            } });
+        // Legend settings
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries });
+        // Data label settings
+        const dataLabels = Object.assign(Object.assign({}, ApexChartsSetup.defaultDataLabelsConfig(model.theme)), { formatter: function (val, opts) {
+                return ApexChartsSetup.dataListFormatter(model, texts[opts.seriesIndex][opts.dataPointIndex], val);
+            } });
+        // Chart options settings
+        const plotOptions = {
+            bar: {
+                horizontal: true,
+                distributed: !isHistogram && !hasSeries,
+                barHeight: isHistogram ? "100%" : (1 - ApexChartsSetup.defaultBarGap) * 100 + "%",
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        // RTL language handling
+        if (["ar", "fa"].indexOf(localization.currentLocale) !== -1) {
+            chart.direction = "rtl";
+        }
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries,
+            grid,
+            xaxis,
+            yaxis
+        };
+    }
+    static setupVBar(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        const isHistogram = model.type === "histogram";
+        if (!isHistogram && model.type !== "pivot") {
+            ({ labels, seriesLabels, colors, texts, datasets } = reverseAll(labels, seriesLabels, colors, hasSeries, texts, datasets));
+        }
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                series.push({
+                    name: seriesLabels[index],
+                    data: dataset
+                });
+            });
+        }
+        else {
+            // For simple questions
+            series.push({
+                name: "Values",
+                data: datasets[0]
+            });
+        }
+        // Chart settings
+        const chart = {
+            type: "bar",
+            height: ApexChartsSetup.defaultChartHeight,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Axis settings
+        const xaxis = Object.assign(Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme)), { categories: labels, axisBorder: Object.assign({}, ApexChartsSetup.defaultAxisZerolineConfig(model.theme)) });
+        const yaxis = model.getYAxisInfo().map(info => {
+            const setting = Object.assign(ApexChartsSetup.defaultAxisConfig(model.theme), info);
+            setting.title.style = Object.assign({}, ApexChartsSetup.defaultAxisTitleFont(model.theme));
+            return setting;
+        });
+        const grid = Object.assign(Object.assign({}, ApexChartsSetup.defaultGridConfig(model.theme)), { yaxis: {
+                lines: {
+                    show: true
+                }
+            } });
+        // Legend settings
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries });
+        // Data label settings
+        const dataLabels = Object.assign(Object.assign({}, ApexChartsSetup.defaultDataLabelsConfig(model.theme)), { formatter: function (val, opts) {
+                return ApexChartsSetup.dataListFormatter(model, texts[opts.seriesIndex][opts.dataPointIndex], val);
+            } });
+        // Chart options settings
+        const plotOptions = {
+            bar: {
+                horizontal: false,
+                distributed: !isHistogram && !hasSeries,
+                columnWidth: isHistogram ? "100%" : (1 - ApexChartsSetup.defaultBarGap) * 100 + "%",
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        // RTL language handling
+        if (["ar", "fa"].indexOf(localization.currentLocale) !== -1) {
+            chart.direction = "rtl";
+        }
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries,
+            grid,
+            xaxis,
+            yaxis
+        };
+    }
+    static setupLine(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                series.push({
+                    name: seriesLabels[index],
+                    data: dataset
+                });
+            });
+        }
+        else {
+            // For simple questions
+            series.push({
+                name: "Values",
+                data: datasets[0]
+            });
+        }
+        // Chart settings
+        const chart = {
+            type: "line",
+            height: ApexChartsSetup.defaultChartHeight,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Axis settings
+        const xaxis = {
+            axisBorder: Object.assign({}, ApexChartsSetup.defaultAxisZerolineConfig(model.theme)),
+            categories: labels,
+            labels: {
+                style: Object.assign({}, ApexChartsSetup.defaultAxisLabelFont(model.theme))
+            }
+        };
+        const yaxis = model.getYAxisInfo().map(info => {
+            const setting = Object.assign(ApexChartsSetup.defaultAxisConfig(model.theme), info);
+            setting.title.style = Object.assign({}, ApexChartsSetup.defaultAxisTitleFont(model.theme));
+            return setting;
+        });
+        // Legend settings
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries });
+        // Data label settings
+        const dataLabels = {
+            enabled: false
+        };
+        // Chart options settings
+        const plotOptions = {
+            line: {
+                curve: "smooth"
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        // RTL language handling
+        if (["ar", "fa"].indexOf(localization.currentLocale) !== -1) {
+            chart.direction = "rtl";
+        }
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries,
+            xaxis,
+            yaxis
+        };
+    }
+    static setupStackedBar(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        const reversedAnswersData = reverseAll(labels, seriesLabels, colors, hasSeries, texts, datasets);
+        labels = reversedAnswersData.labels;
+        datasets = reversedAnswersData.datasets;
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                series.push({
+                    name: seriesLabels[index],
+                    data: dataset
+                });
+            });
+        }
+        else {
+            // For simple questions
+            series.push({
+                name: "Values",
+                data: datasets[0]
+            });
+        }
+        let lineHeight = 30;
+        let margin = 35;
+        let height = labels.length * lineHeight + 2 * margin;
+        if (hasSeries && (model.legendPosition === "top" || model.legendPosition === "bottom")) {
+            height += labels.length * lineHeight;
+        }
+        // Chart settings
+        const chart = {
+            type: "bar",
+            stacked: true,
+            height: height,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Axis settings
+        const maxValue = Math.max(...series[0].data.map((_, index) => series.reduce((sum, s) => sum + s.data[index], 0)));
+        const xaxis = Object.assign(Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme)), { categories: labels, max: Math.ceil(maxValue), axisBorder: Object.assign({}, ApexChartsSetup.defaultAxisZerolineConfig(model.theme)) });
+        const yaxis = Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme));
+        const grid = Object.assign(Object.assign({}, ApexChartsSetup.defaultGridConfig(model.theme)), { xaxis: {
+                lines: {
+                    show: true
+                }
+            } });
+        // Legend settings
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries });
+        // Data label settings
+        const dataLabels = Object.assign({}, ApexChartsSetup.defaultDataLabelsConfig(model.theme));
+        // Chart options settings
+        const plotOptions = {
+            bar: {
+                horizontal: true,
+                barHeight: (1 - ApexChartsSetup.defaultBarGap) * 100 + "%",
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        // RTL language handling
+        if (["ar", "fa"].indexOf(localization.currentLocale) !== -1) {
+            chart.direction = "rtl";
+        }
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries,
+            grid,
+            xaxis,
+            yaxis
+        };
+    }
+    static setupScatter(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        // Prepare data series
+        let series = [];
+        if (hasSeries) {
+            // For matrix questions or multiple series
+            datasets.forEach((dataset, index) => {
+                const scatterData = dataset.map((value, valueIndex) => ({
+                    x: valueIndex,
+                    y: value
+                }));
+                series.push({
+                    name: seriesLabels[index],
+                    data: scatterData
+                });
+            });
+        }
+        else {
+            // For simple questions
+            const scatterData = datasets[0].map((value, index) => ({
+                x: index,
+                y: value
+            }));
+            series.push({
+                name: "Values",
+                data: scatterData
+            });
+        }
+        // Chart settings
+        const chart = {
+            type: "scatter",
+            height: ApexChartsSetup.defaultChartHeight,
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+            background: "transparent"
+        };
+        // Axis settings
+        const xaxis = {
+            categories: labels,
+            axisBorder: Object.assign({}, ApexChartsSetup.defaultAxisZerolineConfig(model.theme)),
+            labels: {
+                style: Object.assign({}, ApexChartsSetup.defaultAxisLabelFont(model.theme))
+            }
+        };
+        const yaxis = Object.assign({}, ApexChartsSetup.defaultAxisConfig(model.theme));
+        // Legend settings
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries });
+        // Data label settings
+        const dataLabels = {
+            enabled: false
+        };
+        // Chart options settings
+        const plotOptions = {
+            scatter: {
+                size: 6
+            }
+        };
+        // Tooltip settings
+        const tooltip = ApexChartsSetup.defaultTooltipConfig(model.theme);
+        // RTL language handling
+        if (["ar", "fa"].indexOf(localization.currentLocale) !== -1) {
+            chart.direction = "rtl";
+        }
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            dataLabels,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            tooltip,
+            hasSeries,
+            xaxis,
+            yaxis
+        };
+    }
+    static setupGauge(model, answersData) {
+        let value = answersData.datasets[0][answersData.values.indexOf(model.displayValueName || "value")];
+        let minValue = answersData.datasets[0][answersData.values.indexOf("min")] || 0;
+        let maxValue = answersData.datasets[0][answersData.values.indexOf("max")] || value * 1.25;
+        if (model.dataType === "rating") {
+            const rateValues = model.question.visibleRateValues;
+            maxValue = rateValues[rateValues.length - 1].value;
+            minValue = rateValues[0].value;
+        }
+        if (NumberModel.showAsPercentage) {
+            value = DataHelper.toPercentage(value, maxValue);
+            minValue = DataHelper.toPercentage(minValue, maxValue);
+            maxValue = DataHelper.toPercentage(maxValue, maxValue);
+        }
+        const chart = {
+            type: "radialBar",
+            height: ApexChartsSetup.defaultChartHeight,
+            background: "transparent",
+            toolbar: {
+                show: false
+            }
+        };
+        const plotOptions = {
+            radialBar: {
+                startAngle: -90,
+                endAngle: 90,
+                track: {
+                    background: model.theme.gaugeBackground,
+                    strokeWidth: "97%",
+                },
+                dataLabels: {
+                    name: {
+                        show: false,
+                    },
+                    value: Object.assign(Object.assign({}, ApexChartsSetup.defaultGaugeValueFont(model.theme)), { show: true, offsetY: -10, formatter: function (val) {
+                            return isNaN(value) ? "_" : value.toString();
+                        } })
+                }
+            }
+        };
+        const percent = ((value - minValue) / (maxValue - minValue)) * 100;
+        const yaxis = {
+            min: minValue,
+            max: maxValue,
+            labels: {
+                formatter: (val) => {
+                    const realValue = minValue + (val / 100) * (maxValue - minValue);
+                    return realValue.toFixed(1);
+                }
+            }
+        };
+        const series = [percent];
+        const labels = [model.name];
+        const colors = [model.theme.gaugeBarColor];
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            yaxis,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+            // dataLabels,
+        };
+    }
+    static setupBullet(model, answersData) {
+        let value = answersData.datasets[0][answersData.values.indexOf(model.displayValueName || "value")];
+        let minValue = answersData.datasets[0][answersData.values.indexOf("min")] || 0;
+        let maxValue = answersData.datasets[0][answersData.values.indexOf("max")] || value * 1.25;
+        if (model.dataType === "rating") {
+            const rateValues = model.question.visibleRateValues;
+            maxValue = rateValues[rateValues.length - 1].value;
+            minValue = rateValues[0].value;
+        }
+        if (NumberModel.showAsPercentage) {
+            value = DataHelper.toPercentage(value, maxValue);
+            minValue = DataHelper.toPercentage(minValue, maxValue);
+            maxValue = DataHelper.toPercentage(maxValue, maxValue);
+        }
+        const chart = {
+            type: "bar",
+            height: 100,
+            background: "transparent",
+            toolbar: {
+                show: false
+            }
+        };
+        const plotOptions = {
+            bar: {
+                horizontal: true,
+            }
+        };
+        const dataLabels = {
+            enabled: false
+        };
+        const xaxis = {
+            min: minValue,
+            max: maxValue,
+            style: ApexChartsSetup.defaultGaugeTickFont(model.theme),
+            axisBorder: {
+                color: model.theme.gaugeBackground,
+            },
+        };
+        const yaxis = {
+            axisBorder: {
+                color: model.theme.gaugeBackground,
+            },
+            labels: {
+                offsetY: 10,
+                style: ApexChartsSetup.defaultGaugeValueFont(model.theme)
+            }
+        };
+        // Tooltip settings
+        const tooltip = { enabled: false };
+        const series = [{
+                data: [{
+                        x: "",
+                        y: value,
+                        goals: [{
+                                value: maxValue,
+                                strokeWidth: 1,
+                                strokeColor: model.theme.gaugeBackground,
+                            }]
+                    }]
+            }];
+        const labels = [value];
+        const colors = [model.theme.gaugeBarColor];
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            xaxis,
+            yaxis,
+            dataLabels,
+            tooltip,
+        };
+    }
+    static setupRadar(model, answersData) {
+        let { datasets, labels, colors, texts, seriesLabels, } = answersData;
+        const hasSeries = seriesLabels.length > 1 || model.dataType === "matrix";
+        const series = datasets.map((dataset, index) => {
+            const seriesName = hasSeries ? seriesLabels[index] : "";
+            return {
+                name: seriesName,
+                data: dataset
+            };
+        });
+        const chart = {
+            type: "radar",
+            height: ApexChartsSetup.defaultChartHeight,
+            background: "transparent",
+            toolbar: Object.assign({}, ApexChartsSetup.defaultToolbarConfig),
+        };
+        const plotOptions = {
+            radar: {
+                polygons: {
+                    strokeColors: model.theme.axisGridColor,
+                }
+            }
+        };
+        const radarLabelFont = model.theme.radarLabelFont;
+        const xaxis = {
+            labels: {
+                style: {
+                    colors: radarLabelFont.color,
+                    fontSize: radarLabelFont.size,
+                    fontFamily: radarLabelFont.family,
+                    fontWeight: radarLabelFont.weight,
+                },
+            },
+            categories: labels,
+        };
+        xaxis.labels.style.colors = Array(labels.length).fill(model.theme.axisLabelFont.color);
+        const yaxis = {
+            show: true,
+            labels: {
+                show: true,
+                style: Object.assign({}, ApexChartsSetup.defaultAxisLabelFont(model.theme))
+            },
+            tickAmount: 5
+        };
+        const legend = Object.assign(Object.assign({}, ApexChartsSetup.defaultLegendConfig(model)), { show: hasSeries, markers: {
+                width: 12,
+                height: 12,
+                radius: 6
+            } });
+        const tooltip = {
+            enabled: true,
+            style: Object.assign({}, ApexChartsSetup.defaultTooltipConfig(model.theme)),
+            y: {
+                formatter: function (val, opts) {
+                    const seriesName = opts.w.globals.seriesNames[opts.seriesIndex];
+                    const label = opts.w.globals.labels[opts.dataPointIndex];
+                    return !!seriesName ? `${seriesName}: ${val} (${label})` : `${label}: ${val}`;
+                }
+            }
+        };
+        return {
+            series,
+            chart,
+            labels,
+            colors,
+            plotOptions,
+            xaxis,
+            yaxis,
+            tooltip,
+            legend,
+            responsive: [Object.assign({}, ApexChartsSetup.defaultResponsive)],
+        };
+    }
+}
+ApexChartsSetup.imageExportFormat = "png";
+ApexChartsSetup.defaultChartHeight = 450;
+ApexChartsSetup.defaultBarGap = DashboardTheme.barGap;
+ApexChartsSetup.defaultToolbarConfig = {
+    show: true,
+    tools: {
+        download: true,
+        selection: true,
+        zoom: true,
+        zoomin: true,
+        zoomout: true,
+        pan: true,
+        reset: true
+    }
+};
+ApexChartsSetup.defaultStrokeConfig = {
+    width: 2,
+    curve: "smooth"
+};
+ApexChartsSetup.defaultFillConfig = {
+    type: "solid",
+    opacity: 0.8
+};
+ApexChartsSetup.defaultResponsive = {
+    breakpoint: 600,
+    options: {
+        legend: {
+            position: "bottom"
+        }
+    }
+};
+/**
+ * Fires when end user clicks on the 'save as image' button.
+ */
+ApexChartsSetup.onImageSaving = new Event();
+/**
+ * Fires before chart will be created. User can change series, chart options and config of the chart.
+ * Options is an object with the following fields: series, chart, xaxis, yaxis, labels, colors, plotOptions, dataLabels, legend, tooltip, grid and hasSeries.
+ */
+ApexChartsSetup.onChartCreating = new Event();
+ApexChartsSetup.setups = {
+    bar: ApexChartsSetup.setupBar,
+    vbar: ApexChartsSetup.setupVBar,
+    line: ApexChartsSetup.setupLine,
+    stackedbar: ApexChartsSetup.setupStackedBar,
+    doughnut: ApexChartsSetup.setupPie,
+    pie: ApexChartsSetup.setupPie,
+    scatter: ApexChartsSetup.setupScatter,
+    gauge: ApexChartsSetup.setupGauge,
+    bullet: ApexChartsSetup.setupBullet,
+    radar: ApexChartsSetup.setupRadar,
+    histogram: ApexChartsSetup.setupBar,
+    vhistogram: ApexChartsSetup.setupVBar,
+    stackedhistogram: ApexChartsSetup.setupStackedBar,
+};
+
+const chartTypes = {
+    "boolean": ["pie", "doughnut", "bar"],
+    "number": ["gauge", "bullet"],
+    "average": ["gauge", "bullet"],
+    "selectBase": ["bar", "vbar", "pie", "doughnut"],
+    "histogram": ["vhistogram", "histogram"],
+    "matrix": ["bar", "stackedbar", "pie", "doughnut"],
+    "matrixDropdownGrouped": ["stackedbar", "bar", "pie", "doughnut"],
+    "pivot": ["vbar", "bar", "line", "stackedbar", "pie", "doughnut"], // ["vbar", "bar"];
+    "ranking": ["bar", "vbar", "pie", "doughnut", "radar"],
+};
+class ApexChartsAdapter {
+    static getChartTypesByVisualizerType(vType) {
+        return (chartTypes[vType] || []).slice();
+    }
+    updatePieCharts(options, chartOptions, chartNode) {
+        if (this._pieCharts) {
+            this._pieCharts.forEach((chart) => chart.updateOptions(options));
+        }
+        else {
+            chartNode.classList.add("sa-pie-charts");
+            this._pieCharts = chartOptions.series.map((s, i) => {
+                const chartDiv = document.createElement("div");
+                chartDiv.id = "sa-chart" + i;
+                chartDiv.classList.add("sa-pie-chart");
+                chartNode.appendChild(chartDiv);
+                const _options = Object.assign({}, options, {
+                    series: s.series,
+                    labels: s.labels
+                });
+                _options.title.text = s.title;
+                removeUndefinedProperties(_options);
+                const chart = new ApexCharts(chartDiv, _options);
+                return chart;
+            });
+            this._pieCharts.forEach((chart) => chart.render());
+        }
+    }
+    constructor(model) {
+        this.model = model;
+        this._chart = undefined;
+        this._pieCharts = undefined;
+    }
+    patchConfigParameters(chartNode, options) { }
+    get chart() {
+        return this._chart;
+    }
+    getChartTypes() {
+        const visualizerType = this.model.type;
+        const chartCtypes = chartTypes[visualizerType];
+        return (chartCtypes || []).slice();
+    }
+    create(chartNode) {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this.update(chartNode);
+            const currentCharts = this._pieCharts || [this._chart];
+            if (this.model instanceof SelectBase) {
+                // Handle chart clicks
+                this.model;
+            }
+            return currentCharts;
+        });
+    }
+    update(chartNode) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const _chartType = this.model.chartType;
+            const answersData = yield this.model.getAnswersData();
+            var chartOptions = ApexChartsSetup.setup(_chartType, this.model, answersData);
+            if (this.model instanceof SelectBase && this.model.supportSelection) {
+                const _model = this.model;
+                chartOptions.chart.events = {
+                    dataPointMouseEnter: function () { chartNode.style.cursor = "pointer"; },
+                    dataPointMouseLeave: function () { chartNode.style.cursor = ""; },
+                    dataPointSelection: function (event, chartContext, opts) {
+                        if (opts.dataPointIndex !== undefined && opts.seriesIndex !== undefined) {
+                            let itemText = "";
+                            if (!chartOptions.hasSeries) {
+                                itemText = config.labels[opts.dataPointIndex];
+                                const item = _model.getSelectedItemByText(itemText);
+                                _model.setSelection(item);
+                            }
+                            else {
+                                itemText = config.series[opts.seriesIndex].name;
+                                const propertyLabel = config.labels[opts.dataPointIndex];
+                                const seriesValues = _model.getSeriesValues();
+                                const seriesLabels = _model.getSeriesLabels();
+                                const propertyValue = seriesValues[seriesLabels.indexOf(propertyLabel)];
+                                const selectedItem = _model.getSelectedItemByText(itemText);
+                                const item = new ItemValue({ [propertyValue]: selectedItem.value }, propertyLabel + ": " + selectedItem.text);
+                                _model.setSelection(item);
+                            }
+                        }
+                        // The last parameter opts contains additional information like `seriesIndex` and `dataPointIndex` for cartesian charts
+                        /*if (data.points.length > 0) {
+                            let itemText = "";
+                            if (!chartOptions.hasSeries) {
+                              itemText = Array.isArray(data.points[0].customdata)
+                                ? data.points[0].customdata[0]
+                                : data.points[0].customdata;
+                              const item: ItemValue = _model.getSelectedItemByText(itemText);
+                              _model.setSelection(item);
+                            } else {
+                              itemText = data.points[0].data.name;
+                              const propertyLabel = data.points[0].label;
+                              // const seriesValues = this.model.getSeriesValues();
+                              // const seriesLabels = this.model.getSeriesLabels();
+                              // const propertyValue = seriesValues[seriesLabels.indexOf(propertyLabel)];
+                              // const selectedItem: ItemValue = _model.getSelectedItemByText(itemText);
+                              // const item = new ItemValue({ [propertyValue]: selectedItem.value }, propertyLabel + ": " + selectedItem.text);
+                              // _model.setSelection(item);
+                            }
+                          }*/
+                    }
+                };
+            }
+            let config = Object.assign({ chart: Object.assign(Object.assign({}, chartOptions.chart), { locales: [{
+                            name: localization.currentLocale,
+                        }], defaultLocale: localization.currentLocale }) }, chartOptions);
+            this.patchConfigParameters(chartNode, config);
+            let options = Object.assign({}, config);
+            ApexChartsSetup.onChartCreating.fire(this.model, options);
+            if ((_chartType === "pie" || _chartType === "doughnut") && chartOptions.series.length > 0 && typeof chartOptions.series[0] !== "number") {
+                this.updatePieCharts(options, chartOptions, chartNode);
+            }
+            else {
+                const availableUpdateOptions = this._chart && !!this._chart["el"] && this._chart["el"].getRootNode() === document;
+                if (availableUpdateOptions) {
+                    yield this._chart.updateOptions({ series: options.series });
+                }
+                else {
+                    removeUndefinedProperties(options);
+                    this._chart = new ApexCharts(chartNode, options);
+                    yield this._chart.render();
+                }
+            }
+            return chartOptions;
+        });
+    }
+    destroy(node) {
+        if (this._chart) {
+            this._chart.destroy();
+            this._chart = undefined;
+        }
+        if (this._pieCharts) {
+            this._pieCharts.forEach(ch => ch.destroy());
+            this._pieCharts = undefined;
+        }
+    }
+}
+VisualizerBase.chartAdapterType = ApexChartsAdapter;
+
+export { ApexChartsAdapter, ApexChartsSetup, DashboardTheme, NumberModel, SelectBase, VisualizerBase, chartTypes, localization };
+//# sourceMappingURL=survey.analytics.apexcharts.mjs.map