genesys-spark-chart-components 4.259.0 → 4.260.0
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/dist/cjs/{color-palette-BSzpW4GK.js → color-palette-CzHvvshC.js} +1 -1
- package/dist/cjs/genesys-chart-webcomponents.cjs.js +1 -1
- package/dist/cjs/gux-chart-column-beta.cjs.entry.js +1 -1
- package/dist/cjs/gux-chart-donut-beta.cjs.entry.js +1 -1
- package/dist/cjs/gux-chart-line-beta.cjs.entry.js +16 -8
- package/dist/cjs/gux-chart-pie-beta.cjs.entry.js +1 -1
- package/dist/cjs/gux-chart-scatter-plot-beta.cjs.entry.js +17 -10
- package/dist/cjs/gux-visualization-beta.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/beta/gux-chart-line/gux-chart-line.js +55 -7
- package/dist/collection/components/beta/gux-chart-scatter-plot/gux-chart-scatter-plot.js +56 -9
- package/dist/esm/{color-palette-CcWpusnC.js → color-palette-C1fbSF56.js} +1 -1
- package/dist/esm/genesys-chart-webcomponents.js +1 -1
- package/dist/esm/gux-chart-column-beta.entry.js +1 -1
- package/dist/esm/gux-chart-donut-beta.entry.js +1 -1
- package/dist/esm/gux-chart-line-beta.entry.js +16 -8
- package/dist/esm/gux-chart-pie-beta.entry.js +1 -1
- package/dist/esm/gux-chart-scatter-plot-beta.entry.js +17 -10
- package/dist/esm/gux-visualization-beta.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/genesys-chart-webcomponents/genesys-chart-webcomponents.esm.js +1 -1
- package/dist/genesys-chart-webcomponents/{p-2e2e16b6.entry.js → p-0f2b5235.entry.js} +1 -1
- package/dist/genesys-chart-webcomponents/{p-0331421b.entry.js → p-1d961430.entry.js} +1 -1
- package/dist/genesys-chart-webcomponents/{p-faded9ed.entry.js → p-4b8df1e2.entry.js} +1 -1
- package/dist/genesys-chart-webcomponents/{p-703078ad.entry.js → p-60467401.entry.js} +1 -1
- package/dist/genesys-chart-webcomponents/{p-CcWpusnC.js → p-C1fbSF56.js} +1 -1
- package/dist/genesys-chart-webcomponents/p-bebe3cf9.entry.js +1 -0
- package/dist/genesys-chart-webcomponents/p-ffb72c32.entry.js +1 -0
- package/dist/types/components/beta/gux-chart-line/gux-chart-line.d.ts +8 -0
- package/dist/types/components/beta/gux-chart-scatter-plot/gux-chart-scatter-plot.d.ts +8 -0
- package/dist/types/components.d.ts +44 -0
- package/package.json +3 -3
- package/dist/genesys-chart-webcomponents/p-0de46068.entry.js +0 -1
- package/dist/genesys-chart-webcomponents/p-eecd3298.entry.js +0 -1
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["gux-visualization-beta.cjs",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta.cjs",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta.cjs",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta.cjs",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta.cjs",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta.cjs",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
22
|
+
return index.bootstrapLazy([["gux-visualization-beta.cjs",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta.cjs",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta.cjs",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta.cjs",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta.cjs",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta.cjs",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
var logError = require('./log-error-BMPVm36Q.js');
|
|
6
6
|
|
|
7
7
|
const guxChartColumnCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c;}gux-visualization-beta .mark-rect.layer_0_marks path{fill:url(#diagonalHatch0)}gux-visualization-beta{}gux-visualization-beta .mark-rect.layer_1_marks path{fill:#1da8b3}`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
var logError = require('./log-error-BMPVm36Q.js');
|
|
6
6
|
|
|
7
7
|
const guxChartDonutCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
var logError = require('./log-error-BMPVm36Q.js');
|
|
6
6
|
|
|
7
7
|
const guxChartLineCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -53,15 +53,19 @@ const GuxLineChart = class {
|
|
|
53
53
|
}
|
|
54
54
|
};
|
|
55
55
|
this.legendPosition = 'right';
|
|
56
|
+
/**
|
|
57
|
+
* If true, display gridlines along the x-axis
|
|
58
|
+
*/
|
|
59
|
+
this.xGridVisible = true;
|
|
60
|
+
/**
|
|
61
|
+
* If true, display gridlines along the y-axis
|
|
62
|
+
*/
|
|
63
|
+
this.yGridVisible = false;
|
|
56
64
|
}
|
|
57
65
|
parseData() {
|
|
58
66
|
if (!this.xFieldName || !this.yFieldName) {
|
|
59
67
|
logError.logError(this.root, 'requires x-field-name and y-field-name');
|
|
60
68
|
}
|
|
61
|
-
let chartData = {};
|
|
62
|
-
if (this.chartData) {
|
|
63
|
-
chartData = { data: this.chartData };
|
|
64
|
-
}
|
|
65
69
|
if (this.xTickLabelSlant) {
|
|
66
70
|
this.baseChartSpec.config.axisX.labelAngle = 45;
|
|
67
71
|
}
|
|
@@ -81,12 +85,14 @@ const GuxLineChart = class {
|
|
|
81
85
|
if (xFieldName) {
|
|
82
86
|
this.baseChartSpec.encoding.x.field = xFieldName;
|
|
83
87
|
}
|
|
88
|
+
this.baseChartSpec.encoding.x.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.x.axis), { grid: this.yGridVisible });
|
|
84
89
|
if (xAxisTitle) {
|
|
85
90
|
this.baseChartSpec.encoding.x.title = xAxisTitle;
|
|
86
91
|
}
|
|
87
92
|
if (yFieldName) {
|
|
88
93
|
this.baseChartSpec.encoding.y.field = yFieldName;
|
|
89
94
|
}
|
|
95
|
+
this.baseChartSpec.encoding.y.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.y.axis), { grid: this.xGridVisible });
|
|
90
96
|
if (yAxisTitle) {
|
|
91
97
|
this.baseChartSpec.encoding.y.title = yAxisTitle;
|
|
92
98
|
}
|
|
@@ -106,15 +112,17 @@ const GuxLineChart = class {
|
|
|
106
112
|
if (includeDataPointMarkers) {
|
|
107
113
|
this.baseChartSpec.mark.point = includeDataPointMarkers;
|
|
108
114
|
}
|
|
109
|
-
|
|
110
|
-
|
|
115
|
+
if (this.chartData) {
|
|
116
|
+
this.baseChartSpec.data = this.chartData;
|
|
117
|
+
}
|
|
118
|
+
this.visualizationSpec = JSON.parse(JSON.stringify(this.baseChartSpec));
|
|
111
119
|
}
|
|
112
120
|
componentWillLoad() {
|
|
113
121
|
colorPalette.trackComponent(this.root);
|
|
114
122
|
this.parseData();
|
|
115
123
|
}
|
|
116
124
|
render() {
|
|
117
|
-
return (index.h("gux-visualization-beta", { key: '
|
|
125
|
+
return (index.h("gux-visualization-beta", { key: 'f0d52101782cd4c59f787b6d26ef2b627b637f90', visualizationSpec: this.visualizationSpec }));
|
|
118
126
|
}
|
|
119
127
|
get root() { return index.getElement(this); }
|
|
120
128
|
static get watchers() { return {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
var logError = require('./log-error-BMPVm36Q.js');
|
|
6
6
|
|
|
7
7
|
const guxChartPieCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
var logError = require('./log-error-BMPVm36Q.js');
|
|
6
6
|
|
|
7
7
|
const guxChartScatterPlotCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -36,8 +36,7 @@ const GuxScatterPlotChart = class {
|
|
|
36
36
|
domainColor: colorPalette.DEFAULT_DOMAIN_COLOR
|
|
37
37
|
},
|
|
38
38
|
axisX: {
|
|
39
|
-
labelAngle: 0
|
|
40
|
-
grid: true
|
|
39
|
+
labelAngle: 0
|
|
41
40
|
},
|
|
42
41
|
legend: {
|
|
43
42
|
symbolType: 'circle'
|
|
@@ -66,15 +65,19 @@ const GuxScatterPlotChart = class {
|
|
|
66
65
|
}
|
|
67
66
|
};
|
|
68
67
|
this.legendPosition = 'right';
|
|
68
|
+
/**
|
|
69
|
+
* If true, display gridlines along the x-axis
|
|
70
|
+
*/
|
|
71
|
+
this.xGridVisible = true;
|
|
72
|
+
/**
|
|
73
|
+
* If true, display gridlines along the y-axis
|
|
74
|
+
*/
|
|
75
|
+
this.yGridVisible = false;
|
|
69
76
|
}
|
|
70
77
|
parseData() {
|
|
71
78
|
if (!this.xFieldName || !this.yFieldName) {
|
|
72
79
|
logError.logError(this.root, 'requires x-field-name and y-field-name');
|
|
73
80
|
}
|
|
74
|
-
let chartData = {};
|
|
75
|
-
if (this.chartData) {
|
|
76
|
-
chartData = { data: this.chartData };
|
|
77
|
-
}
|
|
78
81
|
if (this.xTickLabelSlant) {
|
|
79
82
|
this.baseChartSpec.config.axisX.labelAngle = -45;
|
|
80
83
|
}
|
|
@@ -92,12 +95,14 @@ const GuxScatterPlotChart = class {
|
|
|
92
95
|
if (xFieldName) {
|
|
93
96
|
this.baseChartSpec.encoding.x.field = xFieldName;
|
|
94
97
|
}
|
|
98
|
+
this.baseChartSpec.encoding.x.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.x.axis), { grid: this.yGridVisible });
|
|
95
99
|
if (xAxisTitle) {
|
|
96
100
|
this.baseChartSpec.encoding.x.title = xAxisTitle;
|
|
97
101
|
}
|
|
98
102
|
if (yFieldName) {
|
|
99
103
|
this.baseChartSpec.encoding.y.field = yFieldName;
|
|
100
104
|
}
|
|
105
|
+
this.baseChartSpec.encoding.y.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.y.axis), { grid: this.xGridVisible });
|
|
101
106
|
if (yAxisTitle) {
|
|
102
107
|
this.baseChartSpec.encoding.y.title = yAxisTitle;
|
|
103
108
|
}
|
|
@@ -116,15 +121,17 @@ const GuxScatterPlotChart = class {
|
|
|
116
121
|
{ field: yFieldName, type: 'quantitative', title: yAxisTitle },
|
|
117
122
|
{ field: colorFieldName, type: 'nominal', title: legendTitle }
|
|
118
123
|
];
|
|
119
|
-
|
|
120
|
-
|
|
124
|
+
if (this.chartData) {
|
|
125
|
+
this.baseChartSpec.data = this.chartData;
|
|
126
|
+
}
|
|
127
|
+
this.visualizationSpec = JSON.parse(JSON.stringify(this.baseChartSpec));
|
|
121
128
|
}
|
|
122
129
|
componentWillLoad() {
|
|
123
130
|
colorPalette.trackComponent(this.root);
|
|
124
131
|
this.parseData();
|
|
125
132
|
}
|
|
126
133
|
render() {
|
|
127
|
-
return (index.h("gux-visualization-beta", { key: '
|
|
134
|
+
return (index.h("gux-visualization-beta", { key: '8e87c0daedfbc677eb570ee954742ed058b617ed', visualizationSpec: this.visualizationSpec }));
|
|
128
135
|
}
|
|
129
136
|
get root() { return index.getElement(this); }
|
|
130
137
|
static get watchers() { return {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var index$2 = require('./index-B2yCxXKo.js');
|
|
4
|
-
var colorPalette = require('./color-palette-
|
|
4
|
+
var colorPalette = require('./color-palette-CzHvvshC.js');
|
|
5
5
|
|
|
6
6
|
// Note: This regex matches even invalid JSON strings, but since we’re
|
|
7
7
|
// working on the output of `JSON.stringify` we know that only valid strings
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
|
|
|
6
6
|
const defineCustomElements = async (win, options) => {
|
|
7
7
|
if (typeof window === 'undefined') return undefined;
|
|
8
8
|
await appGlobals.globalScripts();
|
|
9
|
-
return index.bootstrapLazy([["gux-visualization-beta.cjs",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta.cjs",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta.cjs",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta.cjs",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta.cjs",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta.cjs",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
9
|
+
return index.bootstrapLazy([["gux-visualization-beta.cjs",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta.cjs",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta.cjs",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta.cjs",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta.cjs",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta.cjs",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
10
10
|
};
|
|
11
11
|
|
|
12
12
|
exports.setNonce = index.setNonce;
|
|
@@ -49,15 +49,19 @@ export class GuxLineChart {
|
|
|
49
49
|
}
|
|
50
50
|
};
|
|
51
51
|
this.legendPosition = 'right';
|
|
52
|
+
/**
|
|
53
|
+
* If true, display gridlines along the x-axis
|
|
54
|
+
*/
|
|
55
|
+
this.xGridVisible = true;
|
|
56
|
+
/**
|
|
57
|
+
* If true, display gridlines along the y-axis
|
|
58
|
+
*/
|
|
59
|
+
this.yGridVisible = false;
|
|
52
60
|
}
|
|
53
61
|
parseData() {
|
|
54
62
|
if (!this.xFieldName || !this.yFieldName) {
|
|
55
63
|
logError(this.root, 'requires x-field-name and y-field-name');
|
|
56
64
|
}
|
|
57
|
-
let chartData = {};
|
|
58
|
-
if (this.chartData) {
|
|
59
|
-
chartData = { data: this.chartData };
|
|
60
|
-
}
|
|
61
65
|
if (this.xTickLabelSlant) {
|
|
62
66
|
this.baseChartSpec.config.axisX.labelAngle = 45;
|
|
63
67
|
}
|
|
@@ -77,12 +81,14 @@ export class GuxLineChart {
|
|
|
77
81
|
if (xFieldName) {
|
|
78
82
|
this.baseChartSpec.encoding.x.field = xFieldName;
|
|
79
83
|
}
|
|
84
|
+
this.baseChartSpec.encoding.x.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.x.axis), { grid: this.yGridVisible });
|
|
80
85
|
if (xAxisTitle) {
|
|
81
86
|
this.baseChartSpec.encoding.x.title = xAxisTitle;
|
|
82
87
|
}
|
|
83
88
|
if (yFieldName) {
|
|
84
89
|
this.baseChartSpec.encoding.y.field = yFieldName;
|
|
85
90
|
}
|
|
91
|
+
this.baseChartSpec.encoding.y.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.y.axis), { grid: this.xGridVisible });
|
|
86
92
|
if (yAxisTitle) {
|
|
87
93
|
this.baseChartSpec.encoding.y.title = yAxisTitle;
|
|
88
94
|
}
|
|
@@ -102,15 +108,17 @@ export class GuxLineChart {
|
|
|
102
108
|
if (includeDataPointMarkers) {
|
|
103
109
|
this.baseChartSpec.mark.point = includeDataPointMarkers;
|
|
104
110
|
}
|
|
105
|
-
|
|
106
|
-
|
|
111
|
+
if (this.chartData) {
|
|
112
|
+
this.baseChartSpec.data = this.chartData;
|
|
113
|
+
}
|
|
114
|
+
this.visualizationSpec = JSON.parse(JSON.stringify(this.baseChartSpec));
|
|
107
115
|
}
|
|
108
116
|
componentWillLoad() {
|
|
109
117
|
trackComponent(this.root);
|
|
110
118
|
this.parseData();
|
|
111
119
|
}
|
|
112
120
|
render() {
|
|
113
|
-
return (h("gux-visualization-beta", { key: '
|
|
121
|
+
return (h("gux-visualization-beta", { key: 'f0d52101782cd4c59f787b6d26ef2b627b637f90', visualizationSpec: this.visualizationSpec }));
|
|
114
122
|
}
|
|
115
123
|
static get is() { return "gux-chart-line-beta"; }
|
|
116
124
|
static get encapsulation() { return "shadow"; }
|
|
@@ -379,6 +387,46 @@ export class GuxLineChart {
|
|
|
379
387
|
"reflect": false,
|
|
380
388
|
"attribute": "color-field-name"
|
|
381
389
|
},
|
|
390
|
+
"xGridVisible": {
|
|
391
|
+
"type": "boolean",
|
|
392
|
+
"mutable": false,
|
|
393
|
+
"complexType": {
|
|
394
|
+
"original": "boolean",
|
|
395
|
+
"resolved": "boolean",
|
|
396
|
+
"references": {}
|
|
397
|
+
},
|
|
398
|
+
"required": false,
|
|
399
|
+
"optional": false,
|
|
400
|
+
"docs": {
|
|
401
|
+
"tags": [],
|
|
402
|
+
"text": "If true, display gridlines along the x-axis"
|
|
403
|
+
},
|
|
404
|
+
"getter": false,
|
|
405
|
+
"setter": false,
|
|
406
|
+
"reflect": false,
|
|
407
|
+
"attribute": "x-grid-visible",
|
|
408
|
+
"defaultValue": "true"
|
|
409
|
+
},
|
|
410
|
+
"yGridVisible": {
|
|
411
|
+
"type": "boolean",
|
|
412
|
+
"mutable": false,
|
|
413
|
+
"complexType": {
|
|
414
|
+
"original": "boolean",
|
|
415
|
+
"resolved": "boolean",
|
|
416
|
+
"references": {}
|
|
417
|
+
},
|
|
418
|
+
"required": false,
|
|
419
|
+
"optional": false,
|
|
420
|
+
"docs": {
|
|
421
|
+
"tags": [],
|
|
422
|
+
"text": "If true, display gridlines along the y-axis"
|
|
423
|
+
},
|
|
424
|
+
"getter": false,
|
|
425
|
+
"setter": false,
|
|
426
|
+
"reflect": false,
|
|
427
|
+
"attribute": "y-grid-visible",
|
|
428
|
+
"defaultValue": "false"
|
|
429
|
+
},
|
|
382
430
|
"strokeDash": {
|
|
383
431
|
"type": "boolean",
|
|
384
432
|
"mutable": false,
|
|
@@ -32,8 +32,7 @@ export class GuxScatterPlotChart {
|
|
|
32
32
|
domainColor: VisualizationColorUtil.DEFAULT_DOMAIN_COLOR
|
|
33
33
|
},
|
|
34
34
|
axisX: {
|
|
35
|
-
labelAngle: 0
|
|
36
|
-
grid: true
|
|
35
|
+
labelAngle: 0
|
|
37
36
|
},
|
|
38
37
|
legend: {
|
|
39
38
|
symbolType: 'circle'
|
|
@@ -62,15 +61,19 @@ export class GuxScatterPlotChart {
|
|
|
62
61
|
}
|
|
63
62
|
};
|
|
64
63
|
this.legendPosition = 'right';
|
|
64
|
+
/**
|
|
65
|
+
* If true, display gridlines along the x-axis
|
|
66
|
+
*/
|
|
67
|
+
this.xGridVisible = true;
|
|
68
|
+
/**
|
|
69
|
+
* If true, display gridlines along the y-axis
|
|
70
|
+
*/
|
|
71
|
+
this.yGridVisible = false;
|
|
65
72
|
}
|
|
66
73
|
parseData() {
|
|
67
74
|
if (!this.xFieldName || !this.yFieldName) {
|
|
68
75
|
logError(this.root, 'requires x-field-name and y-field-name');
|
|
69
76
|
}
|
|
70
|
-
let chartData = {};
|
|
71
|
-
if (this.chartData) {
|
|
72
|
-
chartData = { data: this.chartData };
|
|
73
|
-
}
|
|
74
77
|
if (this.xTickLabelSlant) {
|
|
75
78
|
this.baseChartSpec.config.axisX.labelAngle = -45;
|
|
76
79
|
}
|
|
@@ -88,12 +91,14 @@ export class GuxScatterPlotChart {
|
|
|
88
91
|
if (xFieldName) {
|
|
89
92
|
this.baseChartSpec.encoding.x.field = xFieldName;
|
|
90
93
|
}
|
|
94
|
+
this.baseChartSpec.encoding.x.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.x.axis), { grid: this.yGridVisible });
|
|
91
95
|
if (xAxisTitle) {
|
|
92
96
|
this.baseChartSpec.encoding.x.title = xAxisTitle;
|
|
93
97
|
}
|
|
94
98
|
if (yFieldName) {
|
|
95
99
|
this.baseChartSpec.encoding.y.field = yFieldName;
|
|
96
100
|
}
|
|
101
|
+
this.baseChartSpec.encoding.y.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.y.axis), { grid: this.xGridVisible });
|
|
97
102
|
if (yAxisTitle) {
|
|
98
103
|
this.baseChartSpec.encoding.y.title = yAxisTitle;
|
|
99
104
|
}
|
|
@@ -112,15 +117,17 @@ export class GuxScatterPlotChart {
|
|
|
112
117
|
{ field: yFieldName, type: 'quantitative', title: yAxisTitle },
|
|
113
118
|
{ field: colorFieldName, type: 'nominal', title: legendTitle }
|
|
114
119
|
];
|
|
115
|
-
|
|
116
|
-
|
|
120
|
+
if (this.chartData) {
|
|
121
|
+
this.baseChartSpec.data = this.chartData;
|
|
122
|
+
}
|
|
123
|
+
this.visualizationSpec = JSON.parse(JSON.stringify(this.baseChartSpec));
|
|
117
124
|
}
|
|
118
125
|
componentWillLoad() {
|
|
119
126
|
trackComponent(this.root);
|
|
120
127
|
this.parseData();
|
|
121
128
|
}
|
|
122
129
|
render() {
|
|
123
|
-
return (h("gux-visualization-beta", { key: '
|
|
130
|
+
return (h("gux-visualization-beta", { key: '8e87c0daedfbc677eb570ee954742ed058b617ed', visualizationSpec: this.visualizationSpec }));
|
|
124
131
|
}
|
|
125
132
|
static get is() { return "gux-chart-scatter-plot-beta"; }
|
|
126
133
|
static get encapsulation() { return "shadow"; }
|
|
@@ -389,6 +396,46 @@ export class GuxScatterPlotChart {
|
|
|
389
396
|
"reflect": false,
|
|
390
397
|
"attribute": "use-shape"
|
|
391
398
|
},
|
|
399
|
+
"xGridVisible": {
|
|
400
|
+
"type": "boolean",
|
|
401
|
+
"mutable": false,
|
|
402
|
+
"complexType": {
|
|
403
|
+
"original": "boolean",
|
|
404
|
+
"resolved": "boolean",
|
|
405
|
+
"references": {}
|
|
406
|
+
},
|
|
407
|
+
"required": false,
|
|
408
|
+
"optional": false,
|
|
409
|
+
"docs": {
|
|
410
|
+
"tags": [],
|
|
411
|
+
"text": "If true, display gridlines along the x-axis"
|
|
412
|
+
},
|
|
413
|
+
"getter": false,
|
|
414
|
+
"setter": false,
|
|
415
|
+
"reflect": false,
|
|
416
|
+
"attribute": "x-grid-visible",
|
|
417
|
+
"defaultValue": "true"
|
|
418
|
+
},
|
|
419
|
+
"yGridVisible": {
|
|
420
|
+
"type": "boolean",
|
|
421
|
+
"mutable": false,
|
|
422
|
+
"complexType": {
|
|
423
|
+
"original": "boolean",
|
|
424
|
+
"resolved": "boolean",
|
|
425
|
+
"references": {}
|
|
426
|
+
},
|
|
427
|
+
"required": false,
|
|
428
|
+
"optional": false,
|
|
429
|
+
"docs": {
|
|
430
|
+
"tags": [],
|
|
431
|
+
"text": "If true, display gridlines along the y-axis"
|
|
432
|
+
},
|
|
433
|
+
"getter": false,
|
|
434
|
+
"setter": false,
|
|
435
|
+
"reflect": false,
|
|
436
|
+
"attribute": "y-grid-visible",
|
|
437
|
+
"defaultValue": "false"
|
|
438
|
+
},
|
|
392
439
|
"embedOptions": {
|
|
393
440
|
"type": "unknown",
|
|
394
441
|
"mutable": false,
|
|
@@ -17,5 +17,5 @@ var patchBrowser = () => {
|
|
|
17
17
|
|
|
18
18
|
patchBrowser().then(async (options) => {
|
|
19
19
|
await globalScripts();
|
|
20
|
-
return bootstrapLazy([["gux-visualization-beta",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
20
|
+
return bootstrapLazy([["gux-visualization-beta",[[1,"gux-visualization-beta",{"visualizationSpec":[16],"embedOptions":[16],"screenreaderDescription":[1,"screenreader-description"]}]]],["gux-chart-column-beta",[[1,"gux-chart-column-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"xFieldName":[1,"x-field-name"],"yFieldName":[1,"y-field-name"],"xAxisTitle":[1,"x-axis-title"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"legendPosition":[1,"legend-position"],"chartLayers":[16],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-donut-beta",[[1,"gux-chart-donut-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"innerRadius":[2,"inner-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"gauge":[4],"centerText":[1,"center-text"],"centerSubText":[1,"center-sub-text"],"showTooltip":[4,"show-tooltip"],"tooltipOptions":[16],"legendX":[2,"legend-x"],"legendY":[2,"legend-y"],"legendFontSize":[2,"legend-font-size"],"legendSymbolSize":[2,"legend-symbol-size"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-line-beta",[[1,"gux-chart-line-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"includeDataPointMarkers":[4,"include-data-point-markers"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"strokeDash":[4,"stroke-dash"],"interpolation":[1],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-pie-beta",[[1,"gux-chart-pie-beta",{"chartData":[16],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"outerRadius":[2,"outer-radius"],"labelRadius":[2,"label-radius"],"labelField":[1,"label-field"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]],["gux-chart-scatter-plot-beta",[[1,"gux-chart-scatter-plot-beta",{"labelColor":[1,"label-color"],"domainColor":[1,"domain-color"],"chartData":[16],"xTickLabelSlant":[4,"x-tick-label-slant"],"includeLegend":[4,"include-legend"],"legendPosition":[1,"legend-position"],"xFieldName":[1,"x-field-name"],"xAxisTitle":[1,"x-axis-title"],"yFieldName":[1,"y-field-name"],"yAxisTitle":[1,"y-axis-title"],"legendTitle":[1,"legend-title"],"colorFieldName":[1,"color-field-name"],"useShape":[1,"use-shape"],"xGridVisible":[4,"x-grid-visible"],"yGridVisible":[4,"y-grid-visible"],"embedOptions":[16]},null,{"chartData":[{"parseData":0}]}]]]], options);
|
|
21
21
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement } from './index-B1rXZ1zs.js';
|
|
2
|
-
import { D as DEFAULT_LABEL_COLOR, a as DEFAULT_DOMAIN_COLOR, V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-
|
|
2
|
+
import { D as DEFAULT_LABEL_COLOR, a as DEFAULT_DOMAIN_COLOR, V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-C1fbSF56.js';
|
|
3
3
|
import { l as logError } from './log-error-nsqlWzyl.js';
|
|
4
4
|
|
|
5
5
|
const guxChartColumnCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c;}gux-visualization-beta .mark-rect.layer_0_marks path{fill:url(#diagonalHatch0)}gux-visualization-beta{}gux-visualization-beta .mark-rect.layer_1_marks path{fill:#1da8b3}`;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement } from './index-B1rXZ1zs.js';
|
|
2
|
-
import { V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-
|
|
2
|
+
import { V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-C1fbSF56.js';
|
|
3
3
|
import { l as logError } from './log-error-nsqlWzyl.js';
|
|
4
4
|
|
|
5
5
|
const guxChartDonutCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement } from './index-B1rXZ1zs.js';
|
|
2
|
-
import { D as DEFAULT_LABEL_COLOR, a as DEFAULT_DOMAIN_COLOR, V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-
|
|
2
|
+
import { D as DEFAULT_LABEL_COLOR, a as DEFAULT_DOMAIN_COLOR, V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-C1fbSF56.js';
|
|
3
3
|
import { l as logError } from './log-error-nsqlWzyl.js';
|
|
4
4
|
|
|
5
5
|
const guxChartLineCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|
|
@@ -51,15 +51,19 @@ const GuxLineChart = class {
|
|
|
51
51
|
}
|
|
52
52
|
};
|
|
53
53
|
this.legendPosition = 'right';
|
|
54
|
+
/**
|
|
55
|
+
* If true, display gridlines along the x-axis
|
|
56
|
+
*/
|
|
57
|
+
this.xGridVisible = true;
|
|
58
|
+
/**
|
|
59
|
+
* If true, display gridlines along the y-axis
|
|
60
|
+
*/
|
|
61
|
+
this.yGridVisible = false;
|
|
54
62
|
}
|
|
55
63
|
parseData() {
|
|
56
64
|
if (!this.xFieldName || !this.yFieldName) {
|
|
57
65
|
logError(this.root, 'requires x-field-name and y-field-name');
|
|
58
66
|
}
|
|
59
|
-
let chartData = {};
|
|
60
|
-
if (this.chartData) {
|
|
61
|
-
chartData = { data: this.chartData };
|
|
62
|
-
}
|
|
63
67
|
if (this.xTickLabelSlant) {
|
|
64
68
|
this.baseChartSpec.config.axisX.labelAngle = 45;
|
|
65
69
|
}
|
|
@@ -79,12 +83,14 @@ const GuxLineChart = class {
|
|
|
79
83
|
if (xFieldName) {
|
|
80
84
|
this.baseChartSpec.encoding.x.field = xFieldName;
|
|
81
85
|
}
|
|
86
|
+
this.baseChartSpec.encoding.x.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.x.axis), { grid: this.yGridVisible });
|
|
82
87
|
if (xAxisTitle) {
|
|
83
88
|
this.baseChartSpec.encoding.x.title = xAxisTitle;
|
|
84
89
|
}
|
|
85
90
|
if (yFieldName) {
|
|
86
91
|
this.baseChartSpec.encoding.y.field = yFieldName;
|
|
87
92
|
}
|
|
93
|
+
this.baseChartSpec.encoding.y.axis = Object.assign(Object.assign({}, this.baseChartSpec.encoding.y.axis), { grid: this.xGridVisible });
|
|
88
94
|
if (yAxisTitle) {
|
|
89
95
|
this.baseChartSpec.encoding.y.title = yAxisTitle;
|
|
90
96
|
}
|
|
@@ -104,15 +110,17 @@ const GuxLineChart = class {
|
|
|
104
110
|
if (includeDataPointMarkers) {
|
|
105
111
|
this.baseChartSpec.mark.point = includeDataPointMarkers;
|
|
106
112
|
}
|
|
107
|
-
|
|
108
|
-
|
|
113
|
+
if (this.chartData) {
|
|
114
|
+
this.baseChartSpec.data = this.chartData;
|
|
115
|
+
}
|
|
116
|
+
this.visualizationSpec = JSON.parse(JSON.stringify(this.baseChartSpec));
|
|
109
117
|
}
|
|
110
118
|
componentWillLoad() {
|
|
111
119
|
trackComponent(this.root);
|
|
112
120
|
this.parseData();
|
|
113
121
|
}
|
|
114
122
|
render() {
|
|
115
|
-
return (h("gux-visualization-beta", { key: '
|
|
123
|
+
return (h("gux-visualization-beta", { key: 'f0d52101782cd4c59f787b6d26ef2b627b637f90', visualizationSpec: this.visualizationSpec }));
|
|
116
124
|
}
|
|
117
125
|
get root() { return getElement(this); }
|
|
118
126
|
static get watchers() { return {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement } from './index-B1rXZ1zs.js';
|
|
2
|
-
import { V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-
|
|
2
|
+
import { V as VISUALIZATION_COLORS, t as trackComponent } from './color-palette-C1fbSF56.js';
|
|
3
3
|
import { l as logError } from './log-error-nsqlWzyl.js';
|
|
4
4
|
|
|
5
5
|
const guxChartPieCss = () => `gux-visualization-beta{height:fit-content;color:#2e394c}`;
|