diff --git a/docs/addons/ontimize_web_ngx_charts/configuration/00-overviewchart.md b/docs/addons/ontimize_web_ngx_charts/configuration/00-overviewchart.md index a6912c9c6..702e178da 100644 --- a/docs/addons/ontimize_web_ngx_charts/configuration/00-overviewchart.md +++ b/docs/addons/ontimize_web_ngx_charts/configuration/00-overviewchart.md @@ -127,4 +127,65 @@ export class CandlestickComponent { this.candlestick.setDataArray(DataAdapterUtils.adapter.adaptResult(data)); } } +``` + +## Tooltip + +Tooltips provide valuable contextual information for charts. You can either use the default tooltip or customize it according to your needs. + +### Default Tooltip + +In some cases, you may want to enable the default tooltip without customizing it with a template. To do this, you can simply use the `show-tooltip` property, and the chart will automatically display a default tooltip with the available data. + +In this example, the tooltip is enabled for a *Line Chart* without the need to define a custom template: + +*HTML* + +```html + + +``` +### Custom Tooltip + +Tooltips in charts provide valuable contextual information. This section explains how to customize tooltips for a *Line Chart* by modifying the date format, content, and style. + +#### Customizing Tooltip Content + +You can define custom tooltip templates to format the displayed data. + +*HTML* + +```html + + + Date: {{model?.name | oMoment : dateArgs}}
+ Value: {{model?.value | oCurrency : currencyArgs}} +
+ + Series Tooltip: {{model?.name}} - {{model?.value}} + +
+``` + +#### Adding Interactivity + +You can capture tooltip-related events and customize behavior. + +*TS* + +```ts +currencyArgs: ICurrencyPipeArgument = { + currencySimbol: '€', + currencySymbolPosition: 'right', + grouping: true, + thousandSeparator: '.', + decimalSeparator: ',', + }; +dateArgs: IMomentPipeArgument = { format: 'DD/MM/YYYY' }; + +activate(event: any) { + console.log("Tooltip activated:", event); +} ``` \ No newline at end of file diff --git a/docs/aditional-information/52-versions.md b/docs/aditional-information/52-versions.md index f66d239f1..053944220 100644 --- a/docs/aditional-information/52-versions.md +++ b/docs/aditional-information/52-versions.md @@ -29,13 +29,16 @@ In this section you can check the different releases of **OntimizeWeb** and its + 15.5.1 + 15.0.0 + 15.0.1
15.0.0 + 15.1.4
15.1.3
15.1.2
15.1.1
15.1.0
15.0.1
15.0.0 + 15.1.2
15.1.1
15.1.0
15.0.0 + 15.0.3
15.0.2
15.0.1
15.0.0 + 15.1.0
15.0.0 + + 15.5.0 - 15.0.0 - 15.0.1
15.0.0 - 15.1.3
15.1.2
15.1.1
15.1.0
15.0.1
15.0.0 - 15.1.2
15.1.1
15.1.0
15.0.0 - 15.0.3
15.0.2
15.0.1
15.0.0 - 15.1.0
15.0.0 15.4.4 @@ -45,7 +48,6 @@ In this section you can check the different releases of **OntimizeWeb** and its 15.4.2 - 15.4.1 @@ -110,6 +112,7 @@ In this section you can check the different releases of **OntimizeWeb** and its + - The prefix _ontimize-web-ngx_ was omitted from the names of the addons. {: .note }