axidio-styleguide-library1-v2 0.0.945 → 0.0.946

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.
Files changed (5) hide show
  1. package/esm2022/lib/group-chart/group-chart.component.mjs +43 -50
  2. package/esm2022/lib/horizontal-grouped-bar-with-scroll-zoom/horizontal-grouped-bar-with-scroll-zoom.component.mjs +57 -55
  3. package/fesm2022/axidio-styleguide-library1-v2.mjs +98 -103
  4. package/fesm2022/axidio-styleguide-library1-v2.mjs.map +1 -1
  5. package/package.json +1 -1
package/fesm2022/axidio-styleguide-library1-v2.mjs CHANGED
@@ -4572,55 +4572,48 @@ class GroupChartComponent extends ComponentUniqueId {
4572
4572
  * display data values on mouse over
4573
4573
  * used by dashboard charts
4574
4574
  */
4575
- // if (
4576
- // this.chartConfiguration.textsOnBar == undefined &&
4577
- // this.chartConfiguration.displayTitleOnTop == undefined
4578
- // ) {
4579
- // state
4580
- // .selectAll('rect')
4581
- // .on('mouseout', function (d) {
4582
- // state.selectAll('.barstext').remove();
4583
- // })
4584
- // .on('mouseover', function (d1) {
4585
- // state
4586
- // .selectAll('text')
4587
- // .data(function (d) {
4588
- // let newList: any = [];
4589
- // subgroups.map(function (key) {
4590
- // if (
4591
- // key !== 'name' &&
4592
- // d1.key == key &&
4593
- // d1.value == d[key] &&
4594
- // d1.name == d.name
4595
- // ) {
4596
- // let obj: any = { key: key, value: d[key], name: d.name };
4597
- // newList.push(obj);
4598
- // }
4599
- // });
4600
- // return newList;
4601
- // })
4602
- // .enter()
4603
- // .append('text')
4604
- // .attr('class', 'barstext')
4605
- // .attr('x', function (d) {
4606
- // return xSubgroup(d.key);
4607
- // })
4608
- // .attr('y', function (d) {
4609
- // return y(d.value);
4610
- // })
4611
- // .attr(
4612
- // 'style',
4613
- // 'font-size: ' + '.85em' + ';' + ' font-weight:' + 'bold' + ';'
4614
- // )
4615
- // .style('fill', function (d) {
4616
- // return metaData.colors[d.key];
4617
- // })
4618
- // .attr('width', xSubgroup.bandwidth())
4619
- // .text(function (d) {
4620
- // return d.value;
4621
- // });
4622
- // });
4623
- // }
4575
+ if (this.chartConfiguration.textsOnBar == undefined &&
4576
+ this.chartConfiguration.displayTitleOnTop == undefined) {
4577
+ state
4578
+ .selectAll('rect')
4579
+ .on('mouseout', function (d) {
4580
+ state.selectAll('.barstext').remove();
4581
+ })
4582
+ .on('mouseover', function (d1) {
4583
+ state
4584
+ .selectAll('text')
4585
+ .data(function (d) {
4586
+ let newList = [];
4587
+ subgroups.map(function (key) {
4588
+ if (key !== 'name' &&
4589
+ d1.key == key &&
4590
+ d1.value == d[key] &&
4591
+ d1.name == d.name) {
4592
+ let obj = { key: key, value: d[key], name: d.name };
4593
+ newList.push(obj);
4594
+ }
4595
+ });
4596
+ return newList;
4597
+ })
4598
+ .enter()
4599
+ .append('text')
4600
+ .attr('class', 'barstext')
4601
+ .attr('x', function (d) {
4602
+ return xSubgroup(d.key);
4603
+ })
4604
+ .attr('y', function (d) {
4605
+ return y(d.value);
4606
+ })
4607
+ .attr('style', 'font-size: ' + '.85em' + ';' + ' font-weight:' + 'bold' + ';')
4608
+ .style('fill', function (d) {
4609
+ return metaData.colors[d.key];
4610
+ })
4611
+ .attr('width', xSubgroup.bandwidth())
4612
+ .text(function (d) {
4613
+ return d.value;
4614
+ });
4615
+ });
4616
+ }
4624
4617
  svg
4625
4618
  .append('g')
4626
4619
  .attr('class', 'x2 axis2')
@@ -8816,11 +8809,19 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
8816
8809
  .attr('y', function (d) {
8817
8810
  // For grouped bar charts with many bars and xLabel present, do NOT add extra space (avoid overlap)
8818
8811
  if (subgroups.length > 1 && data.length > 8 && metaData.xLabel) {
8812
+ // In maximized (fullscreen) view, keep the gap minimal
8813
+ if (self.chartConfiguration.isFullScreen) {
8814
+ return short_tick_length_bg;
8815
+ }
8819
8816
  return short_tick_length_bg;
8820
8817
  }
8821
- // For grouped bar charts with many bars and NO xLabel, add space as before
8818
+ // For grouped bar charts with many bars and NO xLabel, add space as before, but reduce in fullscreen
8822
8819
  if (subgroups.length > 1 && data.length > 8 && !metaData.xLabel) {
8823
8820
  const chartHasExtraBottom = (self.chartConfiguration.margin && self.chartConfiguration.margin.bottom >= 40);
8821
+ if (self.chartConfiguration.isFullScreen) {
8822
+ // Reduce extra gap in maximized view
8823
+ return short_tick_length_bg + 2;
8824
+ }
8824
8825
  return chartHasExtraBottom ? short_tick_length_bg : short_tick_length_bg + 10;
8825
8826
  }
8826
8827
  // Default/fallback logic for other cases
@@ -8833,6 +8834,10 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
8833
8834
  if (/\d{2,4}[-\/]\d{2,4}/.test(d) && d.indexOf(' ') > -1) {
8834
8835
  baseY += 4;
8835
8836
  }
8837
+ // In maximized view, reduce baseY slightly for grouped bars
8838
+ if (self.chartConfiguration.isFullScreen && subgroups.length > 1) {
8839
+ baseY = Math.max(short_tick_length_bg, baseY - 10);
8840
+ }
8836
8841
  return baseY;
8837
8842
  })
8838
8843
  .attr('x', function (d) {
@@ -9426,59 +9431,49 @@ class HorizontalGroupedBarWithScrollZoomComponent extends ComponentUniqueId {
9426
9431
  * display data values on mouse over
9427
9432
  * used by dashboard charts
9428
9433
  */
9429
- // if (
9430
- // this.chartConfiguration.textsOnBar == undefined &&
9431
- // this.chartConfiguration.displayTitleOnTop == undefined
9432
- // ) {
9433
- // state
9434
- // .selectAll('rect')
9435
- // .on('mouseout', function (d) {
9436
- // state.selectAll('.barstext').remove();
9437
- // })
9438
- // .on('mouseover', function (d1) {
9439
- // state
9440
- // .selectAll('text')
9441
- // .data(function (d) {
9442
- // let newList: any = [];
9443
- // subgroups.map(function (key) {
9444
- // if (
9445
- // key !== 'name' &&
9446
- // d1.key == key &&
9447
- // d1.value == d[key] &&
9448
- // d1.name == d.name
9449
- // ) {
9450
- // let obj: any = { key: key, value: d[key], name: d.name };
9451
- // newList.push(obj);
9452
- // }
9453
- // });
9454
- // return newList;
9455
- // })
9456
- // .enter()
9457
- // .append('text')
9458
- // .attr('fill', 'var(--chart-text-color)')
9459
- // .attr('class', 'barstext')
9460
- // .attr('x', function (d) {
9461
- // return xSubgroup(d.key);
9462
- // })
9463
- // .attr('y', function (d) {
9464
- // return y(d.value);
9465
- // })
9466
- // .attr(
9467
- // 'style',
9468
- // 'font-size: ' + '.85em' + ';' + ' font-weight:' + 'bold' + ';'
9469
- // )
9470
- // .style('fill', function (d) {
9471
- // return metaData.colors[d.key];
9472
- // })
9473
- // .attr(
9474
- // 'width',
9475
- // self.isZoomedOut ? xSubgroup.bandwidth() : xSubgroup.bandwidth()
9476
- // )
9477
- // .text(function (d) {
9478
- // return d.value;
9479
- // });
9480
- // });
9481
- // }
9434
+ if (this.chartConfiguration.textsOnBar == undefined &&
9435
+ this.chartConfiguration.displayTitleOnTop == undefined) {
9436
+ state
9437
+ .selectAll('rect')
9438
+ .on('mouseout', function (d) {
9439
+ state.selectAll('.barstext').remove();
9440
+ })
9441
+ .on('mouseover', function (d1) {
9442
+ state
9443
+ .selectAll('text')
9444
+ .data(function (d) {
9445
+ let newList = [];
9446
+ subgroups.map(function (key) {
9447
+ if (key !== 'name' &&
9448
+ d1.key == key &&
9449
+ d1.value == d[key] &&
9450
+ d1.name == d.name) {
9451
+ let obj = { key: key, value: d[key], name: d.name };
9452
+ newList.push(obj);
9453
+ }
9454
+ });
9455
+ return newList;
9456
+ })
9457
+ .enter()
9458
+ .append('text')
9459
+ .attr('fill', 'var(--chart-text-color)')
9460
+ .attr('class', 'barstext')
9461
+ .attr('x', function (d) {
9462
+ return xSubgroup(d.key);
9463
+ })
9464
+ .attr('y', function (d) {
9465
+ return y(d.value);
9466
+ })
9467
+ .attr('style', 'font-size: ' + '.85em' + ';' + ' font-weight:' + 'bold' + ';')
9468
+ .style('fill', function (d) {
9469
+ return metaData.colors[d.key];
9470
+ })
9471
+ .attr('width', self.isZoomedOut ? xSubgroup.bandwidth() : xSubgroup.bandwidth())
9472
+ .text(function (d) {
9473
+ return d.value;
9474
+ });
9475
+ });
9476
+ }
9482
9477
  svg
9483
9478
  .append('g')
9484
9479
  .attr('class', 'x2 axis2')