@provoly/dashboard 1.3.7 → 1.3.9

package/fesm2022/provoly-dashboard-tooltips-attribute.mjs

@@ -6,8 +6,11 @@ import { Component, NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import * as i1 from '@provoly/dashboard';
 import { BaseTooltipComponent, ClassSelectors, BaseTooltipModule, PryCoreModule } from '@provoly/dashboard';
-import { map, switchMap, of } from 'rxjs';
+import { map, of } from 'rxjs';
+import { withLatestFrom } from 'rxjs/operators';
 import * as i2 from '@ngrx/store';
+import * as i4 from '@provoly/dashboard/components/data-format';
+import { PryDataFormatModule } from '@provoly/dashboard/components/data-format';
 
 class AttributeTooltipComponent extends BaseTooltipComponent {
     constructor(translateIdPipe, store) {
@@ -15,27 +18,22 @@ class AttributeTooltipComponent extends BaseTooltipComponent {
         this.translateIdPipe = translateIdPipe;
         this.store = store;
         this.context = this.context ?? { attributes: [] };
-        this.classes$ = this.store.select(ClassSelectors.classes);
     }
-    getAttributeName(attribute) {
-        return this.classes$.pipe(map((classes) => classes
-            .map((clazz) => clazz.attributes)
-            .flat()
-            .find((attr) => attr.id === attribute)?.name ?? attribute));
-    }
-    getAttributeTechnicalName(attribute) {
-        return this.classes$.pipe(map((classes) => classes
-            .map((clazz) => clazz.attributes)
-            .flat()
-            .find((attr) => attr.id === attribute)?.technicalName ?? attribute));
+    ngOnInit() {
+        this.attributes$ = this.store.select(ClassSelectors.classes).pipe(map((classes) => {
+            return classes
+                .map((c) => c.attributes)
+                .flat()
+                .filter((attr) => this.context.attributes.includes(attr.id));
+        }));
     }
-    getValue(attribute, limit = 9999) {
-        return this.getAttributeTechnicalName(attribute).pipe(switchMap((attribute) => this._getValue(attribute)), map((value) => {
+    getValue(attrTechnicalName, limit = 9999) {
+        return this._getValue(attrTechnicalName).pipe(withLatestFrom(this.attributes$), map(([value, attributes]) => {
+            const field = attributes.find((attr) => attr.technicalName === attrTechnicalName)?.field;
             switch (typeof value) {
                 case 'undefined':
                     return '';
                 case 'number':
-                    return value.toString();
                 case 'string':
                     return value;
                 default:
@@ -44,6 +42,7 @@ class AttributeTooltipComponent extends BaseTooltipComponent {
             }
         }));
     }
+    // attribute: 'id' | 'oClass' | attributeTechnicalName
     _getValue(attribute) {
         if (!this.data.item.properties) {
             // This is for Provoly-like items
@@ -65,11 +64,11 @@ class AttributeTooltipComponent extends BaseTooltipComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: AttributeTooltipComponent, deps: [{ token: i1.TranslateIdPipe }, { token: i2.Store }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: AttributeTooltipComponent, selector: "pry-attribute-tooltip", usesInheritance: true, ngImport: i0, template: "<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId : { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of context.attributes\">\n    <p [title]=\"getValue(attribute) | async\">\n      <span>{{ getAttributeName(attribute) | async }}:</span> {{ getValue(attribute, 40) | async }}\n    </p>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i1.TranslateItemToSymbolPipe, name: "translateItemToSymbol" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: AttributeTooltipComponent, selector: "pry-attribute-tooltip", usesInheritance: true, ngImport: i0, template: "<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId: { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of attributes$ | async\">\n    <p [title]=\"getValue(attribute.technicalName) | async | dataFormat: attribute.field\">\n      <span>{{ attribute.name }}:</span>\n      {{ getValue(attribute.technicalName, 40) | async | dataFormat: attribute.field }}\n    </p>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslateIdPipe, name: "translateId" }, { kind: "pipe", type: i1.TranslateItemToSymbolPipe, name: "translateItemToSymbol" }, { kind: "pipe", type: i4.DataFormatPipe, name: "dataFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: AttributeTooltipComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pry-attribute-tooltip', template: "<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId : { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of context.attributes\">\n    <p [title]=\"getValue(attribute) | async\">\n      <span>{{ getAttributeName(attribute) | async }}:</span> {{ getValue(attribute, 40) | async }}\n    </p>\n  </ng-container>\n</div>\n" }]
+            args: [{ selector: 'pry-attribute-tooltip', template: "<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId: { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of attributes$ | async\">\n    <p [title]=\"getValue(attribute.technicalName) | async | dataFormat: attribute.field\">\n      <span>{{ attribute.name }}:</span>\n      {{ getValue(attribute.technicalName, 40) | async | dataFormat: attribute.field }}\n    </p>\n  </ng-container>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1.TranslateIdPipe }, { type: i2.Store }] });
 
 class PryAttributeTooltipModule extends BaseTooltipModule {
@@ -77,14 +76,14 @@ class PryAttributeTooltipModule extends BaseTooltipModule {
         return AttributeTooltipComponent;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, deps: null, target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, declarations: [AttributeTooltipComponent], imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule], exports: [AttributeTooltipComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, declarations: [AttributeTooltipComponent], imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule, PryDataFormatModule], exports: [AttributeTooltipComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule, PryDataFormatModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: PryAttributeTooltipModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AttributeTooltipComponent],
-                    imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule],
+                    imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule, PryDataFormatModule],
                     exports: [AttributeTooltipComponent]
                 }]
         }] });

package/fesm2022/provoly-dashboard-tooltips-attribute.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"provoly-dashboard-tooltips-attribute.mjs","sources":["../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.component.ts","../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.component.html","../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.module.ts","../../../../projects/provoly/dashboard/tooltips/attribute/provoly-dashboard-tooltips-attribute.ts"],"sourcesContent":["import { Component } from '@angular/core';\nimport { BaseTooltipComponent, Class, ClassSelectors, TranslateIdPipe } from '@provoly/dashboard';\nimport { map, Observable, of, switchMap } from 'rxjs';\nimport { Store } from '@ngrx/store';\n\n@Component({\n  selector: 'pry-attribute-tooltip',\n  templateUrl: './attribute-tooltip.component.html'\n})\nexport class AttributeTooltipComponent extends BaseTooltipComponent {\n  private classes$: Observable<Class[]>;\n\n  constructor(private translateIdPipe: TranslateIdPipe, private store: Store<any>) {\n    super();\n    this.context = this.context ?? { attributes: [] };\n    this.classes$ = this.store.select(ClassSelectors.classes);\n  }\n\n  getAttributeName(attribute: string): Observable<string> {\n    return this.classes$.pipe(\n      map(\n        (classes) =>\n          classes\n            .map((clazz) => clazz.attributes)\n            .flat()\n            .find((attr) => attr.id === attribute)?.name ?? attribute\n      )\n    );\n  }\n\n  getAttributeTechnicalName(attribute: string): Observable<string> {\n    return this.classes$.pipe(\n      map(\n        (classes) =>\n          classes\n            .map((clazz) => clazz.attributes)\n            .flat()\n            .find((attr) => attr.id === attribute)?.technicalName ?? attribute\n      )\n    );\n  }\n\n  getValue(attribute: string, limit = 9999): Observable<string> {\n    return this.getAttributeTechnicalName(attribute).pipe(\n      switchMap((attribute: string) => this._getValue(attribute)),\n      map((value) => {\n        switch (typeof value) {\n          case 'undefined':\n            return '';\n          case 'number':\n            return value.toString();\n          case 'string':\n            return value;\n          default:\n            const result = JSON.stringify(value);\n            return result.length > limit ? `${result.substring(0, limit)}...` : result;\n        }\n      })\n    );\n  }\n\n  _getValue(attribute: string): Observable<string | undefined | number> {\n    if (!this.data.item.properties) {\n      // This is for Provoly-like items\n      switch (attribute) {\n        case 'id':\n          return of(this.data.item[attribute]);\n        case 'oClass':\n          return this.translateIdPipe.transform(this.data.item[attribute], {\n            type: 'class',\n            output: 'name'\n          }) as Observable<string>;\n        default:\n          return of(this.data.item.attributes[attribute]?.value);\n      }\n    } else {\n      // This is for other items, like WMSFeatures\n      return of(\n        this.data.item.properties.find((prop: { key: string; value: string }) => prop.key === attribute)?.value\n      );\n    }\n  }\n}\n","<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId : { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId : { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of context.attributes\">\n    <p [title]=\"getValue(attribute) | async\">\n      <span>{{ getAttributeName(attribute) | async }}:</span> {{ getValue(attribute, 40) | async }}\n    </p>\n  </ng-container>\n</div>\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule, Type } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { BaseTooltipComponent, BaseTooltipModule, PryCoreModule } from '@provoly/dashboard';\nimport { AttributeTooltipComponent } from './attribute-tooltip.component';\n\n@NgModule({\n  declarations: [AttributeTooltipComponent],\n  imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule],\n  exports: [AttributeTooltipComponent]\n})\nexport class PryAttributeTooltipModule extends BaseTooltipModule {\n  override getComponent() {\n    return AttributeTooltipComponent as Type<BaseTooltipComponent>;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"provoly-dashboard-tooltips-attribute.mjs","sources":["../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.component.ts","../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.component.html","../../../../projects/provoly/dashboard/tooltips/attribute/attribute-tooltip.module.ts","../../../../projects/provoly/dashboard/tooltips/attribute/provoly-dashboard-tooltips-attribute.ts"],"sourcesContent":["import { Component, OnInit } from '@angular/core';\nimport { Attribute, BaseTooltipComponent, ClassSelectors, Field, TranslateIdPipe } from '@provoly/dashboard';\nimport { map, Observable, of } from 'rxjs';\nimport { Store } from '@ngrx/store';\nimport { withLatestFrom } from 'rxjs/operators';\n\n@Component({\n  selector: 'pry-attribute-tooltip',\n  templateUrl: './attribute-tooltip.component.html'\n})\nexport class AttributeTooltipComponent extends BaseTooltipComponent implements OnInit {\n  protected attributes$!: Observable<Attribute[]>;\n\n  constructor(\n    private translateIdPipe: TranslateIdPipe,\n    private store: Store<any>\n  ) {\n    super();\n    this.context = this.context ?? { attributes: [] };\n  }\n\n  ngOnInit() {\n    this.attributes$ = this.store.select(ClassSelectors.classes).pipe(\n      map((classes) => {\n        return classes\n          .map((c) => c.attributes)\n          .flat()\n          .filter((attr) => this.context.attributes.includes(attr.id));\n      })\n    );\n  }\n\n  getValue(attrTechnicalName: string, limit = 9999): Observable<string | number> {\n    return this._getValue(attrTechnicalName).pipe(\n      withLatestFrom(this.attributes$),\n      map(([value, attributes]) => {\n        const field = attributes.find((attr) => attr.technicalName === attrTechnicalName)?.field;\n        switch (typeof value) {\n          case 'undefined':\n            return '';\n          case 'number':\n          case 'string':\n            return value;\n          default:\n            const result = JSON.stringify(value);\n            return result.length > limit ? `${result.substring(0, limit)}...` : result;\n        }\n      })\n    );\n  }\n\n  // attribute: 'id' | 'oClass' | attributeTechnicalName\n  _getValue(attribute: string): Observable<string | undefined | number> {\n    if (!this.data.item.properties) {\n      // This is for Provoly-like items\n      switch (attribute) {\n        case 'id':\n          return of(this.data.item[attribute]);\n        case 'oClass':\n          return this.translateIdPipe.transform(this.data.item[attribute], {\n            type: 'class',\n            output: 'name'\n          }) as Observable<string>;\n        default:\n          return of(this.data.item.attributes[attribute]?.value);\n      }\n    } else {\n      // This is for other items, like WMSFeatures\n      return of(\n        this.data.item.properties.find((prop: { key: string; value: string }) => prop.key === attribute)?.value\n      );\n    }\n  }\n}\n","<div class=\"m-tooltip__item__content\">\n  <h3 class=\"a-h3 -attribute\">\n    <img\n      [src]=\"data.item | translateItemToSymbol | async\"\n      [alt]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\"\n      width=\"32\"\n      aria-hidden=\"true\"\n    />\n    <span [title]=\"data.item.oClass | translateId: { type: 'class', output: 'name' } | async\">{{\n      data.item.oClass | translateId: { type: 'class', output: 'name' } | async\n    }}</span>\n  </h3>\n  <ng-container *ngFor=\"let attribute of attributes$ | async\">\n    <p [title]=\"getValue(attribute.technicalName) | async | dataFormat: attribute.field\">\n      <span>{{ attribute.name }}:</span>\n      {{ getValue(attribute.technicalName, 40) | async | dataFormat: attribute.field }}\n    </p>\n  </ng-container>\n</div>\n","import { OverlayModule } from '@angular/cdk/overlay';\nimport { CommonModule } from '@angular/common';\nimport { NgModule, Type } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { BaseTooltipComponent, BaseTooltipModule, PryCoreModule } from '@provoly/dashboard';\nimport { AttributeTooltipComponent } from './attribute-tooltip.component';\nimport { PryDataFormatModule } from '@provoly/dashboard/components/data-format';\n\n@NgModule({\n  declarations: [AttributeTooltipComponent],\n  imports: [CommonModule, FormsModule, OverlayModule, PryCoreModule, PryDataFormatModule],\n  exports: [AttributeTooltipComponent]\n})\nexport class PryAttributeTooltipModule extends BaseTooltipModule {\n  override getComponent() {\n    return AttributeTooltipComponent as Type<BaseTooltipComponent>;\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/provoly-dashboard-widgets-widget-aggregated-chart.mjs

@@ -13,6 +13,7 @@ import { BehaviorSubject, Subject, map, filter, combineLatest, fromEvent, startW
 import embed, { vega } from 'vega-embed';
 import { mergeDeep } from 'vega-lite';
 import { initConfig } from 'vega-lite/build/src/config';
+import { toD3Format } from '@provoly/dashboard/components/data-format';
 import * as i1 from '@ngrx/store';
 import * as i3 from '@provoly/dashboard/components/scheme-picker';
 import { PrySchemePickerModule } from '@provoly/dashboard/components/scheme-picker';
@@ -68,15 +69,17 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
         });
         this.fields$ = this.store.select(FieldSelectors.fields);
         this.classes$ = this.store.select(ClassSelectors.classes);
+        const usedAttributes$ = combineLatest([this.usedDatasources$, this.classes$]).pipe(map(([datasources, classes]) => {
+            const usedClasses = datasources
+                .filter((ds) => ds.sourceType === 'dataset')
+                // @ts-ignore
+                .map((ds) => ds.oClass);
+            return this.classes.filter((c) => usedClasses.includes(c.id));
+        }));
         this.operations$ = combineLatest([this.usedDatasources$, this.classes$, this.fields$]).pipe(map(([datasources, classes, fields]) => classes
             .filter((clazz) => datasources.map((ds) => ('oClass' in ds ? ds.oClass : undefined)).includes(clazz.id))
             .map((clazz) => clazz.attributes)
-            .map((attrs) => attrs.filter((attr) => {
-            const field = fields.find((field) => {
-                return field.id === attr.field;
-            });
-            return !!field && [FieldType.INTEGER, FieldType.DECIMAL, FieldType.LONG].includes(field.type);
-        }))
+            .map((attrs) => attrs.filter((attr) => [FieldType.INTEGER, FieldType.DECIMAL, FieldType.LONG].includes(attr.field.type)))
             .reduce((a, b) => [...a, ...b], [])
             .filter((attr) => !!attr)), map((attributes) => (attributes.length > 0
             ? Object.values(Operation).filter((operation) => operation !== Operation.EXTENT)
@@ -108,7 +111,7 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
             .map((clazz) => clazz.attributes)
             .map((attrs) => attrs.filter((attr) => {
             const field = fields.find((field) => {
-                return field.id === attr.field;
+                return field.id === attr.field.id;
             });
             return (!!field &&
                 field.type !== FieldType.RAW &&
@@ -124,7 +127,7 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
             .map((clazz) => clazz.attributes)
             .map((attrs) => attrs.filter((attr) => {
             const field = fields.find((field) => {
-                return field.id === attr.field;
+                return field.id === attr.field.id;
             });
             if (this.optionsCopy$.value &&
                 [
@@ -160,25 +163,22 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
             const groupBy = classes
                 .map((clazz) => clazz.attributes.find((attr) => attr.id === options?.groupBy?.attribute))
                 .find((attr) => !!attr);
-            const abscissaFieldType = fields.find((field) => field.id === abscissa?.field)?.type ?? FieldType.STRING;
-            const ordinateFieldType = fields.find((field) => field.id === ordinate?.field)?.type ?? FieldType.STRING;
-            const groupByFieldType = fields.find((field) => field.id === groupBy?.field)?.type ?? FieldType.STRING;
             return {
                 abscissa: {
-                    fieldType: abscissaFieldType,
-                    vegaType: this.translateToVegaType(abscissaFieldType, abscissa?.name ?? ''),
+                    field: abscissa?.field,
+                    vegaType: this.translateToVegaType(abscissa?.field.type, abscissa?.name ?? ''),
                     name: abscissa?.name ?? ''
                 },
                 ordinate: {
-                    fieldType: ordinateFieldType,
+                    fieldType: ordinate?.field,
                     vegaType: options.ordinate.operation === Operation.COUNT || options.ordinate.operation === Operation.DISTINCT
                         ? VegaType.QUANTITATIVE
-                        : this.translateToVegaType(ordinateFieldType, ordinate?.name ?? ''),
+                        : this.translateToVegaType(abscissa?.field.type, ordinate?.name ?? ''),
                     name: ordinate?.name ?? ''
                 },
                 groupBy: {
-                    fieldType: groupByFieldType,
-                    vegaType: this.translateToVegaType(groupByFieldType, groupBy?.name),
+                    field: groupBy?.field,
+                    vegaType: this.translateToVegaType(groupBy?.field.type, groupBy?.name),
                     name: groupBy?.name ?? ''
                 }
             };
@@ -247,14 +247,9 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                                     bin: options.graph.type.indexOf('histogram') >= 0,
                                     ...this.getTimeUnit(options, types.abscissa.vegaType),
                                     axis: {
-                                        //format: types.abscissa.vegaType === VegaType.TEMPORAL ? '%Y-%B-%dT%H:%M:%S' : undefined,
                                         grid: false,
-                                        ...WidgetAggregatedChartComponent.minTick(types.abscissa.fieldType),
-                                        labelExpr: `height < 300 ? ${types.abscissa.vegaType === VegaType.TEMPORAL
-                                            ? "timeFormat(datum.value, '%Y-%B-%dT%H:%M:%S')"
-                                            : 'truncate(datum.value, 10)'} : ${types.abscissa.vegaType === VegaType.TEMPORAL
-                                            ? "timeFormat(datum.value, '%Y-%B-%dT%H:%M:%S')"
-                                            : 'datum.value'}`,
+                                        ...WidgetAggregatedChartComponent.minTick(types.abscissa.field?.type ?? FieldType.STRING),
+                                        labelExpr: this.getAxisFormat(types.abscissa.vegaType, types.abscissa.field),
                                         ...this.getLabelAngle(types.abscissa.vegaType, values.data)
                                     },
                                     scale: {
@@ -271,7 +266,7 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                                     title: options.ordinate.label,
                                     type: types.ordinate.vegaType,
                                     axis: {
-                                        ...WidgetAggregatedChartComponent.minTick(types.ordinate.fieldType),
+                                        ...WidgetAggregatedChartComponent.minTick(types.ordinate.field?.type ?? FieldType.STRING),
                                         ...this.setTickCount(values.data)
                                     },
                                     scale: {
@@ -306,11 +301,14 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                                             field: 'key',
                                             type: types.abscissa.vegaType,
                                             title: options.abscissa.label,
-                                            ...(types.abscissa.vegaType === 'temporal'
-                                                ? { format: '%Y-%B-%dT%H:%M:%S', scale: { type: 'utc' } }
-                                                : {})
+                                            ...this.getDataFormat(types.abscissa.vegaType, types.abscissa.field)
+                                        },
+                                        {
+                                            field: 'value',
+                                            type: types.ordinate.vegaType,
+                                            title: options.ordinate.label,
+                                            ...this.getDataFormat(types.ordinate.vegaType, types.ordinate.field)
                                         },
-                                        { field: 'value', type: types.ordinate.vegaType, title: options.ordinate.label },
                                         {
                                             field: 'series',
                                             title: legendTitle,
@@ -322,11 +320,14 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                                             field: 'key',
                                             type: types.abscissa.vegaType,
                                             title: options.abscissa.label,
-                                            ...(types.abscissa.vegaType === 'temporal'
-                                                ? { format: '%Y-%B-%dT%H:%M:%S', scale: { type: 'utc' } }
-                                                : {})
+                                            ...this.getDataFormat(types.abscissa.vegaType, types.abscissa.field)
                                         },
-                                        { field: 'value', type: types.ordinate.vegaType, title: options.ordinate.label }
+                                        {
+                                            field: 'value',
+                                            type: types.ordinate.vegaType,
+                                            title: options.ordinate.label,
+                                            ...this.getDataFormat(types.ordinate.vegaType, types.ordinate.field)
+                                        }
                                     ]
                                 : undefined
                         }
@@ -550,7 +551,7 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                 ...this.optionsCopy$.value,
                 abscissa: { ...this.optionsCopy$.value?.abscissa, label: attr?.name ?? 'attr-not-found' }
             });
-            this.copyAbscissaField = this.fields.find((field) => attr?.field === field.id);
+            this.copyAbscissaField = this.fields.find((field) => attr?.field.id === field.id);
             this.enableIntervals(!!this.optionsCopy$.value?.abscissa.interval);
         }
     }
@@ -576,7 +577,7 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
                 ...this.optionsCopy$.value,
                 ordinate: { ...this.optionsCopy$.value?.ordinate, label: attr?.name ?? 'attr-not-found' }
             });
-            this.copyOrdinateField = this.fields.find((field) => attr?.field === field.id);
+            this.copyOrdinateField = this.fields.find((field) => attr?.field.id === field.id);
         }
     }
     changeOrdinateLabel($event) {
@@ -823,8 +824,24 @@ class WidgetAggregatedChartComponent extends DataWidgetComponent {
     isTimeInterval(abscissaInterval) {
         return typeof abscissaInterval === 'string';
     }
+    getAxisFormat(axisType, field) {
+        const timeFormat = `timeFormat(datum.value, '${toD3Format(field?.format)}')`;
+        const numberFormat = `.${field?.decimalPrecision ?? 2}d`;
+        const truncatedFormat = 'truncate(datum.value, 10)';
+        return `height < 300 ? ${axisType === VegaType.TEMPORAL ? timeFormat : axisType === VegaType.QUANTITATIVE ? numberFormat : truncatedFormat} : ${axisType === VegaType.TEMPORAL ? timeFormat : axisType === VegaType.QUANTITATIVE ? numberFormat : 'datum.value'}`;
+    }
+    getDataFormat(axisType, field) {
+        switch (axisType) {
+            case VegaType.TEMPORAL:
+                return { format: toD3Format(field?.format), scale: { type: 'utc' } };
+            case VegaType.QUANTITATIVE:
+                return { format: `.${field?.decimalPrecision ?? 2}d` };
+            default:
+                return {};
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: WidgetAggregatedChartComponent, deps: [{ token: i1.Store }, { token: i2.PryI18nService }, { token: i0.ElementRef }, { token: i2.PryAggregationService }, { token: i3.PrySchemeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: WidgetAggregatedChartComponent, selector: "pry-widget-aggregated-chart", viewQueries: [{ propertyName: "vega", first: true, predicate: ["vega"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-aggregated-chart-css></pry-widget-aggregated-chart-css>\n<div\n  class=\"o-widget o-widget--chart\"\n  *ngIf=\"optionsCopy$ | async as optionsCopy\"\n  [class.-has-header]=\"displayHeader$ | async\"\n>\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n    [displayCount]=\"false\"\n    [openData$]=\"openData$\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [open$]=\"open$\"\n      [header]=\"header\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <div class=\"m-form-label-field\">\n          <pry-edit-input\n            label=\"@pry.widget.chart.title\"\n            (ngModelChange)=\"changeChartTitle($event)\"\n            [ngModel]=\"optionsCopy.graph.title\"\n          ></pry-edit-input>\n        </div>\n\n        <div *ngIf=\"optionsCopy\" class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"chart_type\">{{ '@pry.widget.chart.type' | i18n }}</label>\n          <pry-select\n            (ngModelChange)=\"changeType($event)\"\n            [items]=\"typeOptions\"\n            [ngModel]=\"optionsCopy.graph.type\"\n            bindLabel=\"label\"\n            bindValue=\"id\"\n            id=\"chart_type\"\n          ></pry-select>\n        </div>\n\n        <ng-container *ngIf=\"optionsCopy.graph.type === GraphType.DONUT\">\n          <pry-range\n            [ngModel]=\"optionsCopy.graph.donutSize\"\n            (ngModelChange)=\"changeDonutSize($event)\"\n            labelTranslate=\"@pry.widget.chart.donutSize\"\n            min=\"1\"\n            max=\"500\"\n          ></pry-range>\n        </ng-container>\n\n        <div class=\"m-form-label-field\">\n          <pry-checkbox (ngModelChange)=\"toggleLegend($event)\" [ngModel]=\"!!optionsCopy.graph.legend\">\n            {{ '@pry.widget.chart.legend' | i18n }}\n          </pry-checkbox>\n        </div>\n      </div>\n\n      <ng-container *ngIf=\"!!optionsCopy.graph.type\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"abscissa\">{{ '@pry.widget.chart.abscissa' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeAbscissa($event)\"\n              [items]=\"abscissaAttributes$ | async | prySortData: sortActive : sortDirection\"\n              [ngModel]=\"optionsCopy.abscissa.attribute\"\n              bindLabel=\"name\"\n              bindValue=\"id\"\n              id=\"abscissa\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-edit-input\n              label=\"@pry.widget.chart.dataLabel\"\n              (ngModelChange)=\"changeAbscissaLabel($event)\"\n              [ngModel]=\"optionsCopy.abscissa.label\"\n            ></pry-edit-input>\n          </div>\n\n          <div\n            *ngIf=\"\n              ['quantitative', 'temporal'].includes(translateToVegaType(copyAbscissaField?.type)) &&\n              optionsCopy.graph.type !== GraphType.DONUT &&\n              optionsCopy.graph.type !== GraphType.CIRCULAR\n            \"\n            class=\"m-form-label-field\"\n          >\n            <pry-checkbox (ngModelChange)=\"changeKeep0Abscissa($event)\" [ngModel]=\"optionsCopy.abscissa.keep0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n\n            <ng-container *ngIf=\"optionsCopy.graph.type === GraphType.HISTOGRAM\">\n              <pry-checkbox\n                (ngModelChange)=\"enableIntervals($event)\"\n                [ngModel]=\"!!optionsCopy.abscissa.interval\"\n                [disabled]=\"optionsCopy.graph.type === GraphType.HISTOGRAM\"\n                >{{ '@pry.widget.chart.interval' | i18n }}\n              </pry-checkbox>\n\n              <ng-container *ngIf=\"!!optionsCopy.abscissa.interval\">\n                <ng-container *ngIf=\"!isTimeInterval(optionsCopy.abscissa.interval); else timeInterval\">\n                  <pry-range\n                    [ngModel]=\"optionsCopy.abscissa.interval\"\n                    (ngModelChange)=\"changeInterval($event)\"\n                    labelTranslate=\"@pry.widget.chart.specifyInterval\"\n                    min=\"1\"\n                    max=\"10\"\n                  ></pry-range>\n                </ng-container>\n\n                <ng-template #timeInterval>\n                  <label class=\"a-label\" for=\"time_interval\">{{ '@pry.widget.chart.timeInterval' | i18n }}</label>\n                  <pry-select\n                    (ngModelChange)=\"changeTimeInterval($event)\"\n                    [items]=\"['second', 'minute', 'hour', 'day', 'week', 'month', 'quarter', 'year']\"\n                    [ngModel]=\"optionsCopy.abscissa.interval\"\n                    i18nPrefix=\"@pry.widget.chart.time.\"\n                    id=\"time_interval\"\n                  ></pry-select>\n                </ng-template>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"operations\">{{ '@pry.widget.chart.operation.title' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeOperation($event)\"\n              [items]=\"operations$ | async\"\n              [ngModel]=\"optionsCopy.ordinate.operation\"\n              bindLabel=\"label\"\n              bindValue=\"id\"\n              id=\"operations\"\n            ></pry-select>\n          </div>\n\n          <ng-container *ngIf=\"optionsCopy.ordinate.operation !== Operation.COUNT\">\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"ordinate\">{{ '@pry.widget.chart.ordinate' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"changeOrdinate($event)\"\n                [items]=\"ordinateAttributes$ | async | prySortData: sortActive : sortDirection\"\n                [ngModel]=\"optionsCopy.ordinate.attribute\"\n                bindLabel=\"name\"\n                bindValue=\"id\"\n                id=\"ordinate\"\n              ></pry-select>\n            </div>\n          </ng-container>\n\n          <div class=\"m-form-label-field\">\n            <pry-edit-input\n              label=\"@pry.widget.chart.dataLabel\"\n              (ngModelChange)=\"changeOrdinateLabel($event)\"\n              [ngModel]=\"optionsCopy.ordinate.label\"\n            ></pry-edit-input>\n          </div>\n\n          <div *ngIf=\"translateToVegaType(copyOrdinateField?.type) === 'quantitative'\" class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"changeKeep0Ordinate($event)\" [ngModel]=\"optionsCopy.ordinate.keep0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n\n        <ng-container\n          *ngIf=\"optionsCopy.graph.type !== GraphType.DONUT && optionsCopy.graph.type !== GraphType.CIRCULAR\"\n        >\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox (ngModelChange)=\"toggleGroupBy($event)\" [ngModel]=\"!!optionsCopy.groupBy\"\n                >{{ '@pry.widget.chart.groupBy' | i18n }}\n              </pry-checkbox>\n            </div>\n\n            <ng-container *ngIf=\"!!optionsCopy.groupBy\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_seriesAttr\">{{ '@pry.widget.chart.groupAttr' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeGroupBy($event)\"\n                  [ngModel]=\"optionsCopy.groupBy.attribute\"\n                  [items]=\"abscissaAttributes$ | async | prySortData: sortActive : sortDirection\"\n                  bindLabel=\"name\"\n                  bindValue=\"id\"\n                  id=\"chart_seriesAttr\"\n                ></pry-select>\n              </div>\n\n              <div class=\"m-form-label-field\">\n                <pry-scheme-picker\n                  (ngModelChange)=\"changeColorScheme($event)\"\n                  [ngModel]=\"optionsCopy.groupBy.color\"\n                ></pry-scheme-picker>\n              </div>\n\n              <div class=\"m-form-label-field\">\n                <pry-checkbox [ngModel]=\"optionsCopy.graph.stacked\" (ngModelChange)=\"toggleStacked($event)\">\n                  {{ '@pry.widget.chart.stacked' | i18n }}\n                </pry-checkbox>\n              </div>\n            </ng-container>\n          </div>\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox\n                (ngModelChange)=\"toggleLimitItems($event)\"\n                [ngModel]=\"optionsCopy.abscissa.limit !== undefined && optionsCopy.abscissa.limit !== null\"\n              >\n                {{ '@pry.widget.chart.limit' | i18n }}\n              </pry-checkbox>\n            </div>\n            <ng-container *ngIf=\"optionsCopy.abscissa.limit !== undefined && optionsCopy.abscissa.limit !== null\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_limitItemsValue\">{{ '@pry.widget.chart.limitMaxNb' | i18n }}</label>\n                <input\n                  type=\"number\"\n                  id=\"chart_limitItemsValue\"\n                  class=\"a-form-field\"\n                  [ngModel]=\"optionsCopy.abscissa.limit\"\n                  (ngModelChange)=\"changeLimitValue($event)\"\n                  min=\"1\"\n                  step=\"1\"\n                  [attr.aria-invalid]=\"optionsCopy.abscissa.limit < 1\"\n                />\n              </div>\n            </ng-container>\n          </div>\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox (ngModelChange)=\"toggleSort($event)\" [ngModel]=\"!!optionsCopy.graph.sort\"\n                >{{ '@pry.widget.chart.sort.title' | i18n }}\n              </pry-checkbox>\n            </div>\n            <ng-container *ngIf=\"!!optionsCopy.graph.sort\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_sortValue\">{{ '@pry.widget.chart.sort.attribute' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeSortValue($event)\"\n                  [ngModel]=\"optionsCopy.graph.sort.value\"\n                  [items]=\"sortValues$ | async\"\n                  bindValue=\"value\"\n                  bindLabel=\"label\"\n                  id=\"chart_sortValue\"\n                ></pry-select>\n              </div>\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_sortDirection\">{{ '@pry.widget.chart.sort.direction' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeSortDirection($event)\"\n                  [ngModel]=\"optionsCopy.graph.sort.direction\"\n                  [items]=\"sortDirections\"\n                  bindValue=\"value\"\n                  bindLabel=\"label\"\n                  id=\"chart_sortDirection\"\n                ></pry-select>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n\n        <ng-container\n          *ngIf=\"optionsCopy.graph.type === GraphType.DONUT || optionsCopy.graph.type === GraphType.CIRCULAR\"\n        >\n          <pry-scheme-picker\n            (ngModelChange)=\"changeCircleColorScheme($event)\"\n            [ngModel]=\"optionsCopy.circleColorScheme\"\n          ></pry-scheme-picker>\n        </ng-container>\n\n        <ng-container\n          *ngIf=\"\n            optionsCopy.graph.type !== GraphType.DONUT &&\n            optionsCopy.graph.type !== GraphType.CIRCULAR &&\n            !optionsCopy.groupBy\n          \"\n        >\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_baseColor\">{{ '@pry.widget.chart.color' | i18n }}</label>\n            <pry-color-picker\n              (ngModelChange)=\"changeBaseColor($event)\"\n              [ngModel]=\"optionsCopy.baseColor\"\n              id=\"chart_baseColor\"\n            ></pry-color-picker>\n            <ng-template #templateOption let-item=\"item\">\n              <div class=\"aligned-option\">\n                <div class=\"a-chip -md\" [style.background-color]=\"item\">{{ item }}</div>\n              </div>\n            </ng-template>\n          </div>\n        </ng-container>\n      </ng-container>\n    </pry-settings>\n  </pry-widget-header>\n\n  <ng-container *ngIf=\"(isChartValid$ | async) && !(noData$ | async) && !(noAggregationData$ | async)\">\n    <div #vega></div>\n  </ng-container>\n\n  <ng-container *ngIf=\"noData$ | async\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.noData' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.noData' | i18n }}</span>\n      <button type=\"button\" (click)=\"openData()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.tooltip.readSearch' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(noData$ | async) && (noAggregationData$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.aggNoResult' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.aggNoResult' | i18n }}</span>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(noData$ | async) && !(noAggregationData$ | async) && !(isChartValid$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.chooseParameters' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.chooseParameters' | i18n }}</span>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["triggerClick", "saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i6.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "component", type: i2.PryEditInputComponent, selector: "pry-edit-input", inputs: ["label", "editButtonTooltip", "confirmButtonTooltip"], outputs: ["validated"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i7.PryColorPickerComponent, selector: "pry-color-picker" }, { kind: "component", type: i3.PrySchemePickerComponent, selector: "pry-scheme-picker" }, { kind: "component", type: PryWidgetAggregatedChartCssComponent, selector: "pry-widget-aggregated-chart-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }, { kind: "pipe", type: i2.PrySortDataPipe, name: "prySortData" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: WidgetAggregatedChartComponent, selector: "pry-widget-aggregated-chart", viewQueries: [{ propertyName: "vega", first: true, predicate: ["vega"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-aggregated-chart-css></pry-widget-aggregated-chart-css>\n<div\n  class=\"o-widget o-widget--chart\"\n  *ngIf=\"optionsCopy$ | async as optionsCopy\"\n  [class.-has-header]=\"displayHeader$ | async\"\n>\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n    [displayCount]=\"false\"\n    [openData$]=\"openData$\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [open$]=\"open$\"\n      [header]=\"header\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <div class=\"m-form-label-field\">\n          <pry-edit-input\n            label=\"@pry.widget.chart.title\"\n            (ngModelChange)=\"changeChartTitle($event)\"\n            [ngModel]=\"optionsCopy.graph.title\"\n          ></pry-edit-input>\n        </div>\n\n        <div *ngIf=\"optionsCopy\" class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"chart_type\">{{ '@pry.widget.chart.type' | i18n }}</label>\n          <pry-select\n            (ngModelChange)=\"changeType($event)\"\n            [items]=\"typeOptions\"\n            [ngModel]=\"optionsCopy.graph.type\"\n            bindLabel=\"label\"\n            bindValue=\"id\"\n            id=\"chart_type\"\n          ></pry-select>\n        </div>\n\n        <ng-container *ngIf=\"optionsCopy.graph.type === GraphType.DONUT\">\n          <pry-range\n            [ngModel]=\"optionsCopy.graph.donutSize\"\n            (ngModelChange)=\"changeDonutSize($event)\"\n            labelTranslate=\"@pry.widget.chart.donutSize\"\n            min=\"1\"\n            max=\"500\"\n          ></pry-range>\n        </ng-container>\n\n        <div class=\"m-form-label-field\">\n          <pry-checkbox (ngModelChange)=\"toggleLegend($event)\" [ngModel]=\"!!optionsCopy.graph.legend\">\n            {{ '@pry.widget.chart.legend' | i18n }}\n          </pry-checkbox>\n        </div>\n      </div>\n\n      <ng-container *ngIf=\"!!optionsCopy.graph.type\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"abscissa\">{{ '@pry.widget.chart.abscissa' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeAbscissa($event)\"\n              [items]=\"abscissaAttributes$ | async | prySortData: sortActive : sortDirection\"\n              [ngModel]=\"optionsCopy.abscissa.attribute\"\n              bindLabel=\"name\"\n              bindValue=\"id\"\n              id=\"abscissa\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-edit-input\n              label=\"@pry.widget.chart.dataLabel\"\n              (ngModelChange)=\"changeAbscissaLabel($event)\"\n              [ngModel]=\"optionsCopy.abscissa.label\"\n            ></pry-edit-input>\n          </div>\n\n          <div\n            *ngIf=\"\n              ['quantitative', 'temporal'].includes(translateToVegaType(copyAbscissaField?.type)) &&\n              optionsCopy.graph.type !== GraphType.DONUT &&\n              optionsCopy.graph.type !== GraphType.CIRCULAR\n            \"\n            class=\"m-form-label-field\"\n          >\n            <pry-checkbox (ngModelChange)=\"changeKeep0Abscissa($event)\" [ngModel]=\"optionsCopy.abscissa.keep0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n\n            <ng-container *ngIf=\"optionsCopy.graph.type === GraphType.HISTOGRAM\">\n              <pry-checkbox\n                (ngModelChange)=\"enableIntervals($event)\"\n                [ngModel]=\"!!optionsCopy.abscissa.interval\"\n                [disabled]=\"optionsCopy.graph.type === GraphType.HISTOGRAM\"\n                >{{ '@pry.widget.chart.interval' | i18n }}\n              </pry-checkbox>\n\n              <ng-container *ngIf=\"!!optionsCopy.abscissa.interval\">\n                <ng-container *ngIf=\"!isTimeInterval(optionsCopy.abscissa.interval); else timeInterval\">\n                  <pry-range\n                    [ngModel]=\"optionsCopy.abscissa.interval\"\n                    (ngModelChange)=\"changeInterval($event)\"\n                    labelTranslate=\"@pry.widget.chart.specifyInterval\"\n                    min=\"1\"\n                    max=\"10\"\n                  ></pry-range>\n                </ng-container>\n\n                <ng-template #timeInterval>\n                  <label class=\"a-label\" for=\"time_interval\">{{ '@pry.widget.chart.timeInterval' | i18n }}</label>\n                  <pry-select\n                    (ngModelChange)=\"changeTimeInterval($event)\"\n                    [items]=\"['second', 'minute', 'hour', 'day', 'week', 'month', 'quarter', 'year']\"\n                    [ngModel]=\"optionsCopy.abscissa.interval\"\n                    i18nPrefix=\"@pry.widget.chart.time.\"\n                    id=\"time_interval\"\n                  ></pry-select>\n                </ng-template>\n              </ng-container>\n            </ng-container>\n          </div>\n        </div>\n\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"operations\">{{ '@pry.widget.chart.operation.title' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeOperation($event)\"\n              [items]=\"operations$ | async\"\n              [ngModel]=\"optionsCopy.ordinate.operation\"\n              bindLabel=\"label\"\n              bindValue=\"id\"\n              id=\"operations\"\n            ></pry-select>\n          </div>\n\n          <ng-container *ngIf=\"optionsCopy.ordinate.operation !== Operation.COUNT\">\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"ordinate\">{{ '@pry.widget.chart.ordinate' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"changeOrdinate($event)\"\n                [items]=\"ordinateAttributes$ | async | prySortData: sortActive : sortDirection\"\n                [ngModel]=\"optionsCopy.ordinate.attribute\"\n                bindLabel=\"name\"\n                bindValue=\"id\"\n                id=\"ordinate\"\n              ></pry-select>\n            </div>\n          </ng-container>\n\n          <div class=\"m-form-label-field\">\n            <pry-edit-input\n              label=\"@pry.widget.chart.dataLabel\"\n              (ngModelChange)=\"changeOrdinateLabel($event)\"\n              [ngModel]=\"optionsCopy.ordinate.label\"\n            ></pry-edit-input>\n          </div>\n\n          <div *ngIf=\"translateToVegaType(copyOrdinateField?.type) === 'quantitative'\" class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"changeKeep0Ordinate($event)\" [ngModel]=\"optionsCopy.ordinate.keep0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n\n        <ng-container\n          *ngIf=\"optionsCopy.graph.type !== GraphType.DONUT && optionsCopy.graph.type !== GraphType.CIRCULAR\"\n        >\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox (ngModelChange)=\"toggleGroupBy($event)\" [ngModel]=\"!!optionsCopy.groupBy\"\n                >{{ '@pry.widget.chart.groupBy' | i18n }}\n              </pry-checkbox>\n            </div>\n\n            <ng-container *ngIf=\"!!optionsCopy.groupBy\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_seriesAttr\">{{ '@pry.widget.chart.groupAttr' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeGroupBy($event)\"\n                  [ngModel]=\"optionsCopy.groupBy.attribute\"\n                  [items]=\"abscissaAttributes$ | async | prySortData: sortActive : sortDirection\"\n                  bindLabel=\"name\"\n                  bindValue=\"id\"\n                  id=\"chart_seriesAttr\"\n                ></pry-select>\n              </div>\n\n              <div class=\"m-form-label-field\">\n                <pry-scheme-picker\n                  (ngModelChange)=\"changeColorScheme($event)\"\n                  [ngModel]=\"optionsCopy.groupBy.color\"\n                ></pry-scheme-picker>\n              </div>\n\n              <div class=\"m-form-label-field\">\n                <pry-checkbox [ngModel]=\"optionsCopy.graph.stacked\" (ngModelChange)=\"toggleStacked($event)\">\n                  {{ '@pry.widget.chart.stacked' | i18n }}\n                </pry-checkbox>\n              </div>\n            </ng-container>\n          </div>\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox\n                (ngModelChange)=\"toggleLimitItems($event)\"\n                [ngModel]=\"optionsCopy.abscissa.limit !== undefined && optionsCopy.abscissa.limit !== null\"\n              >\n                {{ '@pry.widget.chart.limit' | i18n }}\n              </pry-checkbox>\n            </div>\n            <ng-container *ngIf=\"optionsCopy.abscissa.limit !== undefined && optionsCopy.abscissa.limit !== null\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_limitItemsValue\">{{ '@pry.widget.chart.limitMaxNb' | i18n }}</label>\n                <input\n                  type=\"number\"\n                  id=\"chart_limitItemsValue\"\n                  class=\"a-form-field\"\n                  [ngModel]=\"optionsCopy.abscissa.limit\"\n                  (ngModelChange)=\"changeLimitValue($event)\"\n                  min=\"1\"\n                  step=\"1\"\n                  [attr.aria-invalid]=\"optionsCopy.abscissa.limit < 1\"\n                />\n              </div>\n            </ng-container>\n          </div>\n          <div class=\"o-settings__popup__content__fields -condensed\">\n            <div class=\"m-form-label-field\">\n              <pry-checkbox (ngModelChange)=\"toggleSort($event)\" [ngModel]=\"!!optionsCopy.graph.sort\"\n                >{{ '@pry.widget.chart.sort.title' | i18n }}\n              </pry-checkbox>\n            </div>\n            <ng-container *ngIf=\"!!optionsCopy.graph.sort\">\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_sortValue\">{{ '@pry.widget.chart.sort.attribute' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeSortValue($event)\"\n                  [ngModel]=\"optionsCopy.graph.sort.value\"\n                  [items]=\"sortValues$ | async\"\n                  bindValue=\"value\"\n                  bindLabel=\"label\"\n                  id=\"chart_sortValue\"\n                ></pry-select>\n              </div>\n              <div class=\"m-form-label-field\">\n                <label class=\"a-label\" for=\"chart_sortDirection\">{{ '@pry.widget.chart.sort.direction' | i18n }}</label>\n                <pry-select\n                  (ngModelChange)=\"changeSortDirection($event)\"\n                  [ngModel]=\"optionsCopy.graph.sort.direction\"\n                  [items]=\"sortDirections\"\n                  bindValue=\"value\"\n                  bindLabel=\"label\"\n                  id=\"chart_sortDirection\"\n                ></pry-select>\n              </div>\n            </ng-container>\n          </div>\n        </ng-container>\n\n        <ng-container\n          *ngIf=\"optionsCopy.graph.type === GraphType.DONUT || optionsCopy.graph.type === GraphType.CIRCULAR\"\n        >\n          <pry-scheme-picker\n            (ngModelChange)=\"changeCircleColorScheme($event)\"\n            [ngModel]=\"optionsCopy.circleColorScheme\"\n          ></pry-scheme-picker>\n        </ng-container>\n\n        <ng-container\n          *ngIf=\"\n            optionsCopy.graph.type !== GraphType.DONUT &&\n            optionsCopy.graph.type !== GraphType.CIRCULAR &&\n            !optionsCopy.groupBy\n          \"\n        >\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_baseColor\">{{ '@pry.widget.chart.color' | i18n }}</label>\n            <pry-color-picker\n              (ngModelChange)=\"changeBaseColor($event)\"\n              [ngModel]=\"optionsCopy.baseColor\"\n              id=\"chart_baseColor\"\n            ></pry-color-picker>\n            <ng-template #templateOption let-item=\"item\">\n              <div class=\"aligned-option\">\n                <div class=\"a-chip -md\" [style.background-color]=\"item\">{{ item }}</div>\n              </div>\n            </ng-template>\n          </div>\n        </ng-container>\n      </ng-container>\n    </pry-settings>\n  </pry-widget-header>\n\n  <ng-container *ngIf=\"(isChartValid$ | async) && !(noData$ | async) && !(noAggregationData$ | async)\">\n    <div #vega></div>\n  </ng-container>\n\n  <ng-container *ngIf=\"noData$ | async\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.noData' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.noData' | i18n }}</span>\n      <button type=\"button\" (click)=\"openData()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.tooltip.readSearch' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(noData$ | async) && (noAggregationData$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.aggNoResult' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.aggNoResult' | i18n }}</span>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(noData$ | async) && !(noAggregationData$ | async) && !(isChartValid$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <img\n        class=\"no-result__search\"\n        src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n        alt=\"{{ '@pry.widget.chart.chooseParameters' | i18n }}\"\n        aria-hidden=\"true\"\n      />\n      <span class=\"no-result__text\">{{ '@pry.widget.chart.chooseParameters' | i18n }}</span>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["triggerClick", "saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["items", "clearable", "multiple", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "autocomplete", "alwaysShowAutosuggestedValues", "externalAutocompleteService", "bindValue", "bindLabel", "iconSize", "bindIcon", "template", "i18nPrefix", "bindClasses", "loading", "elementRef"], outputs: ["searched", "cleared", "clicked"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i6.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle", "name", "inputId", "inhibit"] }, { kind: "component", type: i2.PryEditInputComponent, selector: "pry-edit-input", inputs: ["label", "editButtonTooltip", "confirmButtonTooltip"], outputs: ["validated"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i7.PryColorPickerComponent, selector: "pry-color-picker" }, { kind: "component", type: i3.PrySchemePickerComponent, selector: "pry-scheme-picker" }, { kind: "component", type: PryWidgetAggregatedChartCssComponent, selector: "pry-widget-aggregated-chart-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }, { kind: "pipe", type: i2.PrySortDataPipe, name: "prySortData" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: WidgetAggregatedChartComponent, decorators: [{
             type: Component,