@carbon/charts-vue 0.54.7 → 0.54.11

package/CHANGELOG.md

@@ -3,6 +3,38 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.54.11](https://github.com/carbon-design-system/carbon-charts/compare/v0.54.10...v0.54.11) (2022-02-02)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
+## [0.54.10](https://github.com/carbon-design-system/carbon-charts/compare/v0.54.9...v0.54.10) (2022-01-27)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
+## [0.54.9](https://github.com/carbon-design-system/carbon-charts/compare/v0.54.8...v0.54.9) (2022-01-27)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
+## [0.54.8](https://github.com/carbon-design-system/carbon-charts/compare/v0.54.7...v0.54.8) (2022-01-25)
+
+**Note:** Version bump only for package @carbon/charts-vue
+
+
+
+
+
 ## [0.54.7](https://github.com/carbon-design-system/carbon-charts/compare/v0.54.6...v0.54.7) (2022-01-13)
 
 **Note:** Version bump only for package @carbon/charts-vue

package/charts-vue.common.js

@@ -8535,6 +8535,7 @@ var axisChart = tools_Tools.merge({}, chart, {
 var baseBarChart = tools_Tools.merge({}, axisChart, {
     bars: {
         maxWidth: 16,
+        spacingFactor: 0.25
     },
     timeScale: tools_Tools.merge(timeScale, {
         addSpaceOnEdges: 1,
@@ -8758,6 +8759,7 @@ var meterChart = tools_Tools.merge({}, chart, {
         clickable: false,
     },
     meter: {
+        showLabels: true,
         proportional: null,
         statusBar: {
             percentageIndicator: {
@@ -16160,10 +16162,11 @@ var scales_cartesian_CartesianScales = /** @class */ (function (_super) {
     };
     CartesianScales.prototype.getBoundedScaledValues = function (datum, index) {
         var bounds = this.model.getOptions().bounds;
-        var scale = this.scales[this.rangeAxisPosition];
+        var axisPosition = this.getRangeAxisPosition({ datum: datum });
+        var scale = this.scales[axisPosition];
         var options = this.model.getOptions();
         var axesOptions = tools_Tools.getProperty(options, 'axes');
-        var axisOptions = axesOptions[this.rangeAxisPosition];
+        var axisOptions = axesOptions[axisPosition];
         var mapsTo = axisOptions.mapsTo;
         var value = datum[mapsTo] !== undefined ? datum[mapsTo] : datum;
         var boundedValues = [
@@ -25436,6 +25439,7 @@ var bar_extends = (undefined && undefined.__extends) || (function () {
 // Internal Imports
 
 
+
 var bar_Bar = /** @class */ (function (_super) {
     bar_extends(Bar, _super);
     function Bar() {
@@ -25453,7 +25457,8 @@ var bar_Bar = /** @class */ (function (_super) {
             useAttrs: true,
         }).width;
         if (!mainXScale.step) {
-            return Math.min(options.bars.maxWidth, (chartWidth * 0.25) / numberOfDatapoints);
+            var spacingFactor = tools_Tools.getProperty(options, 'bars', 'spacingFactor');
+            return Math.min(options.bars.maxWidth, (chartWidth * spacingFactor) / numberOfDatapoints);
         }
         return Math.min(options.bars.maxWidth, mainXScale.step() / 2);
     };
@@ -26248,8 +26253,9 @@ var bar_stacked_StackedBar = /** @class */ (function (_super) {
             useAttrs: true,
         }).width;
         var numberOfDomainValues = this.model.getStackKeys().length;
+        var spacingFactor = tools_Tools.getProperty(options, 'bars', 'spacingFactor');
         if (!mainXScale.step) {
-            return Math.min(options.bars.maxWidth, (chartWidth * 0.25) / numberOfDomainValues);
+            return Math.min(options.bars.maxWidth, (chartWidth * spacingFactor) / numberOfDomainValues);
         }
         return Math.min(options.bars.maxWidth, mainXScale.step() / 2);
     };
@@ -32876,18 +32882,19 @@ var radar_Radar = /** @class */ (function (_super) {
             });
             var axisLine = self.parent.select(".x-axes .x-axis-" + tools_Tools.kebabCase(datum));
             var dots = self.parent.selectAll(".dots circle." + tools_Tools.kebabCase(datum));
+            var activeDataGroupNames = self.model.getActiveDataGroupNames();
+            var options = self.getOptions();
+            var groupMapsTo = options.data.groupMapsTo;
+            var valueMapsTo = tools_Tools.getProperty(options, 'radar', 'axes', 'value');
             // Change style
             axisLine
                 .classed('hovered', true)
                 .attr('stroke-dasharray', '4 4');
             dots.classed('hovered', true)
-                .attr('opacity', 1)
+                .attr('opacity', function (d) { return activeDataGroupNames.indexOf(d[groupMapsTo]) !== -1 ? 1 : 0; })
                 .attr('r', radar.dotsRadius);
             // get the items that should be highlighted
-            var itemsToHighlight = self.fullDataNormalized.filter(function (d) { return d[angle] === datum; });
-            var options = self.getOptions();
-            var groupMapsTo = options.data.groupMapsTo;
-            var valueMapsTo = tools_Tools.getProperty(options, 'radar', 'axes', 'value');
+            var itemsToHighlight = self.fullDataNormalized.filter(function (d) { return d[angle] === datum && activeDataGroupNames.indexOf(d[groupMapsTo]) !== -1; });
             // Show tooltip
             self.services.events.dispatchEvent(Events.Tooltip.SHOW, {
                 event: event,
@@ -42986,6 +42993,13 @@ var charts_meter_extends = (undefined && undefined.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var charts_meter_spreadArrays = (undefined && undefined.__spreadArrays) || function () {
+    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+    for (var r = Array(s), k = 0, i = 0; i < il; i++)
+        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+            r[k] = a[j];
+    return r;
+};
 // Internal Imports
 
 
@@ -43012,29 +43026,41 @@ var meter_MeterChart = /** @class */ (function (_super) {
         return _this;
     }
     MeterChart.prototype.getComponents = function () {
-        // Specify what to render inside the graph only
-        var graph = {
-            id: 'meter-graph',
-            components: [new meter_Meter(this.model, this.services)],
-            growth: LayoutGrowth.STRETCH,
-            renderType: RenderTypes.SVG,
-        };
-        // Meter has an unique dataset title within the graph
-        var titleComponent = {
-            id: 'meter-title',
-            components: [new title_meter_MeterTitle(this.model, this.services)],
-            growth: LayoutGrowth.STRETCH,
-            renderType: RenderTypes.SVG,
-        };
-        // create the title spacer
-        var titleSpacerComponent = {
-            id: 'spacer',
-            components: [new spacer_Spacer(this.model, this.services, { size: 8 })],
-            growth: LayoutGrowth.STRETCH,
-        };
+        var showLabels = tools_Tools.getProperty(this.model.getOptions(), 'meter', 'showLabels');
+        var meterComponents = charts_meter_spreadArrays((showLabels
+            ? [
+                // Meter has a unique dataset title within the graph
+                {
+                    id: 'meter-title',
+                    components: [
+                        new title_meter_MeterTitle(this.model, this.services),
+                    ],
+                    growth: LayoutGrowth.STRETCH,
+                    renderType: RenderTypes.SVG,
+                },
+                // Create the title spacer
+                {
+                    id: 'spacer',
+                    components: [
+                        new spacer_Spacer(this.model, this.services, {
+                            size: 8,
+                        }),
+                    ],
+                    growth: LayoutGrowth.STRETCH,
+                },
+            ]
+            : []), [
+            // Specify what to render inside the graph only
+            {
+                id: 'meter-graph',
+                components: [new meter_Meter(this.model, this.services)],
+                growth: LayoutGrowth.STRETCH,
+                renderType: RenderTypes.SVG,
+            },
+        ]);
         // the graph frame for meter includes the custom title (and spacer)
         var graphFrame = [
-            new layout_LayoutComponent(this.model, this.services, [titleComponent, titleSpacerComponent, graph], {
+            new layout_LayoutComponent(this.model, this.services, meterComponents, {
                 direction: LayoutDirection.COLUMN,
             }),
         ];