diff --git a/chart-sdk/angular/bullet-charts/accessibility.md b/chart-sdk/angular/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/angular/bullet-charts/accessibility.md rename to chart-sdk/angular/bullet-chart/accessibility.md diff --git a/chart-sdk/angular/bullet-charts/axis-customization.md b/chart-sdk/angular/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/angular/bullet-charts/axis-customization.md rename to chart-sdk/angular/bullet-chart/axis-customization.md diff --git a/chart-sdk/angular/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/angular/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/angular/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/angular/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/angular/bullet-charts/comparative-bar.md b/chart-sdk/angular/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/angular/bullet-charts/comparative-bar.md rename to chart-sdk/angular/bullet-chart/comparative-bar.md diff --git a/chart-sdk/angular/bullet-charts/customization.md b/chart-sdk/angular/bullet-chart/customization.md similarity index 100% rename from chart-sdk/angular/bullet-charts/customization.md rename to chart-sdk/angular/bullet-chart/customization.md diff --git a/chart-sdk/angular/bullet-charts/data-binding.md b/chart-sdk/angular/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/angular/bullet-charts/data-binding.md rename to chart-sdk/angular/bullet-chart/data-binding.md diff --git a/chart-sdk/angular/bullet-charts/data-label.md b/chart-sdk/angular/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/angular/bullet-charts/data-label.md rename to chart-sdk/angular/bullet-chart/data-label.md diff --git a/chart-sdk/angular/bullet-charts/getting-started.md b/chart-sdk/angular/bullet-chart/getting-started.md similarity index 100% rename from chart-sdk/angular/bullet-charts/getting-started.md rename to chart-sdk/angular/bullet-chart/getting-started.md diff --git a/chart-sdk/angular/bullet-charts/ranges.md b/chart-sdk/angular/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/angular/bullet-charts/ranges.md rename to chart-sdk/angular/bullet-chart/ranges.md diff --git a/chart-sdk/angular/bullet-charts/title.md b/chart-sdk/angular/bullet-chart/title.md similarity index 100% rename from chart-sdk/angular/bullet-charts/title.md rename to chart-sdk/angular/bullet-chart/title.md diff --git a/chart-sdk/angular/bullet-charts/tool-tip.md b/chart-sdk/angular/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/angular/bullet-charts/tool-tip.md rename to chart-sdk/angular/bullet-chart/tool-tip.md diff --git a/chart-sdk/angular/bullet-charts/value-bar.md b/chart-sdk/angular/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/angular/bullet-charts/value-bar.md rename to chart-sdk/angular/bullet-chart/value-bar.md diff --git a/chart-sdk/angular/heatmap-charts/accessibility.md b/chart-sdk/angular/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/accessibility.md rename to chart-sdk/angular/heatmap-chart/accessibility.md diff --git a/chart-sdk/angular/heatmap-charts/appearance.md b/chart-sdk/angular/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/appearance.md rename to chart-sdk/angular/heatmap-chart/appearance.md diff --git a/chart-sdk/angular/heatmap-charts/axis.md b/chart-sdk/angular/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/axis.md rename to chart-sdk/angular/heatmap-chart/axis.md diff --git a/chart-sdk/angular/heatmap-charts/bubble-heatmap.md b/chart-sdk/angular/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/bubble-heatmap.md rename to chart-sdk/angular/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/angular/heatmap-charts/dimensions.md b/chart-sdk/angular/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/dimensions.md rename to chart-sdk/angular/heatmap-chart/dimensions.md diff --git a/chart-sdk/angular/heatmap-charts/ej1-api-migration.md b/chart-sdk/angular/heatmap-chart/ej1-api-migration.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/ej1-api-migration.md rename to chart-sdk/angular/heatmap-chart/ej1-api-migration.md diff --git a/chart-sdk/angular/heatmap-charts/events.md b/chart-sdk/angular/heatmap-chart/events.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/events.md rename to chart-sdk/angular/heatmap-chart/events.md diff --git a/chart-sdk/angular/heatmap-charts/getting-started.md b/chart-sdk/angular/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/getting-started.md rename to chart-sdk/angular/heatmap-chart/getting-started.md diff --git a/chart-sdk/angular/heatmap-charts/how-to/legend-customization.md b/chart-sdk/angular/heatmap-chart/how-to/legend-customization.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/how-to/legend-customization.md rename to chart-sdk/angular/heatmap-chart/how-to/legend-customization.md diff --git a/chart-sdk/angular/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/angular/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/angular/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/angular/heatmap-charts/legend.md b/chart-sdk/angular/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/legend.md rename to chart-sdk/angular/heatmap-chart/legend.md diff --git a/chart-sdk/angular/heatmap-charts/palette.md b/chart-sdk/angular/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/palette.md rename to chart-sdk/angular/heatmap-chart/palette.md diff --git a/chart-sdk/angular/heatmap-charts/rendering-mode.md b/chart-sdk/angular/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/rendering-mode.md rename to chart-sdk/angular/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/angular/heatmap-charts/selection.md b/chart-sdk/angular/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/selection.md rename to chart-sdk/angular/heatmap-chart/selection.md diff --git a/chart-sdk/angular/heatmap-charts/title.md b/chart-sdk/angular/heatmap-chart/title.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/title.md rename to chart-sdk/angular/heatmap-chart/title.md diff --git a/chart-sdk/angular/heatmap-charts/tooltip.md b/chart-sdk/angular/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/tooltip.md rename to chart-sdk/angular/heatmap-chart/tooltip.md diff --git a/chart-sdk/angular/heatmap-charts/working-with-data.md b/chart-sdk/angular/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/angular/heatmap-charts/working-with-data.md rename to chart-sdk/angular/heatmap-chart/working-with-data.md diff --git a/chart-sdk/angular/smith-charts/accessibility.md b/chart-sdk/angular/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/angular/smith-charts/accessibility.md rename to chart-sdk/angular/smith-chart/accessibility.md diff --git a/chart-sdk/angular/smith-charts/getting-started.md b/chart-sdk/angular/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/angular/smith-charts/getting-started.md rename to chart-sdk/angular/smith-chart/getting-started.md diff --git a/chart-sdk/angular/smith-charts/images/Ai.png b/chart-sdk/angular/smith-chart/images/Ai.png similarity index 100% rename from chart-sdk/angular/smith-charts/images/Ai.png rename to chart-sdk/angular/smith-chart/images/Ai.png diff --git a/chart-sdk/angular/smith-charts/images/SSR.png b/chart-sdk/angular/smith-chart/images/SSR.png similarity index 100% rename from chart-sdk/angular/smith-charts/images/SSR.png rename to chart-sdk/angular/smith-chart/images/SSR.png diff --git a/chart-sdk/angular/smith-charts/smith-chart-axis.md b/chart-sdk/angular/smith-chart/smith-chart-axis.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-axis.md rename to chart-sdk/angular/smith-chart/smith-chart-axis.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-dimensions.md b/chart-sdk/angular/smith-chart/smith-chart-dimensions.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-dimensions.md rename to chart-sdk/angular/smith-chart/smith-chart-dimensions.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-legend.md b/chart-sdk/angular/smith-chart/smith-chart-legend.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-legend.md rename to chart-sdk/angular/smith-chart/smith-chart-legend.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-marker.md b/chart-sdk/angular/smith-chart/smith-chart-marker.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-marker.md rename to chart-sdk/angular/smith-chart/smith-chart-marker.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-print.md b/chart-sdk/angular/smith-chart/smith-chart-print.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-print.md rename to chart-sdk/angular/smith-chart/smith-chart-print.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-series.md b/chart-sdk/angular/smith-chart/smith-chart-series.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-series.md rename to chart-sdk/angular/smith-chart/smith-chart-series.md diff --git a/chart-sdk/angular/smith-charts/smith-chart-tooltip.md b/chart-sdk/angular/smith-chart/smith-chart-tooltip.md similarity index 100% rename from chart-sdk/angular/smith-charts/smith-chart-tooltip.md rename to chart-sdk/angular/smith-chart/smith-chart-tooltip.md diff --git a/chart-sdk/angular/smith-charts/title-subtitle.md b/chart-sdk/angular/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/angular/smith-charts/title-subtitle.md rename to chart-sdk/angular/smith-chart/title-subtitle.md diff --git a/chart-sdk/angular/smith-charts/working-with-data.md b/chart-sdk/angular/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/angular/smith-charts/working-with-data.md rename to chart-sdk/angular/smith-chart/working-with-data.md diff --git a/chart-sdk/angular/sparkline/accessibility.md b/chart-sdk/angular/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/angular/sparkline/accessibility.md rename to chart-sdk/angular/sparkline-charts/accessibility.md diff --git a/chart-sdk/angular/sparkline/appearance.md b/chart-sdk/angular/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/angular/sparkline/appearance.md rename to chart-sdk/angular/sparkline-charts/appearance.md diff --git a/chart-sdk/angular/sparkline/axis-customization.md b/chart-sdk/angular/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/angular/sparkline/axis-customization.md rename to chart-sdk/angular/sparkline-charts/axis-customization.md diff --git a/chart-sdk/angular/sparkline/data-labels.md b/chart-sdk/angular/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/angular/sparkline/data-labels.md rename to chart-sdk/angular/sparkline-charts/data-labels.md diff --git a/chart-sdk/angular/sparkline/ej1-api-migration.md b/chart-sdk/angular/sparkline-charts/ej1-api-migration.md similarity index 100% rename from chart-sdk/angular/sparkline/ej1-api-migration.md rename to chart-sdk/angular/sparkline-charts/ej1-api-migration.md diff --git a/chart-sdk/angular/sparkline/getting-started.md b/chart-sdk/angular/sparkline-charts/getting-started.md similarity index 100% rename from chart-sdk/angular/sparkline/getting-started.md rename to chart-sdk/angular/sparkline-charts/getting-started.md diff --git a/chart-sdk/angular/sparkline/localization.md b/chart-sdk/angular/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/angular/sparkline/localization.md rename to chart-sdk/angular/sparkline-charts/localization.md diff --git a/chart-sdk/angular/sparkline/marker.md b/chart-sdk/angular/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/angular/sparkline/marker.md rename to chart-sdk/angular/sparkline-charts/marker.md diff --git a/chart-sdk/angular/sparkline/range-band.md b/chart-sdk/angular/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/angular/sparkline/range-band.md rename to chart-sdk/angular/sparkline-charts/range-band.md diff --git a/chart-sdk/angular/sparkline/sparkline-dimension.md b/chart-sdk/angular/sparkline-charts/sparkline-dimension.md similarity index 100% rename from chart-sdk/angular/sparkline/sparkline-dimension.md rename to chart-sdk/angular/sparkline-charts/sparkline-dimension.md diff --git a/chart-sdk/angular/sparkline/sparkline-types.md b/chart-sdk/angular/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/angular/sparkline/sparkline-types.md rename to chart-sdk/angular/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/angular/sparkline/special-points-customization.md b/chart-sdk/angular/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/angular/sparkline/special-points-customization.md rename to chart-sdk/angular/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/angular/sparkline/user-interaction.md b/chart-sdk/angular/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/angular/sparkline/user-interaction.md rename to chart-sdk/angular/sparkline-charts/user-interaction.md diff --git a/chart-sdk/asp-net-core/bullet-charts/accessibility.md b/chart-sdk/asp-net-core/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/accessibility.md rename to chart-sdk/asp-net-core/bullet-chart/accessibility.md diff --git a/chart-sdk/asp-net-core/bullet-charts/axis-customization.md b/chart-sdk/asp-net-core/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/axis-customization.md rename to chart-sdk/asp-net-core/bullet-chart/axis-customization.md diff --git a/chart-sdk/asp-net-core/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/asp-net-core/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/asp-net-core/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/asp-net-core/bullet-charts/comparative-bar.md b/chart-sdk/asp-net-core/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/comparative-bar.md rename to chart-sdk/asp-net-core/bullet-chart/comparative-bar.md diff --git a/chart-sdk/asp-net-core/bullet-charts/customization.md b/chart-sdk/asp-net-core/bullet-chart/customization.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/customization.md rename to chart-sdk/asp-net-core/bullet-chart/customization.md diff --git a/chart-sdk/asp-net-core/bullet-charts/data-binding.md b/chart-sdk/asp-net-core/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/data-binding.md rename to chart-sdk/asp-net-core/bullet-chart/data-binding.md diff --git a/chart-sdk/asp-net-core/bullet-charts/data-label.md b/chart-sdk/asp-net-core/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/data-label.md rename to chart-sdk/asp-net-core/bullet-chart/data-label.md diff --git a/chart-sdk/asp-net-core/bullet-charts/getting-started.md b/chart-sdk/asp-net-core/bullet-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/getting-started.md rename to chart-sdk/asp-net-core/bullet-chart/getting-started.md diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-actual-bar-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-actual-bar-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-actual-bar-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-actual-bar-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-actual-bar.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-actual-bar.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-actual-bar.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-actual-bar.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-category-label.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-category-label.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-category-label.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-category-label.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-component.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-component.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-component.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-component.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-custom-label-format.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-custom-label-format.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-custom-label-format.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-custom-label-format.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-data-binding.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-data-binding.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-data-binding.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-data-binding.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-data-label.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-data-label.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-data-label.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-data-label.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-dot-actual-bar.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-dot-actual-bar.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-dot-actual-bar.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-dot-actual-bar.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-grouping.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-grouping.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-grouping.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-grouping.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-label-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-label-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-label-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-label-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-label-format.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-label-format.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-label-format.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-label-format.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-labels-position.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-labels-position.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-labels-position.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-labels-position.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-alignment.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-alignment.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-alignment.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-alignment.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-color-mapping.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-color-mapping.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-color-mapping.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-color-mapping.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-on-custom-position.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-on-custom-position.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-on-custom-position.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-on-custom-position.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-on-top-position.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-on-top-position.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-on-top-position.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-on-top-position.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-paging.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-paging.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-paging.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-paging.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-size.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-size.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend-size.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend-size.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-legend.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-legend.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-margin.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-margin.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-margin.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-margin.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-opposed-position.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-opposed-position.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-opposed-position.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-opposed-position.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-orientation.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-orientation.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-orientation.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-orientation.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-range-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-range-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-range-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-range-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-range.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-range.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-range.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-range.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-ranges.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-ranges.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-ranges.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-ranges.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-rectangle-target-bar.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-rectangle-target-bar.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-rectangle-target-bar.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-rectangle-target-bar.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-right-to-left-direction.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-right-to-left-direction.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-right-to-left-direction.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-right-to-left-direction.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-subtitle.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-subtitle.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-subtitle.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-subtitle.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-target-bar-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-target-bar-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-target-bar-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-target-bar-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-target-bar.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-target-bar.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-target-bar.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-target-bar.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-theme.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-theme.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-theme.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-theme.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tick-line-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tick-line-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tick-line-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tick-line-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tick-position.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tick-position.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tick-position.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tick-position.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title-positions.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title-positions.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title-positions.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title-positions.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-title.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-title.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip-customization.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip-customization.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip-customization.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip-customization.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip-template.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip-template.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip-template.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip-template.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-tooltip.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-tooltip.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-with-border.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-with-border.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-with-border.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-with-border.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-with-title.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-with-title.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bullet-chart-with-title.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bullet-chart-with-title.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/blazor-bulletchart-tooltip.png b/chart-sdk/asp-net-core/bullet-chart/images/blazor-bulletchart-tooltip.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/blazor-bulletchart-tooltip.png rename to chart-sdk/asp-net-core/bullet-chart/images/blazor-bulletchart-tooltip.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-control.webp b/chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-control.webp similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-control.webp rename to chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-control.webp diff --git a/chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-with-title.webp b/chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-with-title.webp similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-with-title.webp rename to chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-with-title.webp diff --git a/chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-with-tooltip.webp b/chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-with-tooltip.webp similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/bullet-chart-with-tooltip.webp rename to chart-sdk/asp-net-core/bullet-chart/images/bullet-chart-with-tooltip.webp diff --git a/chart-sdk/asp-net-core/bullet-charts/images/default-template.png b/chart-sdk/asp-net-core/bullet-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/default-template.png rename to chart-sdk/asp-net-core/bullet-chart/images/default-template.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/nuget-demo.png b/chart-sdk/asp-net-core/bullet-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/nuget-demo.png rename to chart-sdk/asp-net-core/bullet-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/solution-explorer-core.png b/chart-sdk/asp-net-core/bullet-chart/images/solution-explorer-core.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/solution-explorer-core.png rename to chart-sdk/asp-net-core/bullet-chart/images/solution-explorer-core.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/target-color.png b/chart-sdk/asp-net-core/bullet-chart/images/target-color.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/target-color.png rename to chart-sdk/asp-net-core/bullet-chart/images/target-color.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/target-width.png b/chart-sdk/asp-net-core/bullet-chart/images/target-width.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/target-width.png rename to chart-sdk/asp-net-core/bullet-chart/images/target-width.png diff --git a/chart-sdk/asp-net-core/bullet-charts/images/value-fill.png b/chart-sdk/asp-net-core/bullet-chart/images/value-fill.png similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/images/value-fill.png rename to chart-sdk/asp-net-core/bullet-chart/images/value-fill.png diff --git a/chart-sdk/asp-net-core/bullet-charts/ranges.md b/chart-sdk/asp-net-core/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/ranges.md rename to chart-sdk/asp-net-core/bullet-chart/ranges.md diff --git a/chart-sdk/asp-net-core/bullet-charts/title.md b/chart-sdk/asp-net-core/bullet-chart/title.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/title.md rename to chart-sdk/asp-net-core/bullet-chart/title.md diff --git a/chart-sdk/asp-net-core/bullet-charts/tool-tip.md b/chart-sdk/asp-net-core/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/tool-tip.md rename to chart-sdk/asp-net-core/bullet-chart/tool-tip.md diff --git a/chart-sdk/asp-net-core/bullet-charts/value-bar.md b/chart-sdk/asp-net-core/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/asp-net-core/bullet-charts/value-bar.md rename to chart-sdk/asp-net-core/bullet-chart/value-bar.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/accessibility.md b/chart-sdk/asp-net-core/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/accessibility.md rename to chart-sdk/asp-net-core/heatmap-chart/accessibility.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/appearance.md b/chart-sdk/asp-net-core/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/appearance.md rename to chart-sdk/asp-net-core/heatmap-chart/appearance.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/axis.md b/chart-sdk/asp-net-core/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/axis.md rename to chart-sdk/asp-net-core/heatmap-chart/axis.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/bubble-heatmap.md b/chart-sdk/asp-net-core/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/bubble-heatmap.md rename to chart-sdk/asp-net-core/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/dimensions.md b/chart-sdk/asp-net-core/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/dimensions.md rename to chart-sdk/asp-net-core/heatmap-chart/dimensions.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/ej1-api-migration.md b/chart-sdk/asp-net-core/heatmap-chart/ej1-api-migration.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/ej1-api-migration.md rename to chart-sdk/asp-net-core/heatmap-chart/ej1-api-migration.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/events.md b/chart-sdk/asp-net-core/heatmap-chart/events.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/events.md rename to chart-sdk/asp-net-core/heatmap-chart/events.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/getting-started.md b/chart-sdk/asp-net-core/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/getting-started.md rename to chart-sdk/asp-net-core/heatmap-chart/getting-started.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/how-to/legend-label-customization.md b/chart-sdk/asp-net-core/heatmap-chart/how-to/legend-label-customization.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/how-to/legend-label-customization.md rename to chart-sdk/asp-net-core/heatmap-chart/how-to/legend-label-customization.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/asp-net-core/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/asp-net-core/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-JSON-cell-binding.png b/chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-JSON-cell-binding.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-JSON-cell-binding.png rename to chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-JSON-cell-binding.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-JSON-table-binding.png b/chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-JSON-table-binding.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-JSON-table-binding.png rename to chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-JSON-table-binding.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-array-cell-binding.png b/chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-array-cell-binding.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-array-cell-binding.png rename to chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-array-cell-binding.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-array-table-binding.png b/chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-array-table-binding.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/appearance/data-label-template-with-array-table-binding.png rename to chart-sdk/asp-net-core/heatmap-chart/images/appearance/data-label-template-with-array-table-binding.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-color-type.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-color-type.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-color-type.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-color-type.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-sector-type.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-sector-type.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-sector-type.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-sector-type.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-size-type.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-size-type.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-size-type.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-size-type.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-cell.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-cell.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-cell.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-cell.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-cell.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-cell.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-cell.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-cell.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-table.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-table.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-table.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-table.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-table.png b/chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-table.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-table.png rename to chart-sdk/asp-net-core/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-table.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/default-template-mvc.png b/chart-sdk/asp-net-core/heatmap-chart/images/default-template-mvc.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/default-template-mvc.png rename to chart-sdk/asp-net-core/heatmap-chart/images/default-template-mvc.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/default-template.png b/chart-sdk/asp-net-core/heatmap-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/default-template.png rename to chart-sdk/asp-net-core/heatmap-chart/images/default-template.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-axis-labels-text-style.png b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-axis-labels-text-style.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-axis-labels-text-style.png rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-axis-labels-text-style.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-axis-labels-with-line-breaks.png b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-axis-labels-with-line-breaks.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-axis-labels-with-line-breaks.png rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-axis-labels-with-line-breaks.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-label-intersect-action.png b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-label-intersect-action.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-label-intersect-action.png rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-label-intersect-action.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-multi-level-labels.png b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-multi-level-labels.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-multi-level-labels.png rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-multi-level-labels.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-rotating-labels.png b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-rotating-labels.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-chart-rotating-labels.png rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-chart-rotating-labels.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-axis-labels.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-axis-labels.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-axis-labels.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-axis-labels.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-data.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-data.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-data.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-data.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-datalabel.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-datalabel.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-datalabel.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-datalabel.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-legend.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-legend.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-legend.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-legend.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-palette.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-palette.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-palette.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-palette.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-title.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-title.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-title.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-title.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-tooltip.webp b/chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-tooltip.webp similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/heatmap-with-tooltip.webp rename to chart-sdk/asp-net-core/heatmap-chart/images/heatmap-with-tooltip.webp diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo-core.png b/chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo-core.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo-core.png rename to chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo-core.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo-mvc.png b/chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo-mvc.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo-mvc.png rename to chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo-mvc.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo.png b/chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/nuget-demo.png rename to chart-sdk/asp-net-core/heatmap-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-clear-selection.gif b/chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-clear-selection.gif similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-clear-selection.gif rename to chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-clear-selection.gif diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-selection.gif b/chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-selection.gif similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-selection.gif rename to chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-selection.gif diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-single-cell-selection.gif b/chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-single-cell-selection.gif similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/selection/heatmap-chart-single-cell-selection.gif rename to chart-sdk/asp-net-core/heatmap-chart/images/selection/heatmap-chart-single-cell-selection.gif diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/solution-explorer-core.png b/chart-sdk/asp-net-core/heatmap-chart/images/solution-explorer-core.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/solution-explorer-core.png rename to chart-sdk/asp-net-core/heatmap-chart/images/solution-explorer-core.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/images/solution-explorer-mvc.png b/chart-sdk/asp-net-core/heatmap-chart/images/solution-explorer-mvc.png similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/images/solution-explorer-mvc.png rename to chart-sdk/asp-net-core/heatmap-chart/images/solution-explorer-mvc.png diff --git a/chart-sdk/asp-net-core/heatmap-charts/legend.md b/chart-sdk/asp-net-core/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/legend.md rename to chart-sdk/asp-net-core/heatmap-chart/legend.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/overview.md b/chart-sdk/asp-net-core/heatmap-chart/overview.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/overview.md rename to chart-sdk/asp-net-core/heatmap-chart/overview.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/palette.md b/chart-sdk/asp-net-core/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/palette.md rename to chart-sdk/asp-net-core/heatmap-chart/palette.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/rendering-mode.md b/chart-sdk/asp-net-core/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/rendering-mode.md rename to chart-sdk/asp-net-core/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/selection.md b/chart-sdk/asp-net-core/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/selection.md rename to chart-sdk/asp-net-core/heatmap-chart/selection.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/tooltip.md b/chart-sdk/asp-net-core/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/tooltip.md rename to chart-sdk/asp-net-core/heatmap-chart/tooltip.md diff --git a/chart-sdk/asp-net-core/heatmap-charts/working-with-data.md b/chart-sdk/asp-net-core/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/asp-net-core/heatmap-charts/working-with-data.md rename to chart-sdk/asp-net-core/heatmap-chart/working-with-data.md diff --git a/chart-sdk/asp-net-core/smith-charts/accessibility.md b/chart-sdk/asp-net-core/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/accessibility.md rename to chart-sdk/asp-net-core/smith-chart/accessibility.md diff --git a/chart-sdk/asp-net-core/smith-charts/getting-started.md b/chart-sdk/asp-net-core/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/getting-started.md rename to chart-sdk/asp-net-core/smith-chart/getting-started.md diff --git a/chart-sdk/asp-net-core/smith-charts/images/default-template.png b/chart-sdk/asp-net-core/smith-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/default-template.png rename to chart-sdk/asp-net-core/smith-chart/images/default-template.png diff --git a/chart-sdk/asp-net-core/smith-charts/images/nuget-demo.png b/chart-sdk/asp-net-core/smith-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/nuget-demo.png rename to chart-sdk/asp-net-core/smith-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-control.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-control.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-control.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-control.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-series.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-series.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-series.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-series.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-with-datalabel.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-with-datalabel.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-with-datalabel.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-with-datalabel.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-with-marker.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-with-marker.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-with-marker.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-with-marker.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-with-title.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-with-title.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-with-title.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-with-title.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/smithchart-with-tooltip.webp b/chart-sdk/asp-net-core/smith-chart/images/smithchart-with-tooltip.webp similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/smithchart-with-tooltip.webp rename to chart-sdk/asp-net-core/smith-chart/images/smithchart-with-tooltip.webp diff --git a/chart-sdk/asp-net-core/smith-charts/images/solution-Explorer.png b/chart-sdk/asp-net-core/smith-chart/images/solution-Explorer.png similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/images/solution-Explorer.png rename to chart-sdk/asp-net-core/smith-chart/images/solution-Explorer.png diff --git a/chart-sdk/asp-net-core/smith-charts/overview.md b/chart-sdk/asp-net-core/smith-chart/overview.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/overview.md rename to chart-sdk/asp-net-core/smith-chart/overview.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-axis.md b/chart-sdk/asp-net-core/smith-chart/smithchart-axis.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-axis.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-axis.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-dimensions.md b/chart-sdk/asp-net-core/smith-chart/smithchart-dimensions.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-dimensions.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-dimensions.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-legend.md b/chart-sdk/asp-net-core/smith-chart/smithchart-legend.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-legend.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-legend.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-marker.md b/chart-sdk/asp-net-core/smith-chart/smithchart-marker.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-marker.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-marker.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-print.md b/chart-sdk/asp-net-core/smith-chart/smithchart-print.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-print.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-print.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-series.md b/chart-sdk/asp-net-core/smith-chart/smithchart-series.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-series.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-series.md diff --git a/chart-sdk/asp-net-core/smith-charts/smithchart-tooltip.md b/chart-sdk/asp-net-core/smith-chart/smithchart-tooltip.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/smithchart-tooltip.md rename to chart-sdk/asp-net-core/smith-chart/smithchart-tooltip.md diff --git a/chart-sdk/asp-net-core/smith-charts/title-subtitle.md b/chart-sdk/asp-net-core/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/title-subtitle.md rename to chart-sdk/asp-net-core/smith-chart/title-subtitle.md diff --git a/chart-sdk/asp-net-core/smith-charts/working-with-data.md b/chart-sdk/asp-net-core/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/asp-net-core/smith-charts/working-with-data.md rename to chart-sdk/asp-net-core/smith-chart/working-with-data.md diff --git a/chart-sdk/asp-net-core/sparkline/accessibility.md b/chart-sdk/asp-net-core/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/accessibility.md rename to chart-sdk/asp-net-core/sparkline-charts/accessibility.md diff --git a/chart-sdk/asp-net-core/sparkline/appearance.md b/chart-sdk/asp-net-core/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/appearance.md rename to chart-sdk/asp-net-core/sparkline-charts/appearance.md diff --git a/chart-sdk/asp-net-core/sparkline/appearance.md.bak b/chart-sdk/asp-net-core/sparkline-charts/appearance.md.bak similarity index 100% rename from chart-sdk/asp-net-core/sparkline/appearance.md.bak rename to chart-sdk/asp-net-core/sparkline-charts/appearance.md.bak diff --git a/chart-sdk/asp-net-core/sparkline/axis-customization.md b/chart-sdk/asp-net-core/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/axis-customization.md rename to chart-sdk/asp-net-core/sparkline-charts/axis-customization.md diff --git a/chart-sdk/asp-net-core/sparkline/data-labels.md b/chart-sdk/asp-net-core/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/data-labels.md rename to chart-sdk/asp-net-core/sparkline-charts/data-labels.md diff --git a/chart-sdk/asp-net-core/sparkline/ej1-api-migration.md b/chart-sdk/asp-net-core/sparkline-charts/ej1-api-migration.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/ej1-api-migration.md rename to chart-sdk/asp-net-core/sparkline-charts/ej1-api-migration.md diff --git a/chart-sdk/asp-net-core/sparkline/getting-started.md b/chart-sdk/asp-net-core/sparkline-charts/getting-started.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/getting-started.md rename to chart-sdk/asp-net-core/sparkline-charts/getting-started.md diff --git a/chart-sdk/asp-net-core/sparkline/images/area-sparkline.webp b/chart-sdk/asp-net-core/sparkline-charts/images/area-sparkline.webp similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/area-sparkline.webp rename to chart-sdk/asp-net-core/sparkline-charts/images/area-sparkline.webp diff --git a/chart-sdk/asp-net-core/sparkline/images/default-template.png b/chart-sdk/asp-net-core/sparkline-charts/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/default-template.png rename to chart-sdk/asp-net-core/sparkline-charts/images/default-template.png diff --git a/chart-sdk/asp-net-core/sparkline/images/nuget-demo.png b/chart-sdk/asp-net-core/sparkline-charts/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/nuget-demo.png rename to chart-sdk/asp-net-core/sparkline-charts/images/nuget-demo.png diff --git a/chart-sdk/asp-net-core/sparkline/images/solution-Explorer.png b/chart-sdk/asp-net-core/sparkline-charts/images/solution-Explorer.png similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/solution-Explorer.png rename to chart-sdk/asp-net-core/sparkline-charts/images/solution-Explorer.png diff --git a/chart-sdk/asp-net-core/sparkline/images/sparkline-control.webp b/chart-sdk/asp-net-core/sparkline-charts/images/sparkline-control.webp similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/sparkline-control.webp rename to chart-sdk/asp-net-core/sparkline-charts/images/sparkline-control.webp diff --git a/chart-sdk/asp-net-core/sparkline/images/sparkline-with-tooltip.webp b/chart-sdk/asp-net-core/sparkline-charts/images/sparkline-with-tooltip.webp similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/sparkline-with-tooltip.webp rename to chart-sdk/asp-net-core/sparkline-charts/images/sparkline-with-tooltip.webp diff --git a/chart-sdk/asp-net-core/sparkline/images/sparkline.png b/chart-sdk/asp-net-core/sparkline-charts/images/sparkline.png similarity index 100% rename from chart-sdk/asp-net-core/sparkline/images/sparkline.png rename to chart-sdk/asp-net-core/sparkline-charts/images/sparkline.png diff --git a/chart-sdk/asp-net-core/sparkline/localization.md b/chart-sdk/asp-net-core/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/localization.md rename to chart-sdk/asp-net-core/sparkline-charts/localization.md diff --git a/chart-sdk/asp-net-core/sparkline/marker.md b/chart-sdk/asp-net-core/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/marker.md rename to chart-sdk/asp-net-core/sparkline-charts/marker.md diff --git a/chart-sdk/asp-net-core/sparkline/overview.md b/chart-sdk/asp-net-core/sparkline-charts/overview.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/overview.md rename to chart-sdk/asp-net-core/sparkline-charts/overview.md diff --git a/chart-sdk/asp-net-core/sparkline/range-band.md b/chart-sdk/asp-net-core/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/range-band.md rename to chart-sdk/asp-net-core/sparkline-charts/range-band.md diff --git a/chart-sdk/asp-net-core/sparkline/sparkline-dimensions.md b/chart-sdk/asp-net-core/sparkline-charts/sparkline-dimensions.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/sparkline-dimensions.md rename to chart-sdk/asp-net-core/sparkline-charts/sparkline-dimensions.md diff --git a/chart-sdk/asp-net-core/sparkline/sparkline-types.md b/chart-sdk/asp-net-core/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/sparkline-types.md rename to chart-sdk/asp-net-core/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/asp-net-core/sparkline/special-points-customization.md b/chart-sdk/asp-net-core/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/special-points-customization.md rename to chart-sdk/asp-net-core/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/asp-net-core/sparkline/user-interaction.md b/chart-sdk/asp-net-core/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/asp-net-core/sparkline/user-interaction.md rename to chart-sdk/asp-net-core/sparkline-charts/user-interaction.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/accessibility.md b/chart-sdk/asp-net-mvc/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/accessibility.md rename to chart-sdk/asp-net-mvc/bullet-chart/accessibility.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/axis-customization.md b/chart-sdk/asp-net-mvc/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/axis-customization.md rename to chart-sdk/asp-net-mvc/bullet-chart/axis-customization.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/asp-net-mvc/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/asp-net-mvc/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/comparative-bar.md b/chart-sdk/asp-net-mvc/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/comparative-bar.md rename to chart-sdk/asp-net-mvc/bullet-chart/comparative-bar.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/customization.md b/chart-sdk/asp-net-mvc/bullet-chart/customization.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/customization.md rename to chart-sdk/asp-net-mvc/bullet-chart/customization.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/data-binding.md b/chart-sdk/asp-net-mvc/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/data-binding.md rename to chart-sdk/asp-net-mvc/bullet-chart/data-binding.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/data-label.md b/chart-sdk/asp-net-mvc/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/data-label.md rename to chart-sdk/asp-net-mvc/bullet-chart/data-label.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/getting-started.md b/chart-sdk/asp-net-mvc/bullet-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/getting-started.md rename to chart-sdk/asp-net-mvc/bullet-chart/getting-started.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-actual-bar-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-actual-bar-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-actual-bar-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-actual-bar-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-actual-bar.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-actual-bar.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-actual-bar.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-actual-bar.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-category-label.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-category-label.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-category-label.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-category-label.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-component.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-component.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-component.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-component.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-custom-label-format.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-custom-label-format.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-custom-label-format.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-custom-label-format.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-data-binding.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-data-binding.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-data-binding.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-data-binding.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-data-label.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-data-label.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-data-label.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-data-label.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-dot-actual-bar.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-dot-actual-bar.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-dot-actual-bar.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-dot-actual-bar.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-grouping.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-grouping.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-grouping.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-grouping.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-label-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-label-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-label-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-label-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-label-format.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-label-format.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-label-format.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-label-format.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-labels-position.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-labels-position.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-labels-position.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-labels-position.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-alignment.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-alignment.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-alignment.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-alignment.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-color-mapping.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-color-mapping.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-color-mapping.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-color-mapping.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-on-custom-position.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-on-custom-position.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-on-custom-position.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-on-custom-position.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-on-top-position.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-on-top-position.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-on-top-position.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-on-top-position.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-paging.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-paging.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-paging.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-paging.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-size.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-size.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend-size.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend-size.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-legend.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-legend.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-margin.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-margin.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-margin.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-margin.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-opposed-position.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-opposed-position.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-opposed-position.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-opposed-position.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-orientation.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-orientation.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-orientation.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-orientation.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-range-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-range-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-range-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-range-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-range.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-range.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-range.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-range.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-ranges.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-ranges.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-ranges.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-ranges.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-rectangle-target-bar.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-rectangle-target-bar.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-rectangle-target-bar.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-rectangle-target-bar.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-right-to-left-direction.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-right-to-left-direction.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-right-to-left-direction.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-right-to-left-direction.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-subtitle.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-subtitle.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-subtitle.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-subtitle.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-target-bar-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-target-bar-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-target-bar-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-target-bar-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-target-bar.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-target-bar.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-target-bar.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-target-bar.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-theme.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-theme.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-theme.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-theme.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tick-line-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tick-line-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tick-line-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tick-line-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tick-position.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tick-position.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tick-position.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tick-position.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title-positions.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title-positions.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title-positions.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title-positions.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-title.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-title.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip-customization.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip-customization.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip-customization.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip-customization.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip-template.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip-template.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip-template.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip-template.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-tooltip.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-tooltip.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-with-border.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-with-border.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-with-border.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-with-border.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-with-title.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-with-title.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bullet-chart-with-title.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bullet-chart-with-title.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bulletchart-tooltip.png b/chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bulletchart-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/blazor-bulletchart-tooltip.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/blazor-bulletchart-tooltip.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-control.png b/chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-control.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-control.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-control.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-with-title.png b/chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-with-title.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-with-title.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-with-title.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-with-tooltip.png b/chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-with-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/bullet-chart-with-tooltip.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/bullet-chart-with-tooltip.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/default-template.png b/chart-sdk/asp-net-mvc/bullet-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/default-template.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/default-template.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/nuget-demo.png b/chart-sdk/asp-net-mvc/bullet-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/nuget-demo.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/solution-explorer-core.png b/chart-sdk/asp-net-mvc/bullet-chart/images/solution-explorer-core.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/solution-explorer-core.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/solution-explorer-core.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/target-color.png b/chart-sdk/asp-net-mvc/bullet-chart/images/target-color.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/target-color.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/target-color.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/target-width.png b/chart-sdk/asp-net-mvc/bullet-chart/images/target-width.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/target-width.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/target-width.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/images/value-fill.png b/chart-sdk/asp-net-mvc/bullet-chart/images/value-fill.png similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/images/value-fill.png rename to chart-sdk/asp-net-mvc/bullet-chart/images/value-fill.png diff --git a/chart-sdk/asp-net-mvc/bullet-charts/ranges.md b/chart-sdk/asp-net-mvc/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/ranges.md rename to chart-sdk/asp-net-mvc/bullet-chart/ranges.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/title.md b/chart-sdk/asp-net-mvc/bullet-chart/title.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/title.md rename to chart-sdk/asp-net-mvc/bullet-chart/title.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/tool-tip.md b/chart-sdk/asp-net-mvc/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/tool-tip.md rename to chart-sdk/asp-net-mvc/bullet-chart/tool-tip.md diff --git a/chart-sdk/asp-net-mvc/bullet-charts/value-bar.md b/chart-sdk/asp-net-mvc/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/asp-net-mvc/bullet-charts/value-bar.md rename to chart-sdk/asp-net-mvc/bullet-chart/value-bar.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/accessibility.md b/chart-sdk/asp-net-mvc/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/accessibility.md rename to chart-sdk/asp-net-mvc/heatmap-chart/accessibility.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/appearance.md b/chart-sdk/asp-net-mvc/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/appearance.md rename to chart-sdk/asp-net-mvc/heatmap-chart/appearance.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/axis.md b/chart-sdk/asp-net-mvc/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/axis.md rename to chart-sdk/asp-net-mvc/heatmap-chart/axis.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/bubble-heatmap.md b/chart-sdk/asp-net-mvc/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/bubble-heatmap.md rename to chart-sdk/asp-net-mvc/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/dimensions.md b/chart-sdk/asp-net-mvc/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/dimensions.md rename to chart-sdk/asp-net-mvc/heatmap-chart/dimensions.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/ej1-api-migration.md b/chart-sdk/asp-net-mvc/heatmap-chart/ej1-api-migration.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/ej1-api-migration.md rename to chart-sdk/asp-net-mvc/heatmap-chart/ej1-api-migration.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/events.md b/chart-sdk/asp-net-mvc/heatmap-chart/events.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/events.md rename to chart-sdk/asp-net-mvc/heatmap-chart/events.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/getting-started.md b/chart-sdk/asp-net-mvc/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/getting-started.md rename to chart-sdk/asp-net-mvc/heatmap-chart/getting-started.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/how-to/legend-label-customization.md b/chart-sdk/asp-net-mvc/heatmap-chart/how-to/legend-label-customization.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/how-to/legend-label-customization.md rename to chart-sdk/asp-net-mvc/heatmap-chart/how-to/legend-label-customization.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/asp-net-mvc/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/asp-net-mvc/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-JSON-cell-binding.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-JSON-cell-binding.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-JSON-cell-binding.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-JSON-cell-binding.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-JSON-table-binding.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-JSON-table-binding.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-JSON-table-binding.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-JSON-table-binding.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-array-cell-binding.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-array-cell-binding.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-array-cell-binding.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-array-cell-binding.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-array-table-binding.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-array-table-binding.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/appearance/data-label-template-with-array-table-binding.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/appearance/data-label-template-with-array-table-binding.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-color-type.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-color-type.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-color-type.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-color-type.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-sector-type.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-sector-type.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-sector-type.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-sector-type.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-size-type.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-size-type.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-bubble-size-type.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-bubble-size-type.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-cell.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-cell.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-cell.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-cell.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-cell.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-cell.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-cell.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-cell.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-table.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-table.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-json-table.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-json-table.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-table.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-table.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/bubble-heatmap/heatmap-with-size-color-table.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/bubble-heatmap/heatmap-with-size-color-table.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/default-template-mvc.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/default-template-mvc.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/default-template-mvc.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/default-template-mvc.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/default-template.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/default-template.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/default-template.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-axis-labels-text-style.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-axis-labels-text-style.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-axis-labels-text-style.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-axis-labels-text-style.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-axis-labels-with-line-breaks.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-axis-labels-with-line-breaks.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-axis-labels-with-line-breaks.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-axis-labels-with-line-breaks.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-label-intersect-action.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-label-intersect-action.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-label-intersect-action.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-label-intersect-action.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-multi-level-labels.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-multi-level-labels.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-multi-level-labels.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-multi-level-labels.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-rotating-labels.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-rotating-labels.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-chart-rotating-labels.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-chart-rotating-labels.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-axis-labels.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-axis-labels.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-axis-labels.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-axis-labels.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-data.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-data.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-data.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-data.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-datalabel.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-datalabel.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-datalabel.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-datalabel.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-legend.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-legend.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-legend.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-legend.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-palette.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-palette.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-palette.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-palette.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-title.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-title.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-title.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-title.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-tooltip.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/heatmap-with-tooltip.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/heatmap-with-tooltip.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo-core.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo-core.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo-core.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo-core.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo-mvc.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo-mvc.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo-mvc.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo-mvc.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/nuget-demo.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-clear-selection.gif b/chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-clear-selection.gif similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-clear-selection.gif rename to chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-clear-selection.gif diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-selection.gif b/chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-selection.gif similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-selection.gif rename to chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-selection.gif diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-single-cell-selection.gif b/chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-single-cell-selection.gif similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/selection/heatmap-chart-single-cell-selection.gif rename to chart-sdk/asp-net-mvc/heatmap-chart/images/selection/heatmap-chart-single-cell-selection.gif diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/solution-explorer-core.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/solution-explorer-core.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/solution-explorer-core.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/solution-explorer-core.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/images/solution-explorer-mvc.png b/chart-sdk/asp-net-mvc/heatmap-chart/images/solution-explorer-mvc.png similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/images/solution-explorer-mvc.png rename to chart-sdk/asp-net-mvc/heatmap-chart/images/solution-explorer-mvc.png diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/legend.md b/chart-sdk/asp-net-mvc/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/legend.md rename to chart-sdk/asp-net-mvc/heatmap-chart/legend.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/overview.md b/chart-sdk/asp-net-mvc/heatmap-chart/overview.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/overview.md rename to chart-sdk/asp-net-mvc/heatmap-chart/overview.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/palette.md b/chart-sdk/asp-net-mvc/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/palette.md rename to chart-sdk/asp-net-mvc/heatmap-chart/palette.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/rendering-mode.md b/chart-sdk/asp-net-mvc/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/rendering-mode.md rename to chart-sdk/asp-net-mvc/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/selection.md b/chart-sdk/asp-net-mvc/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/selection.md rename to chart-sdk/asp-net-mvc/heatmap-chart/selection.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/tooltip.md b/chart-sdk/asp-net-mvc/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/tooltip.md rename to chart-sdk/asp-net-mvc/heatmap-chart/tooltip.md diff --git a/chart-sdk/asp-net-mvc/heatmap-charts/working-with-data.md b/chart-sdk/asp-net-mvc/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/asp-net-mvc/heatmap-charts/working-with-data.md rename to chart-sdk/asp-net-mvc/heatmap-chart/working-with-data.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/accessibility.md b/chart-sdk/asp-net-mvc/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/accessibility.md rename to chart-sdk/asp-net-mvc/smith-chart/accessibility.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/getting-started.md b/chart-sdk/asp-net-mvc/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/getting-started.md rename to chart-sdk/asp-net-mvc/smith-chart/getting-started.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/default-template.png b/chart-sdk/asp-net-mvc/smith-chart/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/default-template.png rename to chart-sdk/asp-net-mvc/smith-chart/images/default-template.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/nuget-demo.png b/chart-sdk/asp-net-mvc/smith-chart/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/nuget-demo.png rename to chart-sdk/asp-net-mvc/smith-chart/images/nuget-demo.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-control.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-control.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-control.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-control.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-series.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-series.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-series.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-series.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-datalabel.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-datalabel.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-datalabel.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-datalabel.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-marker.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-marker.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-marker.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-marker.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-title.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-title.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-title.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-title.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-tooltip.png b/chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/smithchart-with-tooltip.png rename to chart-sdk/asp-net-mvc/smith-chart/images/smithchart-with-tooltip.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/images/solution-Explorer.png b/chart-sdk/asp-net-mvc/smith-chart/images/solution-Explorer.png similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/images/solution-Explorer.png rename to chart-sdk/asp-net-mvc/smith-chart/images/solution-Explorer.png diff --git a/chart-sdk/asp-net-mvc/smith-charts/overview.md b/chart-sdk/asp-net-mvc/smith-chart/overview.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/overview.md rename to chart-sdk/asp-net-mvc/smith-chart/overview.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-axis.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-axis.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-axis.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-axis.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-dimensions.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-dimensions.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-dimensions.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-dimensions.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-legend.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-legend.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-legend.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-legend.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-marker.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-marker.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-marker.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-marker.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-print.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-print.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-print.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-print.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-series.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-series.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-series.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-series.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/smithchart-tooltip.md b/chart-sdk/asp-net-mvc/smith-chart/smithchart-tooltip.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/smithchart-tooltip.md rename to chart-sdk/asp-net-mvc/smith-chart/smithchart-tooltip.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/title-subtitle.md b/chart-sdk/asp-net-mvc/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/title-subtitle.md rename to chart-sdk/asp-net-mvc/smith-chart/title-subtitle.md diff --git a/chart-sdk/asp-net-mvc/smith-charts/working-with-data.md b/chart-sdk/asp-net-mvc/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/asp-net-mvc/smith-charts/working-with-data.md rename to chart-sdk/asp-net-mvc/smith-chart/working-with-data.md diff --git a/chart-sdk/asp-net-mvc/sparkline/accessibility.md b/chart-sdk/asp-net-mvc/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/accessibility.md rename to chart-sdk/asp-net-mvc/sparkline-charts/accessibility.md diff --git a/chart-sdk/asp-net-mvc/sparkline/appearance.md b/chart-sdk/asp-net-mvc/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/appearance.md rename to chart-sdk/asp-net-mvc/sparkline-charts/appearance.md diff --git a/chart-sdk/asp-net-mvc/sparkline/appearance.md.bak b/chart-sdk/asp-net-mvc/sparkline-charts/appearance.md.bak similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/appearance.md.bak rename to chart-sdk/asp-net-mvc/sparkline-charts/appearance.md.bak diff --git a/chart-sdk/asp-net-mvc/sparkline/axis-customization.md b/chart-sdk/asp-net-mvc/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/axis-customization.md rename to chart-sdk/asp-net-mvc/sparkline-charts/axis-customization.md diff --git a/chart-sdk/asp-net-mvc/sparkline/data-labels.md b/chart-sdk/asp-net-mvc/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/data-labels.md rename to chart-sdk/asp-net-mvc/sparkline-charts/data-labels.md diff --git a/chart-sdk/asp-net-mvc/sparkline/ej1-api-migration.md b/chart-sdk/asp-net-mvc/sparkline-charts/ej1-api-migration.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/ej1-api-migration.md rename to chart-sdk/asp-net-mvc/sparkline-charts/ej1-api-migration.md diff --git a/chart-sdk/asp-net-mvc/sparkline/getting-started.md b/chart-sdk/asp-net-mvc/sparkline-charts/getting-started.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/getting-started.md rename to chart-sdk/asp-net-mvc/sparkline-charts/getting-started.md diff --git a/chart-sdk/asp-net-mvc/sparkline/images/area-sparkline.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/area-sparkline.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/area-sparkline.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/area-sparkline.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/default-template.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/default-template.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/default-template.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/default-template.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/nuget-demo.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/nuget-demo.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/nuget-demo.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/nuget-demo.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/solution-Explorer.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/solution-Explorer.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/solution-Explorer.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/solution-Explorer.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/sparkline-control.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline-control.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/sparkline-control.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline-control.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/sparkline-with-tooltip.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline-with-tooltip.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/sparkline-with-tooltip.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline-with-tooltip.png diff --git a/chart-sdk/asp-net-mvc/sparkline/images/sparkline.png b/chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline.png similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/images/sparkline.png rename to chart-sdk/asp-net-mvc/sparkline-charts/images/sparkline.png diff --git a/chart-sdk/asp-net-mvc/sparkline/localization.md b/chart-sdk/asp-net-mvc/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/localization.md rename to chart-sdk/asp-net-mvc/sparkline-charts/localization.md diff --git a/chart-sdk/asp-net-mvc/sparkline/marker.md b/chart-sdk/asp-net-mvc/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/marker.md rename to chart-sdk/asp-net-mvc/sparkline-charts/marker.md diff --git a/chart-sdk/asp-net-mvc/sparkline/overview.md b/chart-sdk/asp-net-mvc/sparkline-charts/overview.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/overview.md rename to chart-sdk/asp-net-mvc/sparkline-charts/overview.md diff --git a/chart-sdk/asp-net-mvc/sparkline/range-band.md b/chart-sdk/asp-net-mvc/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/range-band.md rename to chart-sdk/asp-net-mvc/sparkline-charts/range-band.md diff --git a/chart-sdk/asp-net-mvc/sparkline/sparkline-dimensions.md b/chart-sdk/asp-net-mvc/sparkline-charts/sparkline-dimensions.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/sparkline-dimensions.md rename to chart-sdk/asp-net-mvc/sparkline-charts/sparkline-dimensions.md diff --git a/chart-sdk/asp-net-mvc/sparkline/sparkline-types.md b/chart-sdk/asp-net-mvc/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/sparkline-types.md rename to chart-sdk/asp-net-mvc/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/asp-net-mvc/sparkline/special-points-customization.md b/chart-sdk/asp-net-mvc/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/special-points-customization.md rename to chart-sdk/asp-net-mvc/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/asp-net-mvc/sparkline/user-interaction.md b/chart-sdk/asp-net-mvc/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/asp-net-mvc/sparkline/user-interaction.md rename to chart-sdk/asp-net-mvc/sparkline-charts/user-interaction.md diff --git a/chart-sdk/javascript/bullet-charts/accessibility.md b/chart-sdk/javascript/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/accessibility.md rename to chart-sdk/javascript/bullet-chart/accessibility.md diff --git a/chart-sdk/javascript/bullet-charts/axis-customization.md b/chart-sdk/javascript/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/axis-customization.md rename to chart-sdk/javascript/bullet-chart/axis-customization.md diff --git a/chart-sdk/javascript/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/javascript/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/javascript/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/javascript/bullet-charts/comparative-bar.md b/chart-sdk/javascript/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/comparative-bar.md rename to chart-sdk/javascript/bullet-chart/comparative-bar.md diff --git a/chart-sdk/javascript/bullet-charts/customization.md b/chart-sdk/javascript/bullet-chart/customization.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/customization.md rename to chart-sdk/javascript/bullet-chart/customization.md diff --git a/chart-sdk/javascript/bullet-charts/data-binding.md b/chart-sdk/javascript/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/data-binding.md rename to chart-sdk/javascript/bullet-chart/data-binding.md diff --git a/chart-sdk/javascript/bullet-charts/data-label.md b/chart-sdk/javascript/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/data-label.md rename to chart-sdk/javascript/bullet-chart/data-label.md diff --git a/chart-sdk/javascript/bullet-charts/es5-getting-started.md b/chart-sdk/javascript/bullet-chart/es5-getting-started.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/es5-getting-started.md rename to chart-sdk/javascript/bullet-chart/es5-getting-started.md diff --git a/chart-sdk/javascript/bullet-charts/ranges.md b/chart-sdk/javascript/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/ranges.md rename to chart-sdk/javascript/bullet-chart/ranges.md diff --git a/chart-sdk/javascript/bullet-charts/title.md b/chart-sdk/javascript/bullet-chart/title.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/title.md rename to chart-sdk/javascript/bullet-chart/title.md diff --git a/chart-sdk/javascript/bullet-charts/tool-tip.md b/chart-sdk/javascript/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/tool-tip.md rename to chart-sdk/javascript/bullet-chart/tool-tip.md diff --git a/chart-sdk/javascript/bullet-charts/value-bar.md b/chart-sdk/javascript/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/javascript/bullet-charts/value-bar.md rename to chart-sdk/javascript/bullet-chart/value-bar.md diff --git a/chart-sdk/javascript/heatmap-charts/accessibility.md b/chart-sdk/javascript/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/accessibility.md rename to chart-sdk/javascript/heatmap-chart/accessibility.md diff --git a/chart-sdk/javascript/heatmap-charts/appearance.md b/chart-sdk/javascript/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/appearance.md rename to chart-sdk/javascript/heatmap-chart/appearance.md diff --git a/chart-sdk/javascript/heatmap-charts/axis.md b/chart-sdk/javascript/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/axis.md rename to chart-sdk/javascript/heatmap-chart/axis.md diff --git a/chart-sdk/javascript/heatmap-charts/bubble-heatmap.md b/chart-sdk/javascript/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/bubble-heatmap.md rename to chart-sdk/javascript/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/javascript/heatmap-charts/dimensions.md b/chart-sdk/javascript/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/dimensions.md rename to chart-sdk/javascript/heatmap-chart/dimensions.md diff --git a/chart-sdk/javascript/heatmap-charts/ej1-api-migration.md b/chart-sdk/javascript/heatmap-chart/ej1-api-migration.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/ej1-api-migration.md rename to chart-sdk/javascript/heatmap-chart/ej1-api-migration.md diff --git a/chart-sdk/javascript/heatmap-charts/events.md b/chart-sdk/javascript/heatmap-chart/events.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/events.md rename to chart-sdk/javascript/heatmap-chart/events.md diff --git a/chart-sdk/javascript/heatmap-charts/getting-started.md b/chart-sdk/javascript/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/getting-started.md rename to chart-sdk/javascript/heatmap-chart/getting-started.md diff --git a/chart-sdk/javascript/heatmap-charts/how-to/legend-customization.md b/chart-sdk/javascript/heatmap-chart/how-to/legend-customization.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/how-to/legend-customization.md rename to chart-sdk/javascript/heatmap-chart/how-to/legend-customization.md diff --git a/chart-sdk/javascript/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/javascript/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/javascript/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/javascript/heatmap-charts/images/heatmap.png b/chart-sdk/javascript/heatmap-chart/images/heatmap.png similarity index 100% rename from chart-sdk/javascript/heatmap-charts/images/heatmap.png rename to chart-sdk/javascript/heatmap-chart/images/heatmap.png diff --git a/chart-sdk/javascript/heatmap-charts/legend.md b/chart-sdk/javascript/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/legend.md rename to chart-sdk/javascript/heatmap-chart/legend.md diff --git a/chart-sdk/javascript/heatmap-charts/palette.md b/chart-sdk/javascript/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/palette.md rename to chart-sdk/javascript/heatmap-chart/palette.md diff --git a/chart-sdk/javascript/heatmap-charts/rendering-mode.md b/chart-sdk/javascript/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/rendering-mode.md rename to chart-sdk/javascript/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/javascript/heatmap-charts/selection.md b/chart-sdk/javascript/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/selection.md rename to chart-sdk/javascript/heatmap-chart/selection.md diff --git a/chart-sdk/javascript/heatmap-charts/tooltip.md b/chart-sdk/javascript/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/tooltip.md rename to chart-sdk/javascript/heatmap-chart/tooltip.md diff --git a/chart-sdk/javascript/heatmap-charts/working-with-data.md b/chart-sdk/javascript/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/javascript/heatmap-charts/working-with-data.md rename to chart-sdk/javascript/heatmap-chart/working-with-data.md diff --git a/chart-sdk/javascript/smith-charts/accessibility.md b/chart-sdk/javascript/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/javascript/smith-charts/accessibility.md rename to chart-sdk/javascript/smith-chart/accessibility.md diff --git a/chart-sdk/javascript/smith-charts/es5-getting-started.md b/chart-sdk/javascript/smith-chart/es5-getting-started.md similarity index 100% rename from chart-sdk/javascript/smith-charts/es5-getting-started.md rename to chart-sdk/javascript/smith-chart/es5-getting-started.md diff --git a/chart-sdk/javascript/smith-charts/getting-started.md b/chart-sdk/javascript/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/javascript/smith-charts/getting-started.md rename to chart-sdk/javascript/smith-chart/getting-started.md diff --git a/chart-sdk/javascript/smith-charts/images/smithchart.png b/chart-sdk/javascript/smith-chart/images/smithchart.png similarity index 100% rename from chart-sdk/javascript/smith-charts/images/smithchart.png rename to chart-sdk/javascript/smith-chart/images/smithchart.png diff --git a/chart-sdk/javascript/smith-charts/smith-chart-axis.md b/chart-sdk/javascript/smith-chart/smith-chart-axis.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-axis.md rename to chart-sdk/javascript/smith-chart/smith-chart-axis.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-dimensions.md b/chart-sdk/javascript/smith-chart/smith-chart-dimensions.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-dimensions.md rename to chart-sdk/javascript/smith-chart/smith-chart-dimensions.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-legend.md b/chart-sdk/javascript/smith-chart/smith-chart-legend.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-legend.md rename to chart-sdk/javascript/smith-chart/smith-chart-legend.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-marker.md b/chart-sdk/javascript/smith-chart/smith-chart-marker.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-marker.md rename to chart-sdk/javascript/smith-chart/smith-chart-marker.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-print.md b/chart-sdk/javascript/smith-chart/smith-chart-print.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-print.md rename to chart-sdk/javascript/smith-chart/smith-chart-print.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-series.md b/chart-sdk/javascript/smith-chart/smith-chart-series.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-series.md rename to chart-sdk/javascript/smith-chart/smith-chart-series.md diff --git a/chart-sdk/javascript/smith-charts/smith-chart-tooltip.md b/chart-sdk/javascript/smith-chart/smith-chart-tooltip.md similarity index 100% rename from chart-sdk/javascript/smith-charts/smith-chart-tooltip.md rename to chart-sdk/javascript/smith-chart/smith-chart-tooltip.md diff --git a/chart-sdk/javascript/smith-charts/title-subtitle.md b/chart-sdk/javascript/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/javascript/smith-charts/title-subtitle.md rename to chart-sdk/javascript/smith-chart/title-subtitle.md diff --git a/chart-sdk/javascript/smith-charts/working-with-data.md b/chart-sdk/javascript/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/javascript/smith-charts/working-with-data.md rename to chart-sdk/javascript/smith-chart/working-with-data.md diff --git a/chart-sdk/javascript/sparkline/accessibility.md b/chart-sdk/javascript/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/javascript/sparkline/accessibility.md rename to chart-sdk/javascript/sparkline-charts/accessibility.md diff --git a/chart-sdk/javascript/sparkline/appearance.md b/chart-sdk/javascript/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/javascript/sparkline/appearance.md rename to chart-sdk/javascript/sparkline-charts/appearance.md diff --git a/chart-sdk/javascript/sparkline/axis-customization.md b/chart-sdk/javascript/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/javascript/sparkline/axis-customization.md rename to chart-sdk/javascript/sparkline-charts/axis-customization.md diff --git a/chart-sdk/javascript/sparkline/data-labels.md b/chart-sdk/javascript/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/javascript/sparkline/data-labels.md rename to chart-sdk/javascript/sparkline-charts/data-labels.md diff --git a/chart-sdk/javascript/sparkline/ej1-api-migration.md b/chart-sdk/javascript/sparkline-charts/ej1-api-migration.md similarity index 100% rename from chart-sdk/javascript/sparkline/ej1-api-migration.md rename to chart-sdk/javascript/sparkline-charts/ej1-api-migration.md diff --git a/chart-sdk/javascript/sparkline/es5-getting-started.md b/chart-sdk/javascript/sparkline-charts/es5-getting-started.md similarity index 100% rename from chart-sdk/javascript/sparkline/es5-getting-started.md rename to chart-sdk/javascript/sparkline-charts/es5-getting-started.md diff --git a/chart-sdk/javascript/sparkline/images/sparkline.png b/chart-sdk/javascript/sparkline-charts/images/sparkline.png similarity index 100% rename from chart-sdk/javascript/sparkline/images/sparkline.png rename to chart-sdk/javascript/sparkline-charts/images/sparkline.png diff --git a/chart-sdk/javascript/sparkline/localization.md b/chart-sdk/javascript/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/javascript/sparkline/localization.md rename to chart-sdk/javascript/sparkline-charts/localization.md diff --git a/chart-sdk/javascript/sparkline/marker.md b/chart-sdk/javascript/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/javascript/sparkline/marker.md rename to chart-sdk/javascript/sparkline-charts/marker.md diff --git a/chart-sdk/javascript/sparkline/range-band.md b/chart-sdk/javascript/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/javascript/sparkline/range-band.md rename to chart-sdk/javascript/sparkline-charts/range-band.md diff --git a/chart-sdk/javascript/sparkline/sparkline-dimensions.md b/chart-sdk/javascript/sparkline-charts/sparkline-dimensions.md similarity index 100% rename from chart-sdk/javascript/sparkline/sparkline-dimensions.md rename to chart-sdk/javascript/sparkline-charts/sparkline-dimensions.md diff --git a/chart-sdk/javascript/sparkline/sparkline-types.md b/chart-sdk/javascript/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/javascript/sparkline/sparkline-types.md rename to chart-sdk/javascript/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/javascript/sparkline/special-points-customization.md b/chart-sdk/javascript/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/javascript/sparkline/special-points-customization.md rename to chart-sdk/javascript/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/javascript/sparkline/user-interaction.md b/chart-sdk/javascript/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/javascript/sparkline/user-interaction.md rename to chart-sdk/javascript/sparkline-charts/user-interaction.md diff --git a/chart-sdk/maui/Cartesian-Charts/AI-Powered-Data-Processing.md b/chart-sdk/maui/Cartesian-Charts/AI-Powered-Data-Processing.md index 88fd72eec..17cf2a67c 100644 --- a/chart-sdk/maui/Cartesian-Charts/AI-Powered-Data-Processing.md +++ b/chart-sdk/maui/Cartesian-Charts/AI-Powered-Data-Processing.md @@ -1,20 +1,20 @@ --- layout: post -title: AI-Powered Data Cleaning in .NET MAUI Cartesian Chart | Syncfusion -description: Learn here how to create a .NET MAUI Syncfusion® smart Cartesian Chart using Azure OpenAI to assist in data cleaning and preprocessing. +title: AI Data Cleaning in .NET MAUI Cartesian Chart | Syncfusion® +description: AI Powered Data Cleaning and Preprocessing in .NET MAUI Cartesian Chart automates data preparation, handles missing values, and improves data quality. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart AI data cleaning, maui chart data, .net maui chart data preprocessing, syncfusion maui chart AI preprocessing, .net maui chart data visualization, .net maui cartesian chart AI empty point preprocessing support. --- -# AI Powered data cleaning and preprocessing in .NET MAUI Chart. +# AI Data Cleaning and Preprocessing in .NET MAUI Cartesian Chart Raw datasets often contain missing values, outliers, or noise that can distort visualizations and analysis. This is common in web traffic data, which may have gaps or spikes. Before visualizing such data, it’s essential to clean it. -This guide shows how to use Azure OpenAI to clean and preprocessing e-commerce website traffic data, then visualize the results using [Syncfusion .NET MAUI Cartesian Chart](https://help.syncfusion.com/maui/cartesian-charts/getting-started). +This guide shows how to use Azure OpenAI to clean and preprocessing e-commerce website traffic data, then visualize the results using [Syncfusion .NET MAUI Cartesian Chart](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Integrating Azure OpenAI for cleaning and preprocessing the data diff --git a/chart-sdk/maui/Cartesian-Charts/AI-Powered-Stock-forecasting-in-Candle-Chart.md b/chart-sdk/maui/Cartesian-Charts/AI-Powered-Stock-forecasting-in-Candle-Chart.md index 67444c78b..3c5a25a61 100644 --- a/chart-sdk/maui/Cartesian-Charts/AI-Powered-Stock-forecasting-in-Candle-Chart.md +++ b/chart-sdk/maui/Cartesian-Charts/AI-Powered-Stock-forecasting-in-Candle-Chart.md @@ -1,7 +1,7 @@ --- layout: post -title: AI powered stock forecasting in .NET MAUI Cartesian Chart | Syncfusion -description: Learn here how to implement AI-powered smart stock data forecasting using .NET MAUI Syncfusion® Cartesian Chart Candle series. +title: AI Stock Forecasting in .NET MAUI Cartesian Chart | Syncfusion® +description: AI Powered Stock Forecasting in .NET MAUI Cartesian Chart predicts market trends using AI-driven analysis, helping visualize forecasted stock performance. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -10,9 +10,9 @@ keywords: .net maui chart AI forecasting, maui chart stock, .net maui chart data # AI Powered Stock Forecasting in .NET MAUI Cartesian Chart -This guide demonstrates how to build an AI-powered [.NET MAUI Cartesian Chart Candle series](https://help.syncfusion.com/maui/cartesian-charts/candle) that forecasts stock prices for the next 45 days, helping traders make informed decisions using Syncfusion controls and Azure OpenAI. +This guide demonstrates how to build an AI-powered [.NET MAUI Cartesian Chart Candle series](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/candle) that forecasts stock prices for the next 45 days, helping traders make informed decisions using Syncfusion controls and Azure OpenAI. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Integrating Azure OpenAI for Stock Forecasting @@ -123,7 +123,7 @@ public Task> GetAnswerFromGPT(string userPrompt, ### 3. Implement the Syncfusion .NET MAUI Cartesian Chart to display forecasted data. -The [Syncfusion .NET MAUI Cartesian Chart Candle series](https://help.syncfusion.com/maui/cartesian-charts/candle) allows you to display financial data. Define the data Model that holds the financial data (High, Low, Open, Close) and ViewModel that holds the collection of data for binding. +The [Syncfusion .NET MAUI Cartesian Chart Candle series](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/candle) allows you to display financial data. Define the data Model that holds the financial data (High, Low, Open, Close) and ViewModel that holds the collection of data for binding. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Add-custom-labels.md b/chart-sdk/maui/Cartesian-Charts/Add-custom-labels.md index cd469036c..4e81f1f17 100644 --- a/chart-sdk/maui/Cartesian-Charts/Add-custom-labels.md +++ b/chart-sdk/maui/Cartesian-Charts/Add-custom-labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Add custom labels to the Cartesian chart axis | Syncfusion -description: Learn here all about how to add custom labels to the chart axis in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: How to Add Axis Labels in .NET MAUI Cartesian Chart | Syncfusion® +description: Add custom axis labels in Syncfusion® .NET MAUI Cartesian Chart control to display personalized axis text and improve chart readability and presentation. platform: chart-sdk control: SfCartesianChart documentation: ug Keywords: .net maui chart custom axis labels, .net maui chart axis label customization, sfCartesianchart custom axis labels in .net maui, .net maui chart axis label customization. --- -# Add custom labels to the chart axis in .NET MAUI Cartesian Chart +# How to Add Custom Axis Labels in .NET MAUI Cartesian Chart [ChartAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html) provides the [OnCreateLabels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_OnCreateLabels) override method, called whenever new labels are generated (e.g., during layout, data update, zoom, or pan). The following properties are available when adding custom labels. @@ -18,7 +18,7 @@ Keywords: .net maui chart custom axis labels, .net maui chart axis label customi * [VisibleMinimum](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_VisibleMinimum) - Gets the `double` value representing the minimum value of the visible axis range. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Annotation.md b/chart-sdk/maui/Cartesian-Charts/Annotation.md index 259c18008..abba6808d 100644 --- a/chart-sdk/maui/Cartesian-Charts/Annotation.md +++ b/chart-sdk/maui/Cartesian-Charts/Annotation.md @@ -1,7 +1,7 @@ --- layout: post -title: Annotations in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about annotation support and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Annotations in .NET MAUI Cartesian Chart | Syncfusion® +description: Annotations in .NET MAUI Cartesian Chart allow custom content to be displayed within the chart area, highlighting key data points and insights. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ keywords: .net maui cartesian chart annotations, .net maui annotations customiza * Shape annotation * View annotation -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. To learn how to add and customize annotations in .NET MAUI Cartesian Charts quickly, you can check the below video. diff --git a/chart-sdk/maui/Cartesian-Charts/Appearance.md b/chart-sdk/maui/Cartesian-Charts/Appearance.md index 1614bd19e..651ef1151 100644 --- a/chart-sdk/maui/Cartesian-Charts/Appearance.md +++ b/chart-sdk/maui/Cartesian-Charts/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about appearance customization in .NET MAUI Cartesian Chart (SfCartesianChart), its elements and more. +title: Appearance in .NET MAUI Cartesian Chart | Syncfusion® +description: Appearance in .NET MAUI Cartesian Chart allows customization of chart visuals using colors, palettes and styling options. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -11,7 +11,7 @@ keywords: .net maui cartesian chart appearance, .net maui chart appearance custo # Appearance in .NET MAUI Cartesian Chart The appearance of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) can be customized by using the predefined brushes, custom brushes and gradient, which allows to enrich the application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Add a title diff --git a/chart-sdk/maui/Cartesian-Charts/Area.md b/chart-sdk/maui/Cartesian-Charts/Area.md index 707baaabf..776537e26 100644 --- a/chart-sdk/maui/Cartesian-Charts/Area.md +++ b/chart-sdk/maui/Cartesian-Charts/Area.md @@ -1,7 +1,7 @@ --- layout: post -title: Area Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the area chart types and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Area Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Area Chart in .NET MAUI Cartesian Chart visualizes data trends by filling the area beneath a line series, making comparisons and patterns easier to identify. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The area chart is rendered by using a collection of line segments connected to f N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/AutoScrollingDelta.md b/chart-sdk/maui/Cartesian-Charts/Axis/AutoScrollingDelta.md index 20f8ee1a1..c094c1682 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/AutoScrollingDelta.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/AutoScrollingDelta.md @@ -1,20 +1,20 @@ --- layout: post -title: Auto scrolling in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about auto scrolling and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Auto Scrolling in .NET MAUI Cartesian Chart | Syncfusion® +description: Auto Scrolling in .NET MAUI Cartesian Chart displays the latest data points while maintaining a fixed range for continuous data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart auto scrolling, .net maui chart scrolling customization, .net maui chart auto scroll feature, syncfusion maui chart auto scrolling, cartesian chart auto scroll maui, .net maui chart dynamic scrolling, enable auto scrolling .net maui chart. --- -# Auto scrolling in .NET MAUI Cartesian Chart +# Auto Scrolling in .NET MAUI Cartesian Chart Auto-scrolling in .NET MAUI Cartesian Chart ensures that a specified range of data is always visible, making it ideal for real-time data feeds and streaming dashboards. The [AutoScrollingDelta](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_AutoScrollingDelta) property of the chart axis sets the number of data points to be always visible. As new data points are added, the visible range scrolls to keep them in view, and you can use the [AutoScrollingMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_AutoScrollingMode) property to control the scroll direction. By adding [ChartZoomPanBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartZoomPanBehavior.html) to the chart, you can manually scroll to view previous data points. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Axislabels.md b/chart-sdk/maui/Cartesian-Charts/Axis/Axislabels.md index fc5a2df75..459baffc2 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Axislabels.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Axislabels.md @@ -1,18 +1,18 @@ --- layout: post -title: Axis labels in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about axis labels and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Axis Labels in .NET MAUI Cartesian Chart | Syncfusion® +description: Axis Labels in .NET MAUI Cartesian Chart display category and value information along chart axes, improving readability and data interpretation. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart axis labels, axis labels customization .net maui, syncfusion maui chart axis labels, cartesian chart axis labels maui, customize axis labels .net maui chart, .net maui chart labels per 100 pixels. --- -# Axis labels in .NET MAUI Cartesian Chart +# Axis Labels in .NET MAUI Cartesian Chart Axis labels display the units, measures, or category values of an axis to help users understand the data. They are generated based on the range and the values bound to [XBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartSeries.html#Syncfusion_Maui_Charts_ChartSeries_XBindingPath) or [YBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.XYDataSeries.html#Syncfusion_Maui_Charts_XYDataSeries_YBindingPath) properties of the series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Positioning the labels diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Axisline.md b/chart-sdk/maui/Cartesian-Charts/Axis/Axisline.md index c7134741f..9ed1367f5 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Axisline.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Axisline.md @@ -1,18 +1,18 @@ --- layout: post -title: Axis line in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the chart axis line and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Axis Line in .NET MAUI Cartesian Chart | Syncfusion +description: Axis Line in .NET MAUI Cartesian Chart defines the visual representation of chart axes, helping organize data and improve chart readability. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart axis line, .net maui chart axis customization, .net maui chart axisline guide, maui chart axis line settings, syncfusion maui chart axis line, .net maui chart axis styling, customize axis line .net maui chart. --- -# Axis line in .NET MAUI Cartesian Chart +# Axis Line in .NET MAUI Cartesian Chart The axis line in .NET MAUI Cartesian Chart visually represents the axis itself in the chart area. You can customize its appearance, including stroke color, width, and dash patterns, using the [AxisLineStyle](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_AxisLineStyle) property. Additionally, you can control the spacing between the axis and the chart area using the [AxisLineOffset](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_AxisLineOffset) property. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Cartesian Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Customizing axis line style diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Gridlines.md b/chart-sdk/maui/Cartesian-Charts/Axis/Gridlines.md index eaf27c2ad..cbd80c84c 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Gridlines.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Gridlines.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis grid lines in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the chart axis grid lines and its customization in syncfusion® .NET MAUI Cartesian Chart(SfCartesianChart). +title: Grid Lines in .NET MAUI Cartesian Chart | Syncfusion® +description: Grid Lines in .NET MAUI Cartesian Chart provide visual references across the plot area, helping improve data readability and value comparison. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui cartesian chart grid lines, .net maui cartesian chart grid c By default, major gridlines are automatically added to the [ChartAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html) in its defined intervals. The visibility of the major gridlines can be controlled using the [ShowMajorGridLines](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_ShowMajorGridLines) property. The default value of [ShowMajorGridLines](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_ShowMajorGridLines) is `true`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/MultiLevelLabels.md b/chart-sdk/maui/Cartesian-Charts/Axis/MultiLevelLabels.md index cbcc2b4e9..535713735 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/MultiLevelLabels.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/MultiLevelLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Multi-Level Labels in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about multi-level labels and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control and more. +title: Multi-Level Labels in .NET MAUI Cartesian Chart | Syncfusion® +description: Multi-Level Labels in .NET MAUI Cartesian Chart organize axis labels into hierarchical levels, improving readability and displaying grouped data effectively. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -10,7 +10,7 @@ keywords: .net maui cartesian charts, .net maui multi-level labels, cartesian ch # Multi-Level Labels in .NET MAUI Cartesian Chart -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. Multi-level labels allow you to display multiple hierarchy levels of labels on the chart axes. This feature is particularly useful for categorizing data at different levels of detail, providing better organization and readability of large datasets. Multi-level labels can be applied to any [ChartAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html) in the Cartesian chart. diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Overview.md b/chart-sdk/maui/Cartesian-Charts/Axis/Overview.md index fffd31f04..f1d92d13f 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Overview.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Overview.md @@ -1,7 +1,7 @@ --- layout: post -title: About Axis in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about chart axis and its keys features of Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Axis in .NET MAUI Cartesian Chart | Syncfusion® +description: Axis in .NET MAUI Cartesian Chart defines the chart coordinate system with customizable labels, lines, ticks, and titles for data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Padding.md b/chart-sdk/maui/Cartesian-Charts/Axis/Padding.md index 1fa17ef02..77d947454 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Padding.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Padding.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis padding in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about how to set padding for chart axis in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Axis Padding in .NET MAUI Cartesian Chart | Syncfusion® +description: Axis Padding in .NET MAUI Cartesian Chart controls the space around axis ranges, improving data visibility and preventing points from rendering at chart edges. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui cartesian chart axis padding, .net maui cartesian chart axis The [PlotOffsetStart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_PlotOffsetStart) property, of type `double` and measured in pixels (px), is used to provide padding to the axis at the start position. The default value is `0`. The following code sample demonstrates the padding applied to the start position for both the X and Y axes. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Range-padding.md b/chart-sdk/maui/Cartesian-Charts/Axis/Range-padding.md index fd647addf..943707e9d 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Range-padding.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Range-padding.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis range padding in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about axis range padding and its types features of Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Axis Range Padding in .NET MAUI Cartesian Chart | Syncfusion® +description: Axis Range Padding in .NET MAUI Cartesian Chart adjusts axis boundaries to improve data presentation and prevent points from appearing at chart edges. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui cartesian chart axis range padding, .net maui cartesian char Range padding is used to set the minimum and maximum extremes of the chart axis range by using the [RangePadding](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.NumericalAxis.html#Syncfusion_Maui_Charts_NumericalAxis_RangePadding) property. The [RangePadding](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAxisBase.html#Syncfusion_Maui_Charts_RangeAxisBase_RangePadding) property, available on axes derived from [RangeAxisBase](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAxisBase.html) such as [NumericalAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.NumericalAxis.html), [DateTimeAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DateTimeAxis.html), and [LogarithmicAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.LogarithmicAxis.html), can be used to add padding to the range of the chart axis. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Numerical Range Padding diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Ticklines.md b/chart-sdk/maui/Cartesian-Charts/Axis/Ticklines.md index 2a7a73bb2..ad717a8b2 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Ticklines.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Ticklines.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis tick lines in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about chart axis tick line and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Tick Lines in .NET MAUI Cartesian Chart | Syncfusion® +description: Tick Lines in .NET MAUI Cartesian Chart indicate axis intervals, helping users interpret scale values accurately and improve chart readability. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ Tick lines are the small lines which are drawn on the axis line representing the Minor tick lines can also be added to the axis by defining the [MinorTicksPerInterval](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAxisBase.html#Syncfusion_Maui_Charts_RangeAxisBase_MinorTicksPerInterval) property, of type `int` with a default value of `0`. This property is available on axes derived from [RangeAxisBase](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAxisBase.html) and will add the minor tick lines to every interval based on the value. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> For the category axis, minor tick lines are not applicable because it is rendered based on index positions. diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Title.md b/chart-sdk/maui/Cartesian-Charts/Axis/Title.md index b0b27c8d4..573429466 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Title.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Title.md @@ -1,7 +1,7 @@ --- layout: post -title: Title for axis in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains the chart axis title, title style, and its customization in .NET MAUI Cartesian Chart (SfCartesianChart). +title: Axis Title in .NET MAUI Cartesian Chart | Syncfusion® +description: Axis Title in .NET MAUI Cartesian Chart provides descriptive text for chart axes, helping clarify data context and improve chart understanding. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui cartesian charts, .net maui axis title, cartesian chart axis The [Title](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_Title) property is used to set the title for the chart axis. The axis does not display a title by default. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Axis/Types.md b/chart-sdk/maui/Cartesian-Charts/Axis/Types.md index 6b2dc5867..ca84d67b5 100644 --- a/chart-sdk/maui/Cartesian-Charts/Axis/Types.md +++ b/chart-sdk/maui/Cartesian-Charts/Axis/Types.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis types in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about axis types and their features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control and more. +title: Types of Axis in .NET MAUI Cartesian Chart | Syncfusion® +description: Types of Axis in .NET MAUI Cartesian Chart support category, numerical, logarithmic, and date-time data for flexible data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -18,7 +18,7 @@ Cartesian chart supports the following types of chart axis: * [DateTimeCategoryAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DateTimeCategoryAxis.html) * [LogarithmicAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.LogarithmicAxis.html) -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Numerical Axis diff --git a/chart-sdk/maui/Cartesian-Charts/BarChart.md b/chart-sdk/maui/Cartesian-Charts/BarChart.md index d7dcf4595..993783476 100644 --- a/chart-sdk/maui/Cartesian-Charts/BarChart.md +++ b/chart-sdk/maui/Cartesian-Charts/BarChart.md @@ -1,7 +1,7 @@ --- layout: post -title: Bar Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about bar chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Bar Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Bar Chart in .NET MAUI Cartesian Chart displays data using horizontal bars, making it easy to compare values across different categories. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -10,13 +10,13 @@ keywords: .net maui bar chart, maui bar chart, .net maui chart bar type, bar cha # Bar Chart in .NET MAUI Cartesian Chart -A bar chart uses bars to represent data points and compare values across different categories. To render a bar chart, initialize the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) and set the [IsTransposed](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_IsTransposedProperty) property to `true` to switch the chart's X and Y axes. Then, create a [ColumnSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ColumnSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). For more information on column chart setup, see the [Column Chart](https://help.syncfusion.com/maui/cartesian-charts/column) documentation. +A bar chart uses bars to represent data points and compare values across different categories. To render a bar chart, initialize the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) and set the [IsTransposed](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_IsTransposedProperty) property to `true` to switch the chart's X and Y axes. Then, create a [ColumnSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ColumnSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). For more information on column chart setup, see the [Column Chart](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/column) documentation. N> By default, the [IsTransposed](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_IsTransposedProperty) property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) is `false`. N> The Cartesian chart has `Series` as its default content. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/BoxAndWhisker.md b/chart-sdk/maui/Cartesian-Charts/BoxAndWhisker.md index e8f84d877..ecf12108a 100644 --- a/chart-sdk/maui/Cartesian-Charts/BoxAndWhisker.md +++ b/chart-sdk/maui/Cartesian-Charts/BoxAndWhisker.md @@ -1,7 +1,7 @@ --- layout: post -title: Box and whisker Chart in .NET MAUI Cartesian Chart control |Syncfusion -description: Learn here all about box and whisker chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Box and Whisker Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Box and Whisker Chart in .NET MAUI Cartesian Chart visualizes data distribution, quartiles, median, and outliers for effective statistical analysis. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui box and whisker chart, maui box and whisker chart, box and w A box plot chart is used to show the distribution of data within a population. To render a box plot chart, create an instance of [BoxAndWhiskerSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.BoxAndWhiskerSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. Box plots are great for comparing the distribution of multiple datasets side by side. By comparing the median, quartiles, and range of the boxes, you can quickly identify differences in the center, spread, and skewness of the distributions. The following code illustrates how to define the series in chart. diff --git a/chart-sdk/maui/Cartesian-Charts/Bubble.md b/chart-sdk/maui/Cartesian-Charts/Bubble.md index 3fc502e23..4e5e553f5 100644 --- a/chart-sdk/maui/Cartesian-Charts/Bubble.md +++ b/chart-sdk/maui/Cartesian-Charts/Bubble.md @@ -1,7 +1,7 @@ --- layout: post -title: Bubble chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the bubble chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Bubble Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Bubble Chart in .NET MAUI Cartesian Chart visualizes data using bubbles of varying sizes, enabling comparison of three dimensions within a single chart. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,11 +12,11 @@ keywords: .net maui bubble chart, maui bubble chart, bubble chart customization ## Bubble Chart -The bubble chart is represented by closely packed circles, whose areas are proportional to the data values they represent. The bubble chart is similar to a [scatter plot](https://help.syncfusion.com/maui/cartesian-charts/scatter), but with the additional dimension of bubble size to represent a third variable. +The bubble chart is represented by closely packed circles, whose areas are proportional to the data values they represent. The bubble chart is similar to a [scatter plot](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/scatter), but with the additional dimension of bubble size to represent a third variable. To render a bubble chart, create an instance of [BubbleSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.BubbleSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). The data model must include `XValue`, `YValue`, and `Size` properties; the bubble size is proportional to the value bound via the [SizeValuePath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.BubbleSeries.html#Syncfusion_Maui_Charts_BubbleSeries_SizeValuePath) property. You can constrain the bubble size using the [MinimumRadius](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.BubbleSeries.html#Syncfusion_Maui_Charts_BubbleSeries_MinimumRadius) (default `3`) and [MaximumRadius](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.BubbleSeries.html#Syncfusion_Maui_Charts_BubbleSeries_MaximumRadius) (default `10`) properties. The following code shows how to configure these properties. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Candle.md b/chart-sdk/maui/Cartesian-Charts/Candle.md index 699622a7c..2f1b5a489 100644 --- a/chart-sdk/maui/Cartesian-Charts/Candle.md +++ b/chart-sdk/maui/Cartesian-Charts/Candle.md @@ -1,7 +1,7 @@ --- layout: post -title: Candle Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the candle chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Candle Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Candle Chart in .NET MAUI Cartesian Chart visualizes open, high, low, and close values, making it ideal for financial and stock market analysis. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui candle chart, candle chart customization .net maui, syncfusi Candle charts are a type of financial chart used to represent the price movement of an asset over time. The chart is made up of a series of rectangular bars, called candlesticks, that represent a specific time, typically one day. To render a candle chart, create an instance of [CandleSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.CandleSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Column.md b/chart-sdk/maui/Cartesian-Charts/Column.md index f1ef636ce..94160af1b 100644 --- a/chart-sdk/maui/Cartesian-Charts/Column.md +++ b/chart-sdk/maui/Cartesian-Charts/Column.md @@ -1,7 +1,7 @@ --- layout: post -title: Column Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the column chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Column Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Column Chart in .NET MAUI Cartesian Chart displays data using vertical columns, making it easy to compare values across different categories and groups. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui column chart, column chart customization .net maui, syncfusi A column chart is used to plot discrete rectangles for the given data point values. To render a column chart, create an instance of [ColumnSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ColumnSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Crosshair.md b/chart-sdk/maui/Cartesian-Charts/Crosshair.md index 220287456..0ef2ae324 100644 --- a/chart-sdk/maui/Cartesian-Charts/Crosshair.md +++ b/chart-sdk/maui/Cartesian-Charts/Crosshair.md @@ -1,7 +1,7 @@ --- layout: post -title: Crosshair in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains how to enable the crosshair and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Crosshair in .NET MAUI Cartesian Chart | Syncfusion® +description: Crosshair in .NET MAUI Cartesian Chart displays intersecting lines and data values at specific points, enabling precise data analysis and comparison. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ Crosshair allows you to view exact values on the chart by showing vertical and h To enable the crosshair in the chart, create an instance of the [ChartCrosshairBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartCrosshairBehavior.html) and set it to the [CrosshairBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_CrosshairBehavior) property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Customize-each-chart-axis-label.md b/chart-sdk/maui/Cartesian-Charts/Customize-each-chart-axis-label.md index 51b646eaa..ace2e46c4 100644 --- a/chart-sdk/maui/Cartesian-Charts/Customize-each-chart-axis-label.md +++ b/chart-sdk/maui/Cartesian-Charts/Customize-each-chart-axis-label.md @@ -1,18 +1,18 @@ --- layout: post -title: Customize each chart axis label using the callback event | Syncfusion -description: Learn how to customize each chart axis label using the callback event in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: How to Use Callback Event for Axis Labels in MAUI Chart | Syncfusion® +description: Customize each chart axis label using the callback event in Syncfusion® .NET MAUI Cartesian Chart control to display formatted labels and improve readability. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart customize axis label callback, .net maui chart axis label callback event, sfcartesianchart axis label callback customization in .net maui, sfcartesianchart custom axis label event handling in .net maui. --- -# Customize each chart axis label using the callback event +# How to Use Callback Event for Axis Labels in MAUI Chart The [LabelCreated](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_LabelCreated) event is triggered upon label creation in a chart axis, providing the option to customize chart axis labels. The event handler receives a [ChartAxisLabelEventArgs](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxisLabelEventArgs.html) object, which exposes the [Label](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxisLabelEventArgs.html#Syncfusion_Maui_Charts_ChartAxisLabelEventArgs_Label) property that can be modified to change the displayed label text. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> This example uses a [DateTimeAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DateTimeAxis.html), which is required for the label parsing logic to work correctly. diff --git a/chart-sdk/maui/Cartesian-Charts/DataLabels.md b/chart-sdk/maui/Cartesian-Charts/DataLabels.md index 52e68b37d..28ff6ae4e 100644 --- a/chart-sdk/maui/Cartesian-Charts/DataLabels.md +++ b/chart-sdk/maui/Cartesian-Charts/DataLabels.md @@ -1,14 +1,14 @@ --- layout: post -title: Data labels in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains how to configure the data labels and their features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart). +title: Data Labels in .NET MAUI Cartesian Chart | Syncfusion® +description: Data Labels in .NET MAUI Cartesian Chart display values directly on data points, improving readability and helping interpret chart data effectively. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart data label, maui chart data label, .net maui data label customization, syncfusion maui chart data label, cartesian data label maui, .net maui chart data label visualization, .net maui chart value label. --- -# Data labels in .NET MAUI Cartesian Chart +# Data Labels in .NET MAUI Cartesian Chart Data labels are used to display values related to a chart segment. Values from data point(x, y) or other custom properties from a data source can be displayed. @@ -24,7 +24,7 @@ To learn how to customize the data labels in .NET MAUI Cartesian Charts quickly, The [ShowDataLabels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartSeries.html#Syncfusion_Maui_Charts_ChartSeries_ShowDataLabels) property of the series is used to enable the data labels. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/EmptyPoints.md b/chart-sdk/maui/Cartesian-Charts/EmptyPoints.md index 6f30f5987..fb15a825d 100644 --- a/chart-sdk/maui/Cartesian-Charts/EmptyPoints.md +++ b/chart-sdk/maui/Cartesian-Charts/EmptyPoints.md @@ -1,20 +1,20 @@ --- layout: post -title: Empty points in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about empty points support and their features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Empty Points in .NET MAUI Cartesian Chart | Syncfusion® +description: Empty Points in .NET MAUI Cartesian Chart handle missing or null values using configurable modes, ensuring clear and meaningful data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart empty points, .net maui empty points customization, syncfusion maui chart empty points, maui chart empty points, .net maui chart empty points visualization, cartesian empty points maui, missing data handling --- -# Empty points in .NET MAUI Cartesian Chart +# Empty Points in .NET MAUI Cartesian Chart Empty points are used to indicate missing or null data in a series. These empty points can occur when data is unavailable, improperly formatted, or explicitly set as null or `double.NaN`. The chart provides options to handle and customize these empty points to enhance visualization and maintain the integrity of data representation. [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) provides support for empty points, allowing users to handle missing data effectively. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. The data collection that is passed to the chart can have `NaN` or null values that are considered as empty points. The empty points can be defined as in the following code example. diff --git a/chart-sdk/maui/Cartesian-Charts/Errorbar-Chart.md b/chart-sdk/maui/Cartesian-Charts/Errorbar-Chart.md index 58ae58854..e02284039 100644 --- a/chart-sdk/maui/Cartesian-Charts/Errorbar-Chart.md +++ b/chart-sdk/maui/Cartesian-Charts/Errorbar-Chart.md @@ -1,7 +1,7 @@ --- layout: post -title: Error Bar Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about error bar chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Error Bar in .NET MAUI Cartesian Chart | Syncfusion® +description: Error Bar in .NET MAUI Cartesian Chart displays data variability and uncertainty, helping visualize statistical deviations and measurement accuracy. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ keywords: .net maui error bar chart, error bar chart customization .net maui, sy N> The Error Bar is not an individual chart; it associates with a main chart. Here, we use `Scatter Series Chart` as the main chart with the Error Bar Series chart support. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. The following code examples illustrate how to create an error bar series: diff --git a/chart-sdk/maui/Cartesian-Charts/Exporting.md b/chart-sdk/maui/Cartesian-Charts/Exporting.md index 0237d472e..450827c04 100644 --- a/chart-sdk/maui/Cartesian-Charts/Exporting.md +++ b/chart-sdk/maui/Cartesian-Charts/Exporting.md @@ -1,7 +1,7 @@ --- layout: post -title: Exporting in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here how to export the chart view as an image and stream in the Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Exporting in .NET MAUI Cartesian Chart | Syncfusion® +description: Exporting in .NET MAUI Cartesian Chart enables charts to be saved as image files for sharing, reporting, and presentation purposes. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui chart exporting, maui chart exporting, .net maui chart expor You can export the chart view as an image in the desired file format using the [SaveAsImage](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_SaveAsImage_System_String_) method of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). The supported image formats are **JPEG and PNG**. By default, if you don't mention any image format with the filename, the chart view will be exported as an image in the PNG format. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The chart view can be exported as an image only when the chart view is added to the visual tree. diff --git a/chart-sdk/maui/Cartesian-Charts/FastScatter.md b/chart-sdk/maui/Cartesian-Charts/FastScatter.md index 5086f0478..aff1bef38 100644 --- a/chart-sdk/maui/Cartesian-Charts/FastScatter.md +++ b/chart-sdk/maui/Cartesian-Charts/FastScatter.md @@ -1,7 +1,7 @@ --- layout: post -title: Fast Scatter Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the fast scatter chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Fast Scatter Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Fast Scatter Chart in .NET MAUI Cartesian Chart renders large data sets efficiently, enabling high-performance visualization for scatter plot analysis. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui fast scatter chart, .net maui performance scatter chart, fas The [FastScatterSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastScatterSeries.html) is a specialized scatter series designed to efficiently render a large number of data points. It is optimized for performance when compared to the regular scatter series, making it suitable for large datasets. To render a fast scatter chart, create an instance of [FastScatterSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastScatterSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Fastline.md b/chart-sdk/maui/Cartesian-Charts/Fastline.md index c234c781a..b94588d9b 100644 --- a/chart-sdk/maui/Cartesian-Charts/Fastline.md +++ b/chart-sdk/maui/Cartesian-Charts/Fastline.md @@ -1,7 +1,7 @@ --- layout: post -title: Fast Line Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the fast line chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Fast Line Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Fast Line Chart in .NET MAUI Cartesian Chart renders large data sets efficiently, delivering high-performance visualization for real-time and continuous data. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,9 +12,9 @@ keywords: .net maui fast line chart, .net maui performance line chart, fast line ## Fast Line Chart -The [FastLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastLineSeries.html) is a special kind of line series that can render a collection with a large number of data points. It is optimized for performance when compared to the regular [LineSeries](https://help.syncfusion.com/maui/cartesian-charts/line), making it suitable for large datasets. To render a fast line chart, create an instance of [FastLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastLineSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). +The [FastLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastLineSeries.html) is a special kind of line series that can render a collection with a large number of data points. It is optimized for performance when compared to the regular [LineSeries](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/line), making it suitable for large datasets. To render a fast line chart, create an instance of [FastLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.FastLineSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Get-the-data-point-collection-based-on-region.md b/chart-sdk/maui/Cartesian-Charts/Get-the-data-point-collection-based-on-region.md index 29c832540..9ff95eb3c 100644 --- a/chart-sdk/maui/Cartesian-Charts/Get-the-data-point-collection-based-on-region.md +++ b/chart-sdk/maui/Cartesian-Charts/Get-the-data-point-collection-based-on-region.md @@ -1,21 +1,21 @@ --- layout: post -title: Get the data point collection based on region in .NET MAUI Cartesian Chart | Syncfusion -description: Get the data points that fall inside a given rectangular area or within specified X and Y coordinate ranges in SfCartesianChart. +title: How to Get Region Data Points in .NET MAUI Chart | Syncfusion® +description: Get region data points in Syncfusion® .NET MAUI Cartesian Chart control to identify and access chart data points within a specific region. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart data point collection, get data points by region, sfCartesianChart get data points rectangle, .net maui chart point collection by axis range --- -# Get the data point collection based on region +# How to Get Region Data Points in .NET MAUI Cartesian Chart [CartesianSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.CartesianSeries.html) provides the following methods to get a collection of data under a particular region. * [`GetDataPoints(Rect rectangle)`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.CartesianSeries.html#Syncfusion_Maui_Charts_CartesianSeries_GetDataPoints_Microsoft_Maui_Graphics_Rect_) - Gets the collection of data that falls inside the given rectangle region. * [`GetDataPoints(double startX, double endX, double startY, double endY)`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.CartesianSeries.html#Syncfusion_Maui_Charts_CartesianSeries_GetDataPoints_System_Double_System_Double_System_Double_System_Double_) - Gets the collection of data from the given axis visible range. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} @@ -36,4 +36,4 @@ N> You can get the visible plotting region of the series in the chart using the ## See also * [How to highlight selected data points by using GetDataPoints method in .NET MAUI Cartesian Charts](https://support.syncfusion.com/kb/article/16174/how-to-highlight-selected-data-points-by-using-getdatapoints-method-in-net-maui-cartesian-charts) -* [Transform axis value to pixel value and vice-versa](https://help.syncfusion.com/maui/cartesian-charts/transform-axis-value-to-pixel-value-and-vice-versa) \ No newline at end of file +* [Transform axis value to pixel value and vice-versa](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/transform-axis-value-to-pixel-value-and-vice-versa) \ No newline at end of file diff --git a/chart-sdk/maui/Cartesian-Charts/Get-the-touch-position-in-chart.md b/chart-sdk/maui/Cartesian-Charts/Get-the-touch-position-in-chart.md index d529cecb2..f2283dbd7 100644 --- a/chart-sdk/maui/Cartesian-Charts/Get-the-touch-position-in-chart.md +++ b/chart-sdk/maui/Cartesian-Charts/Get-the-touch-position-in-chart.md @@ -1,18 +1,18 @@ --- layout: post -title: Get the touch position in Syncfusion SfCartesianChart -description: Learn here all about getting the touch position in SfCartesianChart in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: How to Get Touch Position in .NET MAUI Cartesian Chart| Syncfusion® +description: Get touch position in Syncfusion® .NET MAUI Cartesian Chart control to identify interaction coordinates and handle touch-based chart actions. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui cartesian chart touch position, maui cartesian chart touch position, .net maui cartesian chart touch event, sfcartesianchart touch interaction in .net maui, .net maui cartesian chart touch gesture, .net maui cartesian chart touch behavior --- -# Get the touch position in .NET MAUI Cartesian Chart +# How to Get Touch Position in .NET MAUI Cartesian Chart [ChartInteractiveBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartInteractiveBehavior.html) provides the following override methods to get the x and y positions when touching the [`SfCartesianChart`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. * [`OnTouchUp`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBehavior.html#Syncfusion_Maui_Charts_ChartBehavior_OnTouchUp_Syncfusion_Maui_Charts_ChartBase_System_Single_System_Single_) - Called when a user lifts their finger or releases their touch input from the Chart area. * [`OnTouchMove`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBehavior.html#Syncfusion_Maui_Charts_ChartBehavior_OnTouchMove_Syncfusion_Maui_Charts_ChartBase_System_Single_System_Single_) - Called when a user's finger or touch input device is in contact with the Chart area and moves across its surface. diff --git a/chart-sdk/maui/Cartesian-Charts/Getting-Started.md b/chart-sdk/maui/Cartesian-Charts/Getting-Started.md index 139fe8e0f..cb3ed0b29 100644 --- a/chart-sdk/maui/Cartesian-Charts/Getting-Started.md +++ b/chart-sdk/maui/Cartesian-Charts/Getting-Started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains how to get started with the Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Getting Started with .NET MAUI Cartesian Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Cartesian Chart control. Explore setup, chart types, customization, and data visualization features. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui cartesian chart, .net maui charting, cartesian chart maui, syncfusion cartesian chart maui, maui chart control, .net maui data visualization, cartesian chart example maui. --- -# Getting started with .NET MAUI Cartesian Chart +# Getting Started with .NET MAUI Cartesian Chart This section explains how to populate the Cartesian chart with data, a title, data labels, a legend, and tooltips, as well as the essential aspects for getting started with the chart. diff --git a/chart-sdk/maui/Cartesian-Charts/Histogram.md b/chart-sdk/maui/Cartesian-Charts/Histogram.md index b8ede9b47..c3eb4ff79 100644 --- a/chart-sdk/maui/Cartesian-Charts/Histogram.md +++ b/chart-sdk/maui/Cartesian-Charts/Histogram.md @@ -1,7 +1,7 @@ --- layout: post -title: Histogram Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the Histogram chart and its type in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Histogram Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Histogram Chart in .NET MAUI Cartesian Chart displays data distribution across value ranges, helping analyze frequency patterns and data variation. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui histogram chart, histogram chart customization .net maui, sy [Histogram chart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.HistogramSeries.html) is a graphical representation that organizes a group of data points into user-specified ranges. It is similar in appearance to a column chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. Customize histogram intervals using the [HistogramInterval](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.HistogramSeries.html#Syncfusion_Maui_Charts_HistogramSeries_HistogramInterval) property and normal distribution curve can be collapsed using the [ShowNormalDistributionCurve](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.HistogramSeries.html#Syncfusion_Maui_Charts_HistogramSeries_ShowNormalDistributionCurve) property. diff --git a/chart-sdk/maui/Cartesian-Charts/Legend.md b/chart-sdk/maui/Cartesian-Charts/Legend.md index 59eec5fbf..084a028a6 100644 --- a/chart-sdk/maui/Cartesian-Charts/Legend.md +++ b/chart-sdk/maui/Cartesian-Charts/Legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains how to initialize the legend and customize its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Legend in .NET MAUI Cartesian Chart | Syncfusion® +description: Legend in .NET MAUI Cartesian Chart displays series information with customizable styles, helping users identify and interpret chart data effectively. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui cartesian chart, chart legend, legend-wrap, legend view, leg The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) provides a list of series or data points, helping to identify the corresponding data series in the chart. Here's a detailed guide on how to define and customize the legend in the chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. To learn how to add and customize the legend in .NET MAUI Cartesian Charts quickly, you can check the video below. diff --git a/chart-sdk/maui/Cartesian-Charts/Line.md b/chart-sdk/maui/Cartesian-Charts/Line.md index 1a70cc202..0b429f790 100644 --- a/chart-sdk/maui/Cartesian-Charts/Line.md +++ b/chart-sdk/maui/Cartesian-Charts/Line.md @@ -1,7 +1,7 @@ --- layout: post -title: Line Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the line chart and its type in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Line Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Line Chart in .NET MAUI Cartesian Chart connects data points with continuous lines, making it easy to visualize trends, patterns, and changes over time. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui line chart, maui line chart, .net maui chart line type, line A line chart is used to represent the data trends at equal intervals by connecting points on a plot with straight lines. To render a line chart, create an instance of [LineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.LineSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Liquid-Glass-Effect.md b/chart-sdk/maui/Cartesian-Charts/Liquid-Glass-Effect.md index cf5c97172..9b42d973a 100644 --- a/chart-sdk/maui/Cartesian-Charts/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/Cartesian-Charts/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) for stunning UI. +title: Liquid Glass Effect in .NET MAUI Cartesian Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Cartesian Chart applies a sleek glass-like visual style to chart elements, enhancing chart appearance and visual appeal. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -13,7 +13,7 @@ keywords: .net maui chart, cupertino theme, glass effect, maui cupertino chart, The Liquid Glass Effect is a modern design style that provides a sleek, minimalist appearance with clean lines, subtle visual effects, and elegant styling. It features smooth rounded corners and sophisticated visual treatments that create a polished, professional look for your charts. N> **Prerequisite:** -- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. - To use **SfGlassEffectView**, ensure that the Syncfusion.Maui.Core package is installed and import the Syncfusion.Maui.Core namespace. N> The liquid glass effect is supported only on `.NET 10` and on `iOS` and `macOS` versions 26 or later. @@ -87,7 +87,7 @@ this.Content = glass; {% endtabs %} -For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/maui/liquid-glass-ui/getting-started). +For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/chart-sdk/maui/liquid-glass-ui/getting-started). ## Enable Liquid Glass effect to SfCartesianChart elements diff --git a/chart-sdk/maui/Cartesian-Charts/Localization.md b/chart-sdk/maui/Cartesian-Charts/Localization.md index 7bc0e86c2..10b3a78fe 100644 --- a/chart-sdk/maui/Cartesian-Charts/Localization.md +++ b/chart-sdk/maui/Cartesian-Charts/Localization.md @@ -1,7 +1,7 @@ --- layout: post -title: Localization in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about Localization support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control and more. +title: Localization in .NET MAUI Cartesian Chart | Syncfusion® +description: Localization in .NET MAUI Cartesian Chart supports culture-specific formatting for tooltips and trackball labels, improving regional data presentation. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui chart localization, sfCartesianchart localization in .net ma Localization is the process of translating the application resources into different languages for the specific cultures. The `SfCartesianChart` can be localized by adding `resource` file. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Setting CurrentUICulture to the application diff --git a/chart-sdk/maui/Cartesian-Charts/OHLC.md b/chart-sdk/maui/Cartesian-Charts/OHLC.md index 51bd27977..29a9b215b 100644 --- a/chart-sdk/maui/Cartesian-Charts/OHLC.md +++ b/chart-sdk/maui/Cartesian-Charts/OHLC.md @@ -1,7 +1,7 @@ --- layout: post -title: OHLC Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the OHLC chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: OHLC Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: OHLC Chart in .NET MAUI Cartesian Chart visualizes open, high, low, and close values, making it suitable for financial data and market trend analysis. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui ohlc chart, .net maui chart ohlc type, ohlc chart customizat OHLC (Open-High-Low-Close) charts are a type of financial chart used to represent the price movement of an asset over a specific period. OHLC charts display four price values: the opening price, the high price, the low price, and the closing price for each period. To render an OHLC chart, create an instance of [HiLoOpenCloseSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.HiLoOpenCloseSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Overview.md b/chart-sdk/maui/Cartesian-Charts/Overview.md index 7f4ef1c2c..dbceea149 100644 --- a/chart-sdk/maui/Cartesian-Charts/Overview.md +++ b/chart-sdk/maui/Cartesian-Charts/Overview.md @@ -1,14 +1,14 @@ --- layout: post -title: About .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI Chart (SfCartesianChart) control with key features and more. +title: About Syncfusion® .NET MAUI Cartesian Chart Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Cartesian Chart control, including chart types, axes, interactivity, and visualization features. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui sfCartesianChart overview, introduction to sfCartesianChart in .net maui, exploring sfCartesianChart in .net maui. --- -# .NET MAUI Cartesian Chart Overview +# About Syncfusion® .NET MAUI Cartesian Chart Control The Syncfusion® [.NET MAUI Cartesian chart](https://www.syncfusion.com/maui-controls/maui-cartesian-charts) provides a perfect way to visualize data with a high level of user involvement that focuses on development, productivity, and simplicity of use. Chart also provides a wide variety of charting features that can be used to visualize large quantities of data, as well as flexibility in data binding and user customization. @@ -88,17 +88,17 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for proportional data visualization using pie, doughnut, and radial bar charts. -- [Funnel Charts](https://help.syncfusion.com/maui/funnel-charts/overview) for visualizing stages in a process or pipeline. -- [Pyramid Charts](https://help.syncfusion.com/maui/pyramid-charts/overview) for hierarchical or comparative data representation. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for proportional data visualization using pie, doughnut, and radial bar charts. +- [Funnel Charts](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/overview) for visualizing stages in a process or pipeline. +- [Pyramid Charts](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/overview) for hierarchical or comparative data representation. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started) shows how to begin using the Cartesian chart control step by step. -- [Customization and Styling](https://help.syncfusion.com/maui/cartesian-charts/appearance) shows how to configure chart appearance, axes, gridlines, labels, legends, and themes. -- [Labels](https://help.syncfusion.com/maui/cartesian-charts/datalabels) display values directly on data points. -- [Zooming & Panning](https://help.syncfusion.com/maui/cartesian-charts/zooming-and-panning) provides interactive navigation to focus on specific ranges and move across large datasets smoothly. -- [Annotation](https://help.syncfusion.com/maui/cartesian-charts/annotation) adds custom text, shapes, or markers to highlight important areas or notes within the chart. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started) shows how to begin using the Cartesian chart control step by step. +- [Customization and Styling](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/appearance) shows how to configure chart appearance, axes, gridlines, labels, legends, and themes. +- [Labels](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/datalabels) display values directly on data points. +- [Zooming & Panning](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/zooming-and-panning) provides interactive navigation to focus on specific ranges and move across large datasets smoothly. +- [Annotation](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/annotation) adds custom text, shapes, or markers to highlight important areas or notes within the chart. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready-made UI examples. ## Resources diff --git a/chart-sdk/maui/Cartesian-Charts/Performance.md b/chart-sdk/maui/Cartesian-Charts/Performance.md index 4c59ac849..e9246f3b7 100644 --- a/chart-sdk/maui/Cartesian-Charts/Performance.md +++ b/chart-sdk/maui/Cartesian-Charts/Performance.md @@ -1,7 +1,7 @@ --- layout: post -title: Performance in .NET MAUI Cartesian Chart control | Syncfusion -description: Explore performance optimization techniques for .NET MAUI Cartesian Chart with fast series, real-time updates, and responsive data visualization. +title: Performance in .NET MAUI Cartesian Chart | Syncfusion® +description: Performance in .NET MAUI Cartesian Chart enables efficient rendering of large data sets, ensuring smooth interaction and responsive data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui chart performance, maui chart optimization, .net maui fast l The .NET MAUI Cartesian Chart provides performance optimization techniques to efficiently handle large datasets and dynamic data updates. Whether you are rendering thousands of data points or pushing real-time updates, the following strategies help you get the best rendering performance from `SfCartesianChart`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Fast chart in .NET MAUI Cartesian Charts diff --git a/chart-sdk/maui/Cartesian-Charts/PlotBand.md b/chart-sdk/maui/Cartesian-Charts/PlotBand.md index 627401627..f6e8dc9cb 100644 --- a/chart-sdk/maui/Cartesian-Charts/PlotBand.md +++ b/chart-sdk/maui/Cartesian-Charts/PlotBand.md @@ -1,18 +1,18 @@ --- layout: post -title: Plot band in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about plot band and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control and more. +title: Plot Band in .NET MAUI Cartesian Chart | Syncfusion® +description: Plot Band in .NET MAUI Cartesian Chart highlights specific axis ranges with custom backgrounds, making important values and regions easier to identify. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui plot band, maui plot band, .net maui chart plot band type, plot band customization .net maui, syncfusion maui plot band, cartesian plot band maui, .net maui chart plot band visualization, .net maui shaded region chart, .net maui recurrence plot band. --- -# Plot band in .NET MAUI Cartesian Chart +# Plot Band in .NET MAUI Cartesian Chart A plot band, also known as a stripline, allows for shading specific regions or ranges in the plot area background at regular or custom intervals. It also provides options to customize the size of these bands. Text can be added to plot band and indicate the significance of each particular region. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. Plot bands are classified into [NumericalPlotBand](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.NumericalPlotBand.html) and [DateTimePlotBand](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DateTimePlotBand.html). Based on the axis, plot bands are drawn using these classifications. The following properties are used to configure the plot band: diff --git a/chart-sdk/maui/Cartesian-Charts/Range-Column.md b/chart-sdk/maui/Cartesian-Charts/Range-Column.md index 981613b3b..aa7384be1 100644 --- a/chart-sdk/maui/Cartesian-Charts/Range-Column.md +++ b/chart-sdk/maui/Cartesian-Charts/Range-Column.md @@ -1,7 +1,7 @@ --- layout: post -title: Range Column Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about range column and range bar chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Range Column Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Range Column Chart in .NET MAUI Cartesian Chart displays value ranges using vertical columns, helping compare minimum and maximum values effectively. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui range column chart, maui range column chart, range column ch Range Column Chart is used to visualize data points with columns, with the height of each column representing the difference between the lowest and highest values of the data point. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. To render a range column chart, create an instance of [RangeColumnSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeColumnSeries.html), and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). diff --git a/chart-sdk/maui/Cartesian-Charts/RangeArea.md b/chart-sdk/maui/Cartesian-Charts/RangeArea.md index db1843726..ff16a12ad 100644 --- a/chart-sdk/maui/Cartesian-Charts/RangeArea.md +++ b/chart-sdk/maui/Cartesian-Charts/RangeArea.md @@ -1,7 +1,7 @@ --- layout: post -title: Range Area Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about range area chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Range Area Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Range Area Chart in .NET MAUI Cartesian Chart displays value ranges as filled areas between minimum and maximum values, enabling effective range comparison. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ Range Area Chart is a type of data visualization useful for displaying the relat By displaying ranges of data, range area series can make it easier to compare multiple datasets at once. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. To render a range area chart, create an instance of the [RangeAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAreaSeries.html), and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). diff --git a/chart-sdk/maui/Cartesian-Charts/Scatter.md b/chart-sdk/maui/Cartesian-Charts/Scatter.md index b79462063..921cb4d99 100644 --- a/chart-sdk/maui/Cartesian-Charts/Scatter.md +++ b/chart-sdk/maui/Cartesian-Charts/Scatter.md @@ -1,7 +1,7 @@ --- layout: post -title: Scatter Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the scatter chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Scatter Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Scatter Chart in .NET MAUI Cartesian Chart displays data as individual points, helping visualize relationships, distributions, and patterns between variables. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The scatter chart is used to represent each data point as a dot or circle of uni To render a scatter chart, create an instance of [ScatterSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ScatterSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). The segment size can be defined using the [PointHeight](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ScatterSeries.html#Syncfusion_Maui_Charts_ScatterSeries_PointHeight) and [PointWidth](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ScatterSeries.html#Syncfusion_Maui_Charts_ScatterSeries_PointWidth) properties. Both properties are of type `double`, and the default value is `10`. The [Type](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ScatterSeries.html#Syncfusion_Maui_Charts_ScatterSeries_Type) property, of type `ShapeType`, allows you to change the rendering shape of the scatter segment. The default value is `ShapeType.Circle`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/Selection.md b/chart-sdk/maui/Cartesian-Charts/Selection.md index 7b9bfa04e..9444b261f 100644 --- a/chart-sdk/maui/Cartesian-Charts/Selection.md +++ b/chart-sdk/maui/Cartesian-Charts/Selection.md @@ -1,7 +1,7 @@ --- layout: post -title: Selection in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about selection and multi-selection support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Selection in .NET MAUI Cartesian Chart | Syncfusion® +description: Selection in .NET MAUI Cartesian Chart allows data points and series to be highlighted on interaction, improving data analysis and visual exploration. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui chart selection, maui chart selection, .net maui chart selec The [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) provides selection behavior support, which allows you to select or highlight a segment (data points) or a series in the chart using the [DataPointSelectionBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DataPointSelectionBehavior.html) and [SeriesSelectionBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SeriesSelectionBehavior.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Enable data point selection diff --git a/chart-sdk/maui/Cartesian-Charts/SplineRangeArea.md b/chart-sdk/maui/Cartesian-Charts/SplineRangeArea.md index efbeef635..787162fbf 100644 --- a/chart-sdk/maui/Cartesian-Charts/SplineRangeArea.md +++ b/chart-sdk/maui/Cartesian-Charts/SplineRangeArea.md @@ -1,7 +1,7 @@ --- layout: post -title: Spline Range Area Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about Spline Range Area chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Spline Range Area Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Spline Range Area Chart in .NET MAUI Cartesian Chart displays value ranges with smooth curves between minimum and maximum values, improving trend visualization. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -18,7 +18,7 @@ To render a spline range area chart, create an instance of [SplineRangeAreaSerie Since the [SplineRangeAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SplineRangeAreaSeries.html) requires two Y values for each point, your data should contain both the high and low values. These high and low values specify the maximum and minimum ranges of the point. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StackedArea.md b/chart-sdk/maui/Cartesian-Charts/StackedArea.md index 228298de8..01ec8cacd 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedArea.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedArea.md @@ -1,7 +1,7 @@ --- layout: post -title: Stacked Area Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about stacked area chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Area Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Area Chart in .NET MAUI Cartesian Chart displays cumulative data as stacked areas, helping visualize part-to-whole relationships and trends over time. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The stacked area chart enables users to visually represent data points on top of To render a stacked area chart, create an instance of the [StackingAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.StackingAreaSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has a [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StackedArea100.md b/chart-sdk/maui/Cartesian-Charts/StackedArea100.md index 8ef421a7e..b31744f90 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedArea100.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedArea100.md @@ -1,18 +1,18 @@ --- layout: post -title: StackedArea100 Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about StackedArea100 chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Area 100 Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Area 100 Chart in .NET MAUI Cartesian Chart displays percentage contributions as stacked areas, helping visualize proportional data across categories. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui stacked area 100 chart, maui stacked area 100 chart, stacked area 100 chart customization .net maui, syncfusion maui stacked area 100 chart, cartesian stacked area 100 chart maui, .net maui chart stacked area 100 visualization, .net maui 100% stacked area chart --- -# StackedArea100 Chart in .NET MAUI Cartesian Chart +# Stacked Area 100 Chart in .NET MAUI Cartesian Chart The stacked area 100% chart enables users to visually represent data points vertically, one above the other, to indicate the cumulative value of the data points at 100%. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## StackedArea100 Chart diff --git a/chart-sdk/maui/Cartesian-Charts/StackedColumn.md b/chart-sdk/maui/Cartesian-Charts/StackedColumn.md index 40c9098e7..71838111c 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedColumn.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedColumn.md @@ -1,7 +1,7 @@ --- layout: post -title: Stacked Column Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about stacked column and bar chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Column Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Column Chart in .NET MAUI Cartesian Chart displays stacked columns to visualize cumulative values and part-to-whole relationships across categories. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The stacked column chart represents data values in a stacked format, where the c To render a stacked column chart, create an instance of the [StackingColumnSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.StackingColumnSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StackedColumn100.md b/chart-sdk/maui/Cartesian-Charts/StackedColumn100.md index 6a8f3e998..af77c28f3 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedColumn100.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedColumn100.md @@ -1,18 +1,18 @@ --- layout: post -title: StackedColumn100 Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about StackedColumn100 chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Column 100 Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Column 100 Chart in .NET MAUI Cartesian Chart displays stacked columns as percentages, helping visualize proportional data across categories. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui stacked column 100 chart, stacked column 100 chart customization .net maui, syncfusion maui stacked column 100 chart, cartesian stacked column 100 chart maui, .net maui chart stacked column 100 visualization, .net maui 100% stacked column chart, cartesian 100% stacked column chart maui. --- -# StackedColumn100 Chart in .NET MAUI Cartesian Chart +# Stacked Column 100 Chart in .NET MAUI Cartesian Chart A stacked column 100% chart is a type of stacked chart that is used to display the proportion of different categories within a single column. The columns are stacked on top of each other, and a cumulative portion of each stacked element always comes to a total of 100%. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## StackedColumn100 Chart diff --git a/chart-sdk/maui/Cartesian-Charts/StackedLine.md b/chart-sdk/maui/Cartesian-Charts/StackedLine.md index 81dbc50da..111eb8d06 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedLine.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedLine.md @@ -1,7 +1,7 @@ --- layout: post -title: Stacked Line Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about stacked line chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Line Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Line Chart in .NET MAUI Cartesian Chart displays cumulative data using stacked lines, helping visualize overall trends and contributions across series. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The stacked line chart is a type of chart that displays multiple line series sta To render a stacked line chart, create an instance of the [StackingLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.StackingLineSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has a [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StackedLine100.md b/chart-sdk/maui/Cartesian-Charts/StackedLine100.md index bd057cce9..b3181ee03 100644 --- a/chart-sdk/maui/Cartesian-Charts/StackedLine100.md +++ b/chart-sdk/maui/Cartesian-Charts/StackedLine100.md @@ -1,7 +1,7 @@ --- layout: post -title: Stacked Line 100 Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about stacked line 100 chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Stacked Line 100 Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Stacked Line 100 Chart in .NET MAUI Cartesian Chart displays percentage contributions using stacked lines, helping visualize proportional trends across series. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -16,7 +16,7 @@ The stacked line 100 chart is a type of chart that displays multiple line series To render a stacked line 100 chart, create an instance of the [StackingLine100Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.StackingLine100Series.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has a [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StepArea.md b/chart-sdk/maui/Cartesian-Charts/StepArea.md index 08497e353..819636cc1 100644 --- a/chart-sdk/maui/Cartesian-Charts/StepArea.md +++ b/chart-sdk/maui/Cartesian-Charts/StepArea.md @@ -1,7 +1,7 @@ --- layout: post -title: Step Area Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the Step area chart types and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Step Area Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Step Area Chart in .NET MAUI Cartesian Chart displays data as stepped filled areas, making it easy to visualize changes between discrete values. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui step area chart, maui step area chart, .net maui chart step A step area chart displays data that changes over time or across different categories. In a step area chart, the data points are connected by horizontal and vertical lines to create a series of steps. Each step represents a specific time interval or category. The area between the steps is then filled with a color or shading. To render an area chart, create an instance of [StepAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.StepAreaSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) collection property of the [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. N> The Cartesian chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_Series) as its default content. diff --git a/chart-sdk/maui/Cartesian-Charts/StepLine.md b/chart-sdk/maui/Cartesian-Charts/StepLine.md index 2f4ecdea5..ec1246043 100644 --- a/chart-sdk/maui/Cartesian-Charts/StepLine.md +++ b/chart-sdk/maui/Cartesian-Charts/StepLine.md @@ -1,7 +1,7 @@ --- layout: post -title: StepLine Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about stepline chart support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Step Line Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Step Line Chart in .NET MAUI Cartesian Chart displays data using horizontal and vertical line segments, making discrete value changes easy to visualize. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui step line chart, maui step line chart, step line chart custo A step line chart is used to display the data showing changes in values over time by connecting points on plots with a combination of horizontal and vertical lines. And it's used when it is necessary to highlight the irregularity changes. It appears to be steps. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Step Line Chart diff --git a/chart-sdk/maui/Cartesian-Charts/Tooltip.md b/chart-sdk/maui/Cartesian-Charts/Tooltip.md index 07b251a21..9d78baa69 100644 --- a/chart-sdk/maui/Cartesian-Charts/Tooltip.md +++ b/chart-sdk/maui/Cartesian-Charts/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains about how to enable tooltip and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Tooltip in .NET MAUI Cartesian Chart | Syncfusion® +description: Tooltip in .NET MAUI Cartesian Chart displays detailed information for data points on interaction, helping users analyze and understand chart data easily. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui chart tooltip, maui chart tooltip, .net maui chart tooltip c Tooltip is used to display any information or metadata of the tapped segment. The Cartesian chart provides tooltip support for all series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. To learn how to customize the tooltips in .NET MAUI Cartesian Charts quickly, you can check the below video. diff --git a/chart-sdk/maui/Cartesian-Charts/Trackball.md b/chart-sdk/maui/Cartesian-Charts/Trackball.md index eb5f3c1a9..9c1ea3e5b 100644 --- a/chart-sdk/maui/Cartesian-Charts/Trackball.md +++ b/chart-sdk/maui/Cartesian-Charts/Trackball.md @@ -1,7 +1,7 @@ --- layout: post -title: Trackball in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains about how to enable trackball and its customization in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Trackball in .NET MAUI Cartesian Chart | Syncfusion® +description: Trackball in .NET MAUI Cartesian Chart displays detailed information across series at a specific position, enabling precise data analysis and comparison. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui cartesian chart trackball, maui chart trackball, .net maui t The trackball allows you to show a tooltip for the nearest data points when you interact with the chart area. On mobile, long-press the chart to show the trackball, and drag the chart to change the trackball's location constantly. To display the trackball on the desktop, move the cursor over the chart area. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Enable trackball diff --git a/chart-sdk/maui/Cartesian-Charts/Transform-axis-value-to-pixel-value-and-vice-versa.md b/chart-sdk/maui/Cartesian-Charts/Transform-axis-value-to-pixel-value-and-vice-versa.md index 0333d28fc..008e0b345 100644 --- a/chart-sdk/maui/Cartesian-Charts/Transform-axis-value-to-pixel-value-and-vice-versa.md +++ b/chart-sdk/maui/Cartesian-Charts/Transform-axis-value-to-pixel-value-and-vice-versa.md @@ -1,21 +1,21 @@ --- layout: post -title: Transform axis value to pixel value and vice-versa in .NET MAUI Cartesian Chart | Syncfusion -description: Learn how to transform an axis value to a pixel value and vice-versa in SfCartesianChart in the Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: How to Convert Axis and Pixel Values in .NET MAUI Chart | Syncfusion® +description: Convert an axis value to a pixel value and vice versa in Syncfusion® .NET MAUI Cartesian Chart for coordinate mapping and chart interactions. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui chart transform axis value to pixel, maui chart axis value to pixel conversion, .net maui chart axis pixel to value, syncfusion maui chart axis coordinate transformation, sfCartesianChart axis value to pixel conversion in .net maui --- -# Transform axis value to pixel value and vice-versa in .NET MAUI Cartesian Chart +# How to Convert Axis and Pixel Values in .NET MAUI Chart [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html) offers two utility methods to transform a pixel into a chart point and vice-versa. * [`ValueToPoint(ChartAxis axis, double value)`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_ValueToPoint_Syncfusion_Maui_Charts_ChartAxis_System_Double_) - Converts the data point value to the screen point. * [`PointToValue(ChartAxis axis, double x, double y)`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html#Syncfusion_Maui_Charts_SfCartesianChart_PointToValue_Syncfusion_Maui_Charts_ChartAxis_System_Double_System_Double_) - Converts the screen point to the chart value. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Trendlines.md b/chart-sdk/maui/Cartesian-Charts/Trendlines.md index ae09cbc2c..080cec5bd 100644 --- a/chart-sdk/maui/Cartesian-Charts/Trendlines.md +++ b/chart-sdk/maui/Cartesian-Charts/Trendlines.md @@ -1,7 +1,7 @@ --- layout: post -title: Trendlines in .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains all about trendlines support in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Trendlines in .NET MAUI Cartesian Chart | Syncfusion® +description: Trendlines in .NET MAUI Cartesian Chart display data trends and patterns using statistical analysis, helping identify relationships and forecast outcomes. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -10,13 +10,13 @@ keywords: .net maui cartesian chart trendlines, maui chart trendlines, cartesian # Trendlines in .NET MAUI Cartesian Chart -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. A [trendline](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartTrendline.html) is a visual representation of the linear relationship between data points in a series. It shows the overall direction and trend of data by fitting a line (or curve) through the data points. N> Trendlines can be drawn for all types of Cartesian series except bar-type series (Bar, StackingBar, and their 100% variants). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. You can add trendlines to your charts using XAML or C# as shown in the following examples. @@ -488,7 +488,7 @@ this.Content = chart; ## Trendline legend label -N> The chart [legend](https://help.syncfusion.com/maui/cartesian-charts/legend) must be enabled for trendline legend labels to appear. +N> The chart [legend](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/legend) must be enabled for trendline legend labels to appear. You can display a custom label for the trendline in the chart legend using the [Label](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartTrendline.html#Syncfusion_Maui_Charts_ChartTrendline_Label) property, of type `string`. This helps distinguish between multiple trendlines and makes your chart more descriptive. diff --git a/chart-sdk/maui/Cartesian-Charts/Waterfall-Chart.md b/chart-sdk/maui/Cartesian-Charts/Waterfall-Chart.md index 1fc7da051..07910c002 100644 --- a/chart-sdk/maui/Cartesian-Charts/Waterfall-Chart.md +++ b/chart-sdk/maui/Cartesian-Charts/Waterfall-Chart.md @@ -1,7 +1,7 @@ --- layout: post -title: Waterfall Chart in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about the Waterfall Series chart and its features in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: Waterfall Chart in .NET MAUI Cartesian Chart | Syncfusion® +description: Waterfall Chart in .NET MAUI Cartesian Chart shows cumulative changes from positive and negative values, helping analyze trends across sequential data points. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -22,7 +22,7 @@ The following properties customize the waterfall series: * [AllowAutoSum](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.WaterfallSeries.html#Syncfusion_Maui_Charts_WaterfallSeries_AllowAutoSum), of type `bool`, is used to change the summary segment calculation. The default value is `true`. When this property is disabled, the segment is rendered using the y value of the provided ItemsSource collection. * [ShowConnectorLine](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.WaterfallSeries.html#Syncfusion_Maui_Charts_WaterfallSeries_ShowConnectorLine), of type `bool`, is used to enable or disable the connector line. The default value is `true`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Cartesian-Charts/Zooming-and-panning.md b/chart-sdk/maui/Cartesian-Charts/Zooming-and-panning.md index 438cea9ab..2e7274a4f 100644 --- a/chart-sdk/maui/Cartesian-Charts/Zooming-and-panning.md +++ b/chart-sdk/maui/Cartesian-Charts/Zooming-and-panning.md @@ -1,7 +1,7 @@ --- layout: post -title: Zooming and Panning in .NET MAUI Cartesian Chart control | Syncfusion -description: Learn here all about Zooming and Panning feature of Syncfusion® .NET MAUI Cartesian Chart(SfCartesianChart) control. +title: Zooming and Panning in .NET MAUI Cartesian Chart | Syncfusion® +description: Zooming and Panning in .NET MAUI Cartesian Chart enable interactive navigation across chart data, making it easier to explore and analyze large data sets. platform: chart-sdk control: SfCartesianChart documentation: ug @@ -14,7 +14,7 @@ keywords: .net maui cartesian chart zooming and panning, .net maui zooming and p Zooming and panning allow you to take a close-up look at the data points plotted in the series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. ## Enable zooming diff --git a/chart-sdk/maui/Cartesian-Charts/display-tooltip-and-data-labels-in-release-mode.md b/chart-sdk/maui/Cartesian-Charts/display-tooltip-and-data-labels-in-release-mode.md index f4a26062a..7f9c8882c 100644 --- a/chart-sdk/maui/Cartesian-Charts/display-tooltip-and-data-labels-in-release-mode.md +++ b/chart-sdk/maui/Cartesian-Charts/display-tooltip-and-data-labels-in-release-mode.md @@ -1,18 +1,18 @@ --- layout: post -title: Show tooltip and datalabels in release mode | Syncfusion -description: Learn here all about displaying tooltip and datalabels in release mode in SfCartesianChart in Syncfusion® .NET MAUI Cartesian Chart (SfCartesianChart) control. +title: How to Preserve Template Bindings in .NET MAUI Chart | Syncfusion® +description: Preserve template bindings in Syncfusion® .NET MAUI Cartesian Chart to maintain data binding behavior and ensure proper template rendering. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: .net maui cartesian chart tooltip, .net maui cartesian chart data label, tooltipinfo item binding, chartdatalabel item binding, release mode trimming, preserve attribute maui --- -# Display tooltip and data labels in release mode in .NET MAUI Cartesian Chart +# How to Preserve Template Bindings in .NET MAUI Cartesian Chart In [SfCartesianChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCartesianChart.html), tooltip and data label templates do not bind directly to your business model because these elements are generated by the chart at runtime and often represent calculated points. As a result, the chart provides its own binding context containing the necessary metadata. For tooltips this context is [TooltipInfo](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.TooltipInfo.html), and for data labels it is [ChartDataLabel](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartDataLabel.html). Both expose an Item property that points back to your original business model when a direct mapping exists. With .NET 9 compiled bindings, set **x:DataType="chart:TooltipInfo"** for tooltip templates and **x:DataType="chart:ChartDataLabel"** for data label templates, then bind through Item. If you need a specific field from your model, bind to Item and use a value converter to extract the desired property. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/cartesian-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCartesianChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started)** guide. `Ahead-of-Time (AOT)` compilation converts Intermediate Language to native code at build time to improve startup and runtime performance. AOT commonly ships together with linker trimming in Release configurations to reduce app size. diff --git a/chart-sdk/maui/Cartesian-Charts/migration.md b/chart-sdk/maui/Cartesian-Charts/migration.md index bc7cf2db7..f4e84a641 100644 --- a/chart-sdk/maui/Cartesian-Charts/migration.md +++ b/chart-sdk/maui/Cartesian-Charts/migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Migration from Xamarin to .NET MAUI Cartesian Chart control | Syncfusion -description: This section explains the features available in the .NET MAUI Cartesian Chart (SfCartesianChart) control over Xamarin SfChart. +title: Migrate SfChart to .NET MAUI Cartesian Chart | Syncfusion® +description: Migrate from Xamarin.Forms SfChart to .NET MAUI Cartesian Chart with updated APIs, improved performance, and modern charting features for data visualization. platform: chart-sdk control: SfCartesianChart documentation: ug keywords: migrate from xamarin.Forms sfChart to .net maui sfCartesianChart, transitioning from xamarin.Forms sfChart to .net maui sfCartesianChart, move from xamarin.Forms sfChart to .net maui sfCartesianChart, upgrading xamarin.Forms s to .net maui sfCartesianChart. --- -# Migrate from Xamarin.Forms SfChart to .NET MAUI SfCartesianChart +# Migrate from Xamarin.Forms SfChart to .NET MAUI Cartesian Chart The Cartesian Chart was created from scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, a minor code change is required. In addition, [SfChart](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfChart.XForms.SfChart.html) has been divided into five chart controls in .NET MAUI for a better user experience and understanding. @@ -806,7 +806,7 @@ this.Content = chart; -N> For more information about selection check [here](https://help.syncfusion.com/maui/cartesian-charts/selection). +N> For more information about selection check [here](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/selection). ### Zooming and Panning diff --git a/chart-sdk/maui/Circular-Charts/Appearance.md b/chart-sdk/maui/Circular-Charts/Appearance.md index 8bca18210..8c08e523c 100644 --- a/chart-sdk/maui/Circular-Charts/Appearance.md +++ b/chart-sdk/maui/Circular-Charts/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Circular Chart control | Syncfusion -description: Learn here all about appearance customization in .NET MAUI Circular Chart (SfCircularChart), its elements and more. +title: Appearance in .NET MAUI Circular Chart | Syncfusion® +description: Appearance customization in .NET MAUI Circular Chart allows you to personalize chart visuals using colors, palettes, gradients. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The appearance of the [SfCircularChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html) can be customized by using the predefined palettes, custom palettes, and gradient which allows enriching the application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Add a title diff --git a/chart-sdk/maui/Circular-Charts/DataLabels.md b/chart-sdk/maui/Circular-Charts/DataLabels.md index 3b021a883..405edfd27 100644 --- a/chart-sdk/maui/Circular-Charts/DataLabels.md +++ b/chart-sdk/maui/Circular-Charts/DataLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Data label in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to configure the data labels and its features in .NET MAUI Circular Chart (SfCircularChart). +title: Data label in .NET MAUI Circular Chart | Syncfusion® +description: Data label in .NET MAUI Circular Chart displays data point values directly on chart segments, improving readability and enabling quick data interpretation. platform: chart-sdk control: SfCircularChart documentation: ug @@ -16,7 +16,7 @@ Each data label can be represented by the following: * Label - displays the segment label content at the (X, Y) point. * Connector line - used to connect the (X, Y) point and the label element. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Enable data labels diff --git a/chart-sdk/maui/Circular-Charts/DoughnutChart.md b/chart-sdk/maui/Circular-Charts/DoughnutChart.md index 7f573d521..e40be6e16 100644 --- a/chart-sdk/maui/Circular-Charts/DoughnutChart.md +++ b/chart-sdk/maui/Circular-Charts/DoughnutChart.md @@ -1,7 +1,7 @@ --- layout: post -title: Doughnut chart in .NET MAUI Circular Chart control | Syncfusion -description: Learn here all about doughnut chart and its features in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Doughnut chart in .NET MAUI Circular Chart | Syncfusion® +description: Doughnut chart in .NET MAUI Circular Chart displays data as proportional segments in a circular ring, making it easy to visualize part-to-whole relationships. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug [DoughnutSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DoughnutSeries.html) is similar to [PieSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html). It is used to show the relationship between parts of data and whole data. To render a [DoughnutSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DoughnutSeries.html) in circular chart, create an instance of the [DoughnutSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DoughnutSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) collection property of [SfCircularChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. N> The circular chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) as its default content. diff --git a/chart-sdk/maui/Circular-Charts/Explode.md b/chart-sdk/maui/Circular-Charts/Explode.md index bd1c5b3dd..3dc6f9af8 100644 --- a/chart-sdk/maui/Circular-Charts/Explode.md +++ b/chart-sdk/maui/Circular-Charts/Explode.md @@ -1,13 +1,13 @@ --- layout: post -title: Explode segments in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to explode a single segment or all segments in the Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Explode Segments in .NET MAUI Circular Chart | Syncfusion® +description: Explode segments in .NET MAUI Circular Chart highlights specific data points by separating slices, making key values easier to identify and analyze. platform: chart-sdk control: SfCircularChart documentation: ug --- -# Explode segments in .NET MAUI SfCircularChart +# Explode Segments in .NET MAUI Circular Chart ## Exploding a segment @@ -17,7 +17,7 @@ Exploding a segment pulls attention to a specific area of the circular chart. Th * [ExplodeRadius](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_ExplodeRadius), of type `double`, defines the explode distance in pixels (px). The default value is `10`. A positive value moves the segment outward from the center. * [ExplodeOnTouch](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_ExplodeOnTouch), of type `bool`, enables a segment to be exploded on tap interaction. The default value is `false`. The explosion is animated when tapped. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Circular-Charts/Exporting.md b/chart-sdk/maui/Circular-Charts/Exporting.md index e45268299..40b219cbe 100644 --- a/chart-sdk/maui/Circular-Charts/Exporting.md +++ b/chart-sdk/maui/Circular-Charts/Exporting.md @@ -1,7 +1,7 @@ --- layout: post -title: Exporting in .NET MAUI Circular Chart control | Syncfusion -description: Learn here how to export the chart view as an image and stream in the Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Exporting in .NET MAUI Circular Chart | Syncfusion® +description: Exporting in .NET MAUI Circular Chart enables you to save charts as image files or export them for sharing, reporting, and presentation purposes. platform: chart-sdk control: SfCircularChart documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Exporting in .NET MAUI Circular Chart -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Export as an image diff --git a/chart-sdk/maui/Circular-Charts/Getting-Started.md b/chart-sdk/maui/Circular-Charts/Getting-Started.md index a80b224c7..5e3dddb71 100644 --- a/chart-sdk/maui/Circular-Charts/Getting-Started.md +++ b/chart-sdk/maui/Circular-Charts/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Circular Chart control | Syncfusion -description: Learn here all about getting started with Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control, its elements, and more. +title: Getting Started with .NET MAUI Circular Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Circular Chart control. Explore setup, chart types, customization, and data visualization features. platform: chart-sdk control: SfCircularChart documentation: ug diff --git a/chart-sdk/maui/Circular-Charts/GroupTo.md b/chart-sdk/maui/Circular-Charts/GroupTo.md index 783018567..3a0b32bbb 100644 --- a/chart-sdk/maui/Circular-Charts/GroupTo.md +++ b/chart-sdk/maui/Circular-Charts/GroupTo.md @@ -1,17 +1,17 @@ --- layout: post -title: Grouping data points in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to group data points in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Grouping Data Points in .NET MAUI Circular Chart | Syncfusion® +description: Grouping data points in .NET MAUI Circular Chart combines smaller segments into a single category, improving readability and simplifying data visualization. platform: chart-sdk control: SfCircularChart documentation: ug --- -# Grouping Data Points in .NET MAUI SfCircularChart +# Grouping Data Points in .NET MAUI Circular Chart The small segments in the circular chart can be grouped into an `Others` category using the [GroupTo](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_GroupTo) and [GroupMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_GroupMode) properties of the [PieSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html). The [GroupMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_GroupMode) property is used to specify the grouping type based on slice angle (`Angle`), actual data point value (`Value`), or percentage (`Percentage`). The [GroupTo](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html#Syncfusion_Maui_Charts_PieSeries_GroupTo) property is used to set the limit to group data points into a single slice. The grouped segment is labeled as `Others` in the chart legend. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Group mode diff --git a/chart-sdk/maui/Circular-Charts/Legend.md b/chart-sdk/maui/Circular-Charts/Legend.md index 3458dcd8c..4aec0ca16 100644 --- a/chart-sdk/maui/Circular-Charts/Legend.md +++ b/chart-sdk/maui/Circular-Charts/Legend.md @@ -1,18 +1,18 @@ --- layout: post -title: Legend in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to initialize legend and its customization in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Legend in .NET MAUI Circular Chart | Syncfusion® +description: Legend in .NET MAUI Circular Chart displays series information with customizable styles, helping users identify and interpret chart segments easily. platform: chart-sdk control: SfCircularChart documentation: ug keywords: .net maui circular chart, chart legend, legend-wrap, legend view, legend layout, chart legend items, legend alignment. --- -# Legend in .NET MAUI Circular Chart (SfCircularChart) +# Legend in .NET MAUI Circular Chart The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) provides a list of data points, helping to identify the corresponding data points in the chart. This guide explains how to define and customize the legend in the circular chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Defining the legend To define the legend in the chart, initialize the [ChartLegend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartLegend.html) class and assign it to the [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) property. diff --git a/chart-sdk/maui/Circular-Charts/Liquid-Glass-Effect.md b/chart-sdk/maui/Circular-Charts/Liquid-Glass-Effect.md index 6cdba8c23..658c5fa67 100644 --- a/chart-sdk/maui/Circular-Charts/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/Circular-Charts/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Circular Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) for stunning UI.. +title: Liquid Glass Effect in .NET MAUI Circular Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Circular Chart applies a sleek glass-like visual style to chart elements, enhancing the overall look and user experience. platform: chart-sdk control: SfCircularChart documentation: ug @@ -13,7 +13,7 @@ keywords: .net maui chart, cupertino theme, glass effect, maui cupertino chart, The Liquid Glass Effect is a modern design style that provides a sleek, minimalist appearance with clean lines, subtle visual effects, and elegant styling. It features smooth rounded corners and sophisticated visual treatments that create a polished, professional look for your charts. N> **Prerequisite:** -- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. - To use **SfGlassEffectView**, ensure that the Syncfusion.Maui.Core package is installed and import the Syncfusion.Maui.Core namespace. N> The liquid glass effect is supported with `.NET 10` and on iOS and macOS versions 26 or later. @@ -71,7 +71,7 @@ this.Content = glass; {% endtabs %} -For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/maui/liquid-glass-ui/getting-started). +For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/chart-sdk/maui/liquid-glass-ui/getting-started). ### Enable Liquid Glass Effect for the Tooltip diff --git a/chart-sdk/maui/Circular-Charts/Overview.md b/chart-sdk/maui/Circular-Charts/Overview.md index a11acc01e..2ecb37b76 100644 --- a/chart-sdk/maui/Circular-Charts/Overview.md +++ b/chart-sdk/maui/Circular-Charts/Overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Circular Chart Control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI Chart(SfCircularChart) control with key features and more. +title: About Syncfusion® .NET MAUI Circular Chart Control | Syncfusion +description: Learn about the overview of Syncfusion® .NET MAUI Circular Chart control, including chart types, customization options, and data visualization features. platform: chart-sdk control: SfCircularChart documentation: ug --- -# .NET MAUI Circular Chart Overview +# About Syncfusion® .NET MAUI Circular Chart Control Syncfusion® [.NET MAUI Charts](https://www.syncfusion.com/maui-controls/maui-circular-charts) (SfCircularChart) is used to create the chart with beautiful and enhanced UI visualization of data that are used in high-quality .NET MAUI applications. @@ -83,16 +83,16 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for trend analysis, comparisons, and multi‑series data visualization using X and Y axes. -- [Funnel Charts](https://help.syncfusion.com/maui/funnel-charts/overview) for visualizing stages in a process or pipeline. -- [Pyramid Charts](https://help.syncfusion.com/maui/pyramid-charts/overview) for hierarchical or comparative data representation. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for trend analysis, comparisons, and multi‑series data visualization using X and Y axes. +- [Funnel Charts](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/overview) for visualizing stages in a process or pipeline. +- [Pyramid Charts](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/overview) for hierarchical or comparative data representation. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started) shows a step‑by‑step guide to begin using the Circular Chart control. -- [Pie Chart](https://help.syncfusion.com/maui/circular-charts/piechart) creates simple part‑to‑whole visualizations with clear category splits. -- [Doughnut Chart](https://help.syncfusion.com/maui/circular-charts/doughnutchart) highlights proportions with a modern ring‑style chart for better readability. -- [RadialBar Chart](https://help.syncfusion.com/maui/circular-charts/radialbarchart) displays values in a circular bar style, making comparisons visually clear and engaging. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started) shows a step‑by‑step guide to begin using the Circular Chart control. +- [Pie Chart](https://help.syncfusion.com/chart-sdk/maui/circular-charts/piechart) creates simple part‑to‑whole visualizations with clear category splits. +- [Doughnut Chart](https://help.syncfusion.com/chart-sdk/maui/circular-charts/doughnutchart) highlights proportions with a modern ring‑style chart for better readability. +- [RadialBar Chart](https://help.syncfusion.com/chart-sdk/maui/circular-charts/radialbarchart) displays values in a circular bar style, making comparisons visually clear and engaging. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/Circular-Charts/PieChart.md b/chart-sdk/maui/Circular-Charts/PieChart.md index 5ec527256..8adbe7831 100644 --- a/chart-sdk/maui/Circular-Charts/PieChart.md +++ b/chart-sdk/maui/Circular-Charts/PieChart.md @@ -1,7 +1,7 @@ --- layout: post -title: Pie Chart in .NET MAUI Circular Chart control | Syncfusion -description: Learn here all about the pie chart and its features in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Pie Chart in .NET MAUI Circular Chart | Syncfusion® +description: Pie Chart in .NET MAUI Circular Chart represents data as proportional slices, helping users visualize part-to-whole relationships clearly and effectively. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug To render a [PieSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html) in a circular chart, create an instance of the [PieSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PieSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) collection property of [SfCircularChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. N> The circular chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) as its default content. diff --git a/chart-sdk/maui/Circular-Charts/RadialBarChart.md b/chart-sdk/maui/Circular-Charts/RadialBarChart.md index 8960d1010..f1550f0df 100644 --- a/chart-sdk/maui/Circular-Charts/RadialBarChart.md +++ b/chart-sdk/maui/Circular-Charts/RadialBarChart.md @@ -1,7 +1,7 @@ --- layout: post -title: Radial Bar chart in .NET MAUI Circular Chart control | Syncfusion -description: Learn here all about radial bar chart and its features in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control. +title: Radial Bar Chart in .NET MAUI Circular Chart | Syncfusion® +description: Radial Bar Chart in .NET MAUI Circular Chart visualizes values as radial bars in a circular layout, making it easy to compare and track data effectively. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug [RadialBarSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RadialBarSeries.html) is a type of doughnut chart that represents each segment as a separate circle. It is used to compare values between various categories. To render a [RadialBarSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RadialBarSeries.html) in circular chart, create an instance of the [RadialBarSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RadialBarSeries.html) and add it to the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) collection property of [SfCircularChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. N> The circular chart has [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html#Syncfusion_Maui_Charts_SfCircularChart_Series) as its default content. diff --git a/chart-sdk/maui/Circular-Charts/Selection.md b/chart-sdk/maui/Circular-Charts/Selection.md index 3446869a8..7558455b7 100644 --- a/chart-sdk/maui/Circular-Charts/Selection.md +++ b/chart-sdk/maui/Circular-Charts/Selection.md @@ -1,7 +1,7 @@ --- layout: post -title: Selection in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to configure the selection support and its features applying in .NET MAUI Circular Chart (SfCircularChart). +title: Selection in .NET MAUI Circular Chart | Syncfusion® +description: Selection in .NET MAUI Circular Chart allows users to highlight and interact with specific chart segments, improving data analysis and user engagement. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The [SfCircularChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfCircularChart.html) provides selection behavior support, which allows you to select or highlight a segment (data points) in a series using the [DataPointSelectionBehavior](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.DataPointSelectionBehavior.html). When a user taps or clicks on a segment, the selection behavior highlights that data point with the specified selection brush color. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Enable selection diff --git a/chart-sdk/maui/Circular-Charts/Tooltip.md b/chart-sdk/maui/Circular-Charts/Tooltip.md index 03988b81e..ee29047ea 100644 --- a/chart-sdk/maui/Circular-Charts/Tooltip.md +++ b/chart-sdk/maui/Circular-Charts/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Circular Chart control | Syncfusion -description: This section explains about how to enable tooltip and its customization in Syncfusion® .NET MAUI Circular Chart (SfCircularChart) control +title: Tooltip in .NET MAUI Circular Chart | Syncfusion® +description: Tooltip in .NET MAUI Circular Chart displays detailed information for chart segments on interaction, helping users quickly understand and analyze data. platform: chart-sdk control: SfCircularChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug Tooltip is used to display any information or metadata of the tapped segment. The Circular Chart provides tooltip support for all series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/circular-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfCircularChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/circular-charts/getting-started)** guide. ## Define Tooltip diff --git a/chart-sdk/maui/Circular-Charts/migration.md b/chart-sdk/maui/Circular-Charts/migration.md index 83c99f7f4..150cfe315 100644 --- a/chart-sdk/maui/Circular-Charts/migration.md +++ b/chart-sdk/maui/Circular-Charts/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migration from Xamarin to .NET MAUI CircularChart control | Syncfusion -description: This section explains the features available in the .NET MAUI Chart (SfCircularChart) control over Xamarin SfChart. +title: Migrate SfChart to Circular Chart | Syncfusion® +description: Migrate from Xamarin.Forms SfChart to .NET MAUI Circular Chart with updated APIs, enhanced performance, and modern features for circular data visualization. platform: chart-sdk control: SfCircularChart documentation: ug --- -# Migrate from Xamarin.Forms SfChart to .NET MAUI SfCircularChart +# Migrate from Xamarin.Forms SfChart to .NET MAUI Circular Chart The Circular Chart was created from scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, a minor code change is required. In addition, [SfChart](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfChart.XForms.SfChart.html) has been divided into five chart controls in .NET MAUI for a better user experience and understanding. @@ -631,7 +631,7 @@ this.Content = chart; -N> For more information about selection check [here](https://help.syncfusion.com/maui/circular-charts/selection). +N> For more information about selection check [here](https://help.syncfusion.com/chart-sdk/maui/circular-charts/selection). ## Upcoming features in .NET MAUI diff --git a/chart-sdk/maui/DigitalGauge/Character-Display-Types.md b/chart-sdk/maui/DigitalGauge/Character-Display-Types.md index a01fee30a..336c64526 100644 --- a/chart-sdk/maui/DigitalGauge/Character-Display-Types.md +++ b/chart-sdk/maui/DigitalGauge/Character-Display-Types.md @@ -1,7 +1,7 @@ --- layout: post -title: Character Display Types in .NET MAUI Digital Gauge | Syncfusion -description: Learn here all about Display Types support in Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control and more. +title: Character Display Types in .NET MAUI Digital Gauge | Syncfusion® +description: Character Display Types in .NET MAUI Digital Gauge support various segment styles for rendering characters, enabling flexible and customizable digital displays. platform: chart-sdk control: DigitalGauge documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui, .net maui digital gauge, digital gauge, character segments, The digital gauge displays numbers, the alphabet, and special characters, which are given in the [text](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html#Syncfusion_Maui_Gauges_SfDigitalGauge_Text) property. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/digitalgauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/getting-started)** guide. ## Display numbers diff --git a/chart-sdk/maui/DigitalGauge/Character-Segment-Types.md b/chart-sdk/maui/DigitalGauge/Character-Segment-Types.md index 459354919..8980f07a0 100644 --- a/chart-sdk/maui/DigitalGauge/Character-Segment-Types.md +++ b/chart-sdk/maui/DigitalGauge/Character-Segment-Types.md @@ -1,7 +1,7 @@ --- layout: post -title: Character Types in .NET MAUI Digital Gauge | Syncfusion -description: Learn here all about Character Types support in Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control and more. +title: Character Types in .NET MAUI Digital Gauge | Syncfusion® +description: Character Types in .NET MAUI Digital Gauge support different character formats for displaying numeric and alphanumeric values in digital gauge displays. platform: chart-sdk control: DigitalGauge documentation: ug @@ -17,7 +17,7 @@ The digital characters can be displayed in the following four different segments * [SixteenSegment](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.DigitalGaugeCharacterType.html#Syncfusion_Maui_Gauges_DigitalGaugeCharacterType_SixteenSegment) * [EightCrossEightDotMatrix](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.DigitalGaugeCharacterType.html#Syncfusion_Maui_Gauges_DigitalGaugeCharacterType_EightCrossEightDotMatrix) -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/digitalgauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/getting-started)** guide. ## Seven segment diff --git a/chart-sdk/maui/DigitalGauge/Customization.md b/chart-sdk/maui/DigitalGauge/Customization.md index c29e6207b..aafe8abfd 100644 --- a/chart-sdk/maui/DigitalGauge/Customization.md +++ b/chart-sdk/maui/DigitalGauge/Customization.md @@ -1,7 +1,7 @@ --- layout: post -title: Customize Character Segments in .NET MAUI Digital Gauge | Syncfusion -description: Learn here all about Customize Character Segments support in Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control and more. +title: Customize Character Segments in .NET MAUI Digital Gauge | Syncfusion® +description: Customize Character Segments in .NET MAUI Digital Gauge enables segment-level styling and appearance customization for flexible digital value displays. platform: chart-sdk control: DigitalGauge documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui, .net maui digital gauge, digital gauge, character segments, The characters of a digital gauge can be customized in terms of [CharacterWidth](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html#Syncfusion_Maui_Gauges_SfDigitalGauge_CharacterWidth), [CharacterHeight](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html#Syncfusion_Maui_Gauges_SfDigitalGauge_CharacterHeight), [CharacterSpacing](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html#Syncfusion_Maui_Gauges_SfDigitalGauge_CharacterSpacing), and [CharacterStroke](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html#Syncfusion_Maui_Gauges_SfDigitalGauge_CharacterStroke). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/digitalgauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/getting-started)** guide. ## Customize character size diff --git a/chart-sdk/maui/DigitalGauge/Events.md b/chart-sdk/maui/DigitalGauge/Events.md index b03462d5a..e5065db92 100644 --- a/chart-sdk/maui/DigitalGauge/Events.md +++ b/chart-sdk/maui/DigitalGauge/Events.md @@ -1,7 +1,7 @@ --- layout: post -title: Events in .NET MAUI Digital Gauge | Syncfusion -description: Learn about events in the Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control, its introduction, elements, and more. +title: Events in .NET MAUI Digital Gauge | Syncfusion® +description: Events in .NET MAUI Digital Gauge provide notifications for user interactions and control actions, enabling customized behavior and dynamic updates. platform: chart-sdk control: DigitalGauge documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui, .net maui digital gauge, digital gauge, character segments, The [SfDigitalGauge](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfDigitalGauge.html) control provides events that notify when the text value changes, allowing you to perform custom actions. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/digitalgauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfDigitalGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/getting-started)** guide. ## TextChanged diff --git a/chart-sdk/maui/DigitalGauge/Getting-Started.md b/chart-sdk/maui/DigitalGauge/Getting-Started.md index 66b2beeaa..3ae5378f2 100644 --- a/chart-sdk/maui/DigitalGauge/Getting-Started.md +++ b/chart-sdk/maui/DigitalGauge/Getting-Started.md @@ -1,13 +1,13 @@ --- layout: post -title: Getting Started with in .NET MAUI Digital Gauge | Syncfusion -description: Learn here about getting started with Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control, its elements and more. +title: Getting Started with .NET MAUI Digital Gauge | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Digital Gauge control. Explore setup, character displays, customization, and key features. platform: chart-sdk control: DigitalGauge documentation: ug keywords: .net maui, .net maui digital gauge, digital gauge, character segments, digital character, character types, character display types --- -# Getting Started with the .NET MAUI DigitalGauge +# Getting Started with .NET MAUI Digital Gauge This section explains how to add the [.NET MAUI DigitalGauge](https://www.syncfusion.com/maui-controls/maui-digital-gauge) control. This section covers only the basic features needed to get started with Syncfusion® DigitalGauge. Follow the steps below to add .NET MAUI DigitalGauge control to your project. diff --git a/chart-sdk/maui/DigitalGauge/migration.md b/chart-sdk/maui/DigitalGauge/migration.md index b6fd15f08..1e6cf780c 100644 --- a/chart-sdk/maui/DigitalGauge/migration.md +++ b/chart-sdk/maui/DigitalGauge/migration.md @@ -1,7 +1,7 @@ --- layout: post -title: Migrate from Xamarin to in .NET MAUI Digital Gauge | Syncfusion -description: Learn here all about Migrating from Syncfusion® Xamarin SfDigitalGauge to Syncfusion® .NET MAUI SfDigitalGauge control and more. +title: Migrate SfDigitalGauge to .NET MAUI SfDigitalGauge | Syncfusion® +description: Migrate from Xamarin.Forms SfDigitalGauge to .NET MAUI SfDigitalGauge with updated APIs, improved performance, and modern digital gauge features. platform: chart-sdk control: DigitalGauge documentation: ug diff --git a/chart-sdk/maui/DigitalGauge/overview.md b/chart-sdk/maui/DigitalGauge/overview.md index 14d3e28a5..96459a815 100644 --- a/chart-sdk/maui/DigitalGauge/overview.md +++ b/chart-sdk/maui/DigitalGauge/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Digital Gauge control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI Digital Gauge (SfDigitalGauge) control, its elements and more. +title: About Syncfusion® .NET MAUI Digital Gauge Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Digital Gauge control, including character displays, customization options, events, and key features. platform: chart-sdk control: DigitalGauge documentation: ug keywords: .net maui, .net maui digital gauge, digital gauge, character segments, digital character, character types, character display types --- -# .NET MAUI Digital Gauge (SfDigitalGauge) Overview +# About Syncfusion® .NET MAUI Digital Gauge Control The Syncfusion® [.NET MAUI DigitalGauge](https://www.syncfusion.com/maui-controls/maui-digital-gauge) control is used to display alphanumeric characters in digital (LED display) mode. This control displays a range of values that use characters in combination with numbers. @@ -79,15 +79,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for visualizing proportional data using circular charts. -- [Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/overview) for representing values using gauge-based visualization. -- [Radial Gauge](https://help.syncfusion.com/maui/radial-gauge/overview) for displaying progress values in a circular style. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for visualizing proportional data using circular charts. +- [Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/overview) for representing values using gauge-based visualization. +- [Radial Gauge](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/overview) for displaying progress values in a circular style. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/digitalgauge/getting-started) shows a step‑by‑step guide to begin using the Digital Gauge control. -- [Segments Types](https://help.syncfusion.com/maui/digitalgauge/character-segment-types) helps you understand different segment types and configurations. -- [Customization](https://help.syncfusion.com/maui/digitalgauge/customization) explains how to customize appearance and behavior of the control. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/getting-started) shows a step‑by‑step guide to begin using the Digital Gauge control. +- [Segments Types](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/character-segment-types) helps you understand different segment types and configurations. +- [Customization](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/customization) explains how to customize appearance and behavior of the control. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/Funnel-Charts/Appearance.md b/chart-sdk/maui/Funnel-Charts/Appearance.md index 2721a1e05..2c654d352 100644 --- a/chart-sdk/maui/Funnel-Charts/Appearance.md +++ b/chart-sdk/maui/Funnel-Charts/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Funnel Chart control | Syncfusion -description: Learn here all about appearance customization in .NET MAUI Funnel Chart (SfFunnelChart) control, its elements and more. +title: Appearance in .NET MAUI Funnel Chart | Syncfusion® +description: Appearance in .NET MAUI Funnel Chart allows you to customize visuals using colors, palettes and styling options. keywords: maui funnel chart, appearance, palette, gradient, title, customization platform: chart-sdk control: SfFunnelChart @@ -12,7 +12,7 @@ documentation: ug The appearance of the [SfFunnelChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfFunnelChart.html) can be customized by using the custom palettes and gradients that enhance the visual appeal of the application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. ## Add a title diff --git a/chart-sdk/maui/Funnel-Charts/DataLabels.md b/chart-sdk/maui/Funnel-Charts/DataLabels.md index df1f10478..89979d0e5 100644 --- a/chart-sdk/maui/Funnel-Charts/DataLabels.md +++ b/chart-sdk/maui/Funnel-Charts/DataLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Data Labels in .NET MAUI Funnel Chart control | Syncfusion -description: Learn how to configure, customize, and format data labels in the Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) control. +title: Data Labels in .NET MAUI Funnel Chart | Syncfusion® +description: Data Labels in .NET MAUI Funnel Chart display values directly on chart segments, helping users understand and interpret data more effectively. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui funnel chart, data labels, label customization, label placem Data labels are used to display values related to a chart segment. Values from data points (x, y) or other custom properties from a data source can be displayed. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. ## Enable data labels diff --git a/chart-sdk/maui/Funnel-Charts/Exporting.md b/chart-sdk/maui/Funnel-Charts/Exporting.md index 1fbbef4fa..44ab3ee6e 100644 --- a/chart-sdk/maui/Funnel-Charts/Exporting.md +++ b/chart-sdk/maui/Funnel-Charts/Exporting.md @@ -1,7 +1,7 @@ --- layout: post -title: Exporting in .NET MAUI Funnel Chart control | Syncfusion -description: Learn how to export the Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) control as an image and stream. +title: Exporting in .NET MAUI Funnel Chart | Syncfusion® +description: Exporting in .NET MAUI Funnel Chart enables charts to be saved as image files for sharing, reporting, and presentation purposes. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -10,7 +10,7 @@ keywords: .net maui funnel chart, export chart, save image, export stream, png, # Exporting in .NET MAUI Funnel Chart -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. ## Export as an image diff --git a/chart-sdk/maui/Funnel-Charts/Getting-Started.md b/chart-sdk/maui/Funnel-Charts/Getting-Started.md index 258a8a80c..0d30b66bb 100644 --- a/chart-sdk/maui/Funnel-Charts/Getting-Started.md +++ b/chart-sdk/maui/Funnel-Charts/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Funnel Chart control | Syncfusion -description: Learn here all about getting started with Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) control, its elements, and more. +title: Getting Started with .NET MAUI Funnel Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Funnel Chart control. Explore setup, customization, data labels, and visualization features. keywords: maui funnel chart, getting started, setup, project creation, initialization platform: chart-sdk control: SfFunnelChart diff --git a/chart-sdk/maui/Funnel-Charts/Legend.md b/chart-sdk/maui/Funnel-Charts/Legend.md index 735f9650e..0888e248b 100644 --- a/chart-sdk/maui/Funnel-Charts/Legend.md +++ b/chart-sdk/maui/Funnel-Charts/Legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI Funnel Chart control | Syncfusion -description: Learn how to initialize, configure, and customize the legend in Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) control. +title: Legend in .NET MAUI Funnel Chart | Syncfusion® +description: Legend in .NET MAUI Funnel Chart displays chart segment information with customizable styles, helping users identify and understand data categories. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui funnel chart, chart legend, legend wrap, legend view, legend The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) provides a list of data points, helping to identify the corresponding funnel segments in the chart. Here's a detailed guide on how to define and customize the legend in the funnel chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. ## Defining the legend diff --git a/chart-sdk/maui/Funnel-Charts/Liquid-Glass-Effect.md b/chart-sdk/maui/Funnel-Charts/Liquid-Glass-Effect.md index c14b6ec14..97777ce0d 100644 --- a/chart-sdk/maui/Funnel-Charts/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/Funnel-Charts/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Funnel Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) for stunning UI. +title: Liquid Glass Effect in .NET MAUI Funnel Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Funnel Chart applies a sleek glass-like visual style to chart segments, enhancing chart appearance and visual appeal. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -13,7 +13,7 @@ keywords: .net maui funnel chart, glass effect, liquid glass effect, funnel char The Liquid Glass Effect is a modern design style that provides a sleek, minimalist appearance with clean lines, subtle visual effects, and elegant styling. It features smooth rounded corners and sophisticated visual treatments that create a polished, professional look for your charts. > **Prerequisite:** ->- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +>- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. >- To use **SfGlassEffectView**, ensure that the Syncfusion.Maui.Core package is installed and import the Syncfusion.Maui.Core namespace. N> The liquid glass effect is supported with `.NET 10` and on iOS and macOS versions 26 or later. @@ -66,7 +66,7 @@ this.Content = glass; {% endtabs %} -For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/maui/liquid-glass-ui/getting-started). +For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/chart-sdk/maui/liquid-glass-ui/getting-started). ### Enable Liquid Glass Effect for the Tooltip diff --git a/chart-sdk/maui/Funnel-Charts/Orientation.md b/chart-sdk/maui/Funnel-Charts/Orientation.md index 49358a4aa..b772b83ba 100644 --- a/chart-sdk/maui/Funnel-Charts/Orientation.md +++ b/chart-sdk/maui/Funnel-Charts/Orientation.md @@ -1,7 +1,7 @@ --- layout: post -title: Orientation in .NET MAUI Funnel Chart control (Syncfusion) -description: Learn how to change the rendering direction of segments in .NET MAUI Funnel Chart (SfFunnelChart) using the Orientation property. +title: Orientation in .NET MAUI Funnel Chart | Syncfusion® +description: Orientation in .NET MAUI Funnel Chart allows the funnel to be displayed vertically or horizontally, improving layout flexibility and data presentation. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The rendering direction of the funnel chart can be changed using the [Orientation](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfFunnelChart.html#Syncfusion_Maui_Charts_SfFunnelChart_Orientation) property. The default value of this property is `Vertical`, which arranges segments from bottom to top. It can be set to `Horizontal` to render segments from right to left. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Funnel-Charts/Overview.md b/chart-sdk/maui/Funnel-Charts/Overview.md index 2dcba769e..92278d175 100644 --- a/chart-sdk/maui/Funnel-Charts/Overview.md +++ b/chart-sdk/maui/Funnel-Charts/Overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Funnel Chart Control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI Chart(SfFunnelChart) control with key features and more +title: About Syncfusion .NET MAUI Funnel Chart Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Funnel Chart control, including customization options, data labels, legends, and visualization features. platform: chart-sdk control: SfFunnelChart documentation: ug --- -# .NET MAUI Funnel Chart Overview +# About Syncfusion® .NET MAUI Funnel Chart Control Syncfusion® [.NET MAUI Funnel Chart](https://www.syncfusion.com/maui-controls/maui-funnel-charts) (SfFunnelChart) is used to create the beautiful funnel segments to analyze the various stages in a process, which are used in high-quality .NET MAUI applications. @@ -82,16 +82,16 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for visualizing data using line, bar, and other chart types. -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. -- [TreeMap](https://help.syncfusion.com/maui/treemap/overview) for displaying hierarchical and comparative data. -- [Pyramid Charts](https://help.syncfusion.com/maui/pyramid-charts/overview) for hierarchical or comparative data representation. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for visualizing data using line, bar, and other chart types. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. +- [TreeMap](https://help.syncfusion.com/chart-sdk/maui/treemap/overview) for displaying hierarchical and comparative data. +- [Pyramid Charts](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/overview) for hierarchical or comparative data representation. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started) shows a step‑by‑step guide to begin using the Funnel Chart control. -- [Appearance](https://help.syncfusion.com/maui/funnel-charts/appearance) explains how to customize chart appearance and behavior. -- [Data Labels](https://help.syncfusion.com/maui/funnel-charts/datalabels) helps configure data labels and segment display. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started) shows a step‑by‑step guide to begin using the Funnel Chart control. +- [Appearance](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/appearance) explains how to customize chart appearance and behavior. +- [Data Labels](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/datalabels) helps configure data labels and segment display. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/Funnel-Charts/Segment-Spacing.md b/chart-sdk/maui/Funnel-Charts/Segment-Spacing.md index e0e1248b7..afc1637a8 100644 --- a/chart-sdk/maui/Funnel-Charts/Segment-Spacing.md +++ b/chart-sdk/maui/Funnel-Charts/Segment-Spacing.md @@ -1,17 +1,17 @@ --- layout: post -title: Segment spacing in .NET MAUI Funnel Chart control Syncfusion -description: Learn how to set the gap between segments in .NET MAUI Funnel Chart (SfFunnelChart) using the GapRatio property. +title: Segment Spacing in .NET MAUI Funnel Chart | Syncfusion® +description: Segment spacing in .NET MAUI Funnel Chart controls the gap between funnel segments, improving readability and enhancing visual clarity. platform: chart-sdk control: SfFunnelChart documentation: ug --- -# Segment spacing in .NET MAUI Funnel Chart +# Segment Spacing in .NET MAUI Funnel Chart The gap between each segment in the funnel chart can be set using the [GapRatio](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfFunnelChart.html#Syncfusion_Maui_Charts_SfFunnelChart_GapRatio) property. The default value of the [GapRatio](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfFunnelChart.html#Syncfusion_Maui_Charts_SfFunnelChart_GapRatio) property is `0`, and its value ranges from `0` to `1`. This ratio represents the spacing relative to the segment height; a value of `0.2` means the gap is 20% of the segment's height. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Funnel-Charts/Tooltip.md b/chart-sdk/maui/Funnel-Charts/Tooltip.md index d937ad460..ddc46c206 100644 --- a/chart-sdk/maui/Funnel-Charts/Tooltip.md +++ b/chart-sdk/maui/Funnel-Charts/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Funnel Chart control | Syncfusion -description: This section explains about how to enable tooltip and its customization in Syncfusion® .NET MAUI Funnel Chart (SfFunnelChart) control +title: Tooltip in .NET MAUI Funnel Chart | Syncfusion® +description: Tooltip in .NET MAUI Funnel Chart displays detailed information for chart segments on interaction, helping users analyze and understand data easily. platform: chart-sdk control: SfFunnelChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The tooltip provides additional information when hovering over a funnel segment. By default, the segment's Y value will be shown in the tooltip. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/funnel-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Funnel Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/getting-started)** guide. ## Enable Tooltip diff --git a/chart-sdk/maui/Funnel-Charts/migration.md b/chart-sdk/maui/Funnel-Charts/migration.md index 27de1f3f0..52fa2b317 100644 --- a/chart-sdk/maui/Funnel-Charts/migration.md +++ b/chart-sdk/maui/Funnel-Charts/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migration from Xamarin to .NET MAUI Funnel Chart control | Syncfusion -description: This section explains the features available in the .NET MAUI Chart (SfFunnelChart) control over Xamarin SfChart. +title: Migrate Xamarin.Forms SfChart to .NET MAUI Funnel Chart | Syncfusion® +description: Migrate from Xamarin.Forms SfChart to .NET MAUI Funnel Chart with updated APIs, improved performance, and modern funnel visualization features. platform: chart-sdk control: SfFunnelChart documentation: ug --- -# Migrate from Xamarin.Forms SfChart to .NET MAUI SfFunnelChart +# Migrate from Xamarin.Forms SfChart to .NET MAUI Funnel Chart The Funnel Chart was created from scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, minor code changes are required. Additionally, the single [SfChart](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfChart.XForms.SfChart.html) control has been split into five specialized chart controls in .NET MAUI for improved user experience and clarity. diff --git a/chart-sdk/maui/Polar-Charts/Appearance.md b/chart-sdk/maui/Polar-Charts/Appearance.md index c7dcefe82..25f794618 100644 --- a/chart-sdk/maui/Polar-Charts/Appearance.md +++ b/chart-sdk/maui/Polar-Charts/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Polar Chart control | Syncfusion -description: Learn here all about appearance customization in Syncfusion® .NET MAUI Polar Chart (SfPolarChart), including its elements, and more. +title: Appearance in .NET MAUI Polar Chart | Syncfusion® +description: Appearance in .NET MAUI Polar Chart allows customization of chart visuals using colors, palettes and styling options. platform: chart-sdk control: SfPolarChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The appearance of [SfPolarChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html) can be customized using the predefined brushes, custom brushes, and gradient, which allows for the enrichment of the application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Default PaletteBrushes for chart diff --git a/chart-sdk/maui/Polar-Charts/Axis/Axislabels.md b/chart-sdk/maui/Polar-Charts/Axis/Axislabels.md index c768b383b..659c3b52b 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Axislabels.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Axislabels.md @@ -1,17 +1,17 @@ --- layout: post -title: Axis Labels in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about axis labels and their customization in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Axis Labels in .NET MAUI Polar Chart | Syncfusion® +description: Axis labels in .NET MAUI Polar Chart display category and value information along the axes, improving chart readability and data interpretation. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Axis labels in .NET MAUI Polar Chart +# Axis Labels in .NET MAUI Polar Chart Axis labels are used to display the units, measures, or category values of an axis in a user-friendly way. They are generated based on the range and the values bound to the [XBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartSeries.html#Syncfusion_Maui_Charts_ChartSeries_XBindingPath) or [YBindingPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.XYDataSeries.html#Syncfusion_Maui_Charts_XYDataSeries_YBindingPath) properties of the series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Positioning the labels diff --git a/chart-sdk/maui/Polar-Charts/Axis/Axisline.md b/chart-sdk/maui/Polar-Charts/Axis/Axisline.md index cc454dd0b..68641b8ad 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Axisline.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Axisline.md @@ -1,19 +1,19 @@ --- layout: post -title: Axis line in .NET MAUI Polar Chart control | Syncfusion -description: Learn here all about the chart axis line and its customization in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Axis Line in .NET MAUI Polar Chart | Syncfusion® +description: Axis line in .NET MAUI Polar Chart defines the visual representation of chart axes, helping organize data and improve chart readability. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Axis line in .NET MAUI Polar Chart +# Axis Line in .NET MAUI Polar Chart ## Customization The polar chart axis provides support for customizing the style of the axis line by defining the [AxisLineStyle](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_AxisLineStyle) property, as shown in the code sample below. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. N> The customization of axis lines using the `AxisLineStyle` property can only be applied to the secondary axis. diff --git a/chart-sdk/maui/Polar-Charts/Axis/Gridlines.md b/chart-sdk/maui/Polar-Charts/Axis/Gridlines.md index 147b28264..ae466aa46 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Gridlines.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Gridlines.md @@ -1,19 +1,19 @@ --- layout: post -title: Axis Grid Lines in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the chart axis grid lines and their customization in Syncfusion® .NET MAUI Polar Chart (SfPolarChart). +title: Grid Lines in .NET MAUI Polar Chart | Syncfusion® +description: Grid lines in .NET MAUI Polar Chart provide visual references across the plot area, helping improve data readability and value comparison. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Grid lines in .NET MAUI Polar Chart +# Grid Lines in .NET MAUI Polar Chart ## Major grid lines By default, major gridlines are automatically added to the [ChartAxis](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html) at its defined intervals. The visibility of the major gridlines can be controlled using the [ShowMajorGridLines](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_ShowMajorGridLines) property. The default value of [ShowMajorGridLines](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_ShowMajorGridLines) is `true`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Polar-Charts/Axis/Overview.md b/chart-sdk/maui/Polar-Charts/Axis/Overview.md index 0835a99cc..b0af08ff3 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Overview.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Overview.md @@ -1,7 +1,7 @@ --- layout: post -title: About Axis in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the chart axis and its key features in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Axis in .NET MAUI Polar Chart | Syncfusion® +description: Axis in .NET MAUI Polar Chart defines the chart coordinate system and supports customizable labels, lines, ticks, and titles for effective data visualization. platform: chart-sdk control: SfPolarChart documentation: ug diff --git a/chart-sdk/maui/Polar-Charts/Axis/Ticklines.md b/chart-sdk/maui/Polar-Charts/Axis/Ticklines.md index b203e3382..f196c7f4e 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Ticklines.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Ticklines.md @@ -1,19 +1,19 @@ --- layout: post -title: Axis Tick Line in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the chart axis tick lines and their customization in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Tick Lines in .NET MAUI Polar Chart | Syncfusion® +description: Tick lines in .NET MAUI Polar Chart indicate axis intervals, helping users interpret scale values accurately and improve chart readability. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Tick lines in .NET MAUI Polar Chart +# Tick Lines in .NET MAUI Polar Chart Tick lines are the small lines drawn on the axis line to represent the axis labels. By default, tick lines are drawn outside of the axis. Minor tick lines can be added to the axis by defining the [MinorTicksPerInterval](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.RangeAxisBase.html#Syncfusion_Maui_Charts_RangeAxisBase_MinorTicksPerInterval) property. This property adds the minor tick lines to every interval based on the value. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. N> For category axis, minor tick lines are not applicable as it is rendered based on index positions. diff --git a/chart-sdk/maui/Polar-Charts/Axis/Title.md b/chart-sdk/maui/Polar-Charts/Axis/Title.md index e3beea1fc..5c06a554f 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Title.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Title.md @@ -1,17 +1,17 @@ --- layout: post -title: Title for axis in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about chart axis title, title style, title template, and its customization in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart). +title: Axis Title in .NET MAUI Polar Chart | Syncfusion® +description: Axis title in .NET MAUI Polar Chart provides descriptive text for chart axes, helping clarify data context and improve chart understanding. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Axis title in .NET MAUI Polar Chart +# Axis Title in .NET MAUI Polar Chart The [Title](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartAxis.html#Syncfusion_Maui_Charts_ChartAxis_Title) property is used to set the title for the chart axis. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. N> The polar chart supports a title for the secondary axis only. diff --git a/chart-sdk/maui/Polar-Charts/Axis/Types.md b/chart-sdk/maui/Polar-Charts/Axis/Types.md index f5439427b..d28d90cd2 100644 --- a/chart-sdk/maui/Polar-Charts/Axis/Types.md +++ b/chart-sdk/maui/Polar-Charts/Axis/Types.md @@ -1,13 +1,13 @@ --- layout: post -title: Axis types in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about axis types and their features in Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control and more. +title: Types of Axis in .NET MAUI Polar Chart | Syncfusion® +description: Types of axis in .NET MAUI Polar Chart support different axis configurations for representing category, numeric, and date-based data effectively. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Types of axis in .NET MAUI Polar Chart +# Types of Axis in .NET MAUI Polar Chart Polar chart supports the following types of chart axis: @@ -16,7 +16,7 @@ Polar chart supports the following types of chart axis: * DateTimeAxis * DateTimeCategoryAxis -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Numerical axis diff --git a/chart-sdk/maui/Polar-Charts/DataLabels.md b/chart-sdk/maui/Polar-Charts/DataLabels.md index cb34aff62..0f82929b3 100644 --- a/chart-sdk/maui/Polar-Charts/DataLabels.md +++ b/chart-sdk/maui/Polar-Charts/DataLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Data Labels in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about how to configure the data labels and their features in Syncfusion® .NET MAUI Polar Chart (SfPolarChart). +title: Data Labels in .NET MAUI Polar Chart | Syncfusion® +description: Data Labels in .NET MAUI Polar Chart display values directly on data points, helping users understand trends and interpret chart data more effectively. platform: chart-sdk control: SfPolarChart documentation: ug @@ -15,7 +15,7 @@ Each data label can be represented by the following: * Label - displays the segment label content at the (X, Y) point. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Enable Data Labels diff --git a/chart-sdk/maui/Polar-Charts/Exporting.md b/chart-sdk/maui/Polar-Charts/Exporting.md index fa2da8a2c..49f6fa696 100644 --- a/chart-sdk/maui/Polar-Charts/Exporting.md +++ b/chart-sdk/maui/Polar-Charts/Exporting.md @@ -1,7 +1,7 @@ --- layout: post -title: Exporting in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here how to export the chart view as an image and stream in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Exporting in .NET MAUI Polar Chart | Syncfusion® +description: Exporting in .NET MAUI Polar Chart enables charts to be saved as image files for sharing, reporting, and presentation purposes. platform: chart-sdk control: SfPolarChart documentation: ug @@ -13,7 +13,7 @@ documentation: ug You can export the chart view as an image in the desired file format using the [SaveAsImage](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_SaveAsImage_System_String_) method of [SfPolarChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html). The supported image formats are **JPEG and PNG**. By default, if you don't mention any image format with the filename, the chart view will be exported as an image in the PNG format. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. N> The chart view can be exported as an image only when the chart view is added to the visual tree. diff --git a/chart-sdk/maui/Polar-Charts/Getting-Started.md b/chart-sdk/maui/Polar-Charts/Getting-Started.md index 6a1097d7d..2792462c4 100644 --- a/chart-sdk/maui/Polar-Charts/Getting-Started.md +++ b/chart-sdk/maui/Polar-Charts/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Polar Chart Control | Syncfusion -description: This section explains about the getting started with Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Getting Started with .NET MAUI Polar Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Polar Chart control. Explore setup, axis customization, chart types, and visualization features. platform: chart-sdk control: SfPolarChart documentation: ug diff --git a/chart-sdk/maui/Polar-Charts/Legend.md b/chart-sdk/maui/Polar-Charts/Legend.md index 67c481e35..2579f3f93 100644 --- a/chart-sdk/maui/Polar-Charts/Legend.md +++ b/chart-sdk/maui/Polar-Charts/Legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI Polar Chart control | Syncfusion -description: This section explains about how to initialize legend and its customization in Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Legend in .NET MAUI Polar Chart | Syncfusion® +description: Legend in .NET MAUI Polar Chart displays series information with customizable styles, helping users identify and interpret chart data effectively. platform: chart-sdk control: SfPolarChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui polar chart, polar-chart, chart legend, legend-wrap, legend The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) provides a list of polar series, helping to identify the corresponding data series in the chart. Here's a detailed guide on how to define and customize the legend in the polar chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Defining the legend diff --git a/chart-sdk/maui/Polar-Charts/Liquid-Glass-Effect.md b/chart-sdk/maui/Polar-Charts/Liquid-Glass-Effect.md index d2b30134e..c5d4c43c5 100644 --- a/chart-sdk/maui/Polar-Charts/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/Polar-Charts/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Polar Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Polar Chart (SfPolarChart) for stunning UI.. +title: Liquid Glass Effect in .NET MAUI Polar Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Polar Chart applies a sleek glass-like visual style to chart elements, enhancing chart appearance and visual appeal. platform: chart-sdk control: SfPolarChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui chart, cupertino theme, glass effect, maui cupertino chart, The Liquid Glass Effect is a modern design style that provides a sleek, minimalist appearance with clean lines, subtle visual effects, and elegant styling. It features smooth rounded corners and sophisticated visual treatments that create a polished, professional look for your charts. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. N> The liquid glass effect is supported only on `.NET 10` and on `iOS` and `macOS` versions 26 or later @@ -71,7 +71,7 @@ var glass = new SfGlassEffectView {% endtabs %} -For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/maui/liquid-glass-ui/getting-started). +For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/chart-sdk/maui/liquid-glass-ui/getting-started). ### Enable Liquid Glass Effect to SfPolarChart Tooltip diff --git a/chart-sdk/maui/Polar-Charts/Overview.md b/chart-sdk/maui/Polar-Charts/Overview.md index 3fce43d98..945ad114d 100644 --- a/chart-sdk/maui/Polar-Charts/Overview.md +++ b/chart-sdk/maui/Polar-Charts/Overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the introduction of Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control with key features and more. +title: About Syncfusion .NET MAUI Polar Chart Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Polar Chart control, including axis customization, data labels, legends, and visualization features. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Overview of .NET MAUI Polar Chart +# About Syncfusion® .NET MAUI Polar Chart Control The Syncfusion® [.NET MAUI Polar Chart](https://www.syncfusion.com/maui-controls/maui-polar-charts) allows for the creation of visually stunning polar series for data visualization in high-quality applications. This chart type, commonly known as a radar or spider chart, effectively represents data in terms of values and angles. @@ -83,15 +83,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for visualizing data using line, column, and bar charts. -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. -- [Funnel Charts](https://help.syncfusion.com/maui/funnel-charts/overview) for visualizing process stages and conversion flows. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for visualizing data using line, column, and bar charts. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. +- [Funnel Charts](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/overview) for visualizing process stages and conversion flows. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started) shows a step‑by‑step guide to begin using the Polar Chart control. -- [Chart Types](https://help.syncfusion.com/maui/polar-charts/polararea) explores different polar chart types. -- [Customization](https://help.syncfusion.com/maui/polar-charts/appearance) explains how to customize appearance and interaction settings. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started) shows a step‑by‑step guide to begin using the Polar Chart control. +- [Chart Types](https://help.syncfusion.com/chart-sdk/maui/polar-charts/polararea) explores different polar chart types. +- [Customization](https://help.syncfusion.com/chart-sdk/maui/polar-charts/appearance) explains how to customize appearance and interaction settings. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/Polar-Charts/PolarArea.md b/chart-sdk/maui/Polar-Charts/PolarArea.md index 5dd808222..0618dda1e 100644 --- a/chart-sdk/maui/Polar-Charts/PolarArea.md +++ b/chart-sdk/maui/Polar-Charts/PolarArea.md @@ -1,7 +1,7 @@ --- layout: post -title: Polar Area Chart in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the Polar area chart type and its features in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Polar Area Chart in .NET MAUI Polar Chart | Syncfusion® +description: Polar Area Chart in .NET MAUI Polar Chart displays data as proportional segments in a polar coordinate system, enabling effective comparison of values. platform: chart-sdk control: SfPolarChart documentation: ug @@ -13,7 +13,7 @@ documentation: ug To display an area series in a polar chart, instantiate the [PolarAreaSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PolarAreaSeries.html) and include it in the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html#Syncfusion_Maui_Charts_SfPolarChart_Series) collection property of [SfPolarChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Polar-Charts/PolarLine.md b/chart-sdk/maui/Polar-Charts/PolarLine.md index 3220ef3d2..4743cd2d7 100644 --- a/chart-sdk/maui/Polar-Charts/PolarLine.md +++ b/chart-sdk/maui/Polar-Charts/PolarLine.md @@ -1,7 +1,7 @@ --- layout: post -title: Polar Line Chart in .NET MAUI Polar Chart Control | Syncfusion -description: Learn here all about the Polar line chart type and its features in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Polar Line Chart in .NET MAUI Polar Chart | Syncfusion® +description: Polar Line Chart in .NET MAUI Polar Chart connects data points using lines in a polar coordinate system, helping visualize trends and patterns effectively. platform: chart-sdk control: SfPolarChart documentation: ug @@ -13,7 +13,7 @@ documentation: ug To display a line series in a polar chart, instantiate the [PolarLineSeries](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.PolarLineSeries.html) and include it in the [Series](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html#Syncfusion_Maui_Charts_SfPolarChart_Series) collection property of [SfPolarChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPolarChart.html). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Polar-Charts/RenderingPosition.md b/chart-sdk/maui/Polar-Charts/RenderingPosition.md index c65698f23..b56305d44 100644 --- a/chart-sdk/maui/Polar-Charts/RenderingPosition.md +++ b/chart-sdk/maui/Polar-Charts/RenderingPosition.md @@ -1,7 +1,7 @@ --- layout: post -title: Rendering Position in .NET MAUI Polar Chart control | Syncfusion -description: Learn here all about the rendering position of the axis in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Rendering Position in .NET MAUI Polar Chart | Syncfusion® +description: Rendering position in .NET MAUI Polar Chart controls how series are placed relative to axis intervals, improving data presentation and chart readability. platform: chart-sdk control: SfPolarChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The rendering position in a .NET MAUI Polar Chart defines the starting angle from which the chart series is drawn on the polar coordinate system. By adjusting the rendering position, you can rotate the entire chart visualization to start from different angular points (0°, 90°, 180°, or 270°). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Start Angle diff --git a/chart-sdk/maui/Polar-Charts/Tooltip.md b/chart-sdk/maui/Polar-Charts/Tooltip.md index 5af55ece0..04c13d419 100644 --- a/chart-sdk/maui/Polar-Charts/Tooltip.md +++ b/chart-sdk/maui/Polar-Charts/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Polar Chart control | Syncfusion -description: Learn here all about how to enable tooltips and customize them in the Syncfusion® .NET MAUI Polar Chart (SfPolarChart) control. +title: Tooltip in .NET MAUI Polar Chart | Syncfusion® +description: Tooltip in .NET MAUI Polar Chart displays detailed information for data points on interaction, helping users analyze and understand chart data easily. platform: chart-sdk control: SfPolarChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug A tooltip is used to display information or metadata of the tapped segment. The Polar chart provides tooltip support for all series. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/polar-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfPolarChart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/polar-charts/getting-started)** guide. ## Define Tooltip diff --git a/chart-sdk/maui/Polar-Charts/migration.md b/chart-sdk/maui/Polar-Charts/migration.md index 0bcd975d9..91907be8e 100644 --- a/chart-sdk/maui/Polar-Charts/migration.md +++ b/chart-sdk/maui/Polar-Charts/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migration from Xamarin to .NET MAUI Polar Chart control | Syncfusion -description: Learn here all about the features available in the .NET MAUI Polar Chart (SfPolarChart) control over Xamarin SfChart. +title: Migrate Xamarin.Forms SfChart to .NET MAUI Polar Chart | Syncfusion® +description: Migrate from Xamarin.Forms SfChart to .NET MAUI Polar Chart with updated APIs, improved performance, and modern features for polar data visualization. platform: chart-sdk control: SfPolarChart documentation: ug --- -# Migrate from Xamarin.Forms SfChart to .NET MAUI SfPolarChart +# Migrate from Xamarin.Forms SfChart to .NET MAUI Polar Chart The Polar Chart was created from the scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, a minor code change is required. In addition, [SfChart](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfChart.XForms.SfChart.html) has been divided into five chart controls in .NET MAUI for a better user experience and understanding. diff --git a/chart-sdk/maui/Pyramid-Charts/Appearance.md b/chart-sdk/maui/Pyramid-Charts/Appearance.md index e162a2f28..48e7b454d 100644 --- a/chart-sdk/maui/Pyramid-Charts/Appearance.md +++ b/chart-sdk/maui/Pyramid-Charts/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Pyramid Chart control | Syncfusion -description: Learn here all about appearance customization in .NET MAUI Pyramid Chart (SfPyramidChart) control, its elements and more. +title: Appearance in .NET MAUI Pyramid Chart | Syncfusion® +description: Appearance in .NET MAUI Pyramid Chart allows you to customize visuals using colors, palettes and styling options. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -12,7 +12,7 @@ keywords: maui pyramid chart, appearance, palette, gradient, title, customizatio The appearance of the [SfPyramidChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPyramidChart.html) can be customized by using the custom palettes and gradients that enhance the visual appeal of the application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. ## Add a title diff --git a/chart-sdk/maui/Pyramid-Charts/DataLabels.md b/chart-sdk/maui/Pyramid-Charts/DataLabels.md index a67636fe7..48247e3d6 100644 --- a/chart-sdk/maui/Pyramid-Charts/DataLabels.md +++ b/chart-sdk/maui/Pyramid-Charts/DataLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Data Labels in .NET MAUI Pyramid Chart control | Syncfusion -description: Learn how to configure, customize, and format data labels in the Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) control. +title: Data Labels in .NET MAUI Pyramid Chart | Syncfusion® +description: Data Labels in .NET MAUI Pyramid Chart display values directly on chart segments, helping users understand and interpret data more effectively. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui pyramid chart, data labels, label customization, label place Data labels are used to display values related to a chart segment. Values from data points (x, y) or other custom properties from a data source can be displayed. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. ## Enable data labels diff --git a/chart-sdk/maui/Pyramid-Charts/Exporting.md b/chart-sdk/maui/Pyramid-Charts/Exporting.md index 5494e4847..8adfa280a 100644 --- a/chart-sdk/maui/Pyramid-Charts/Exporting.md +++ b/chart-sdk/maui/Pyramid-Charts/Exporting.md @@ -1,7 +1,7 @@ --- layout: post -title: Exporting in .NET MAUI Pyramid Chart control | Syncfusion -description: Learn how to export the Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) control as an image and stream. +title: Exporting in .NET MAUI Pyramid Chart | Syncfusion® +description: Exporting in .NET MAUI Pyramid Chart enables you to save charts as image files for sharing, reporting, and presentation purposes. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -10,7 +10,7 @@ keywords: .net maui pyramid chart, export chart, save image, export stream, png, # Exporting in .NET MAUI Pyramid Chart -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. ## Export as an image diff --git a/chart-sdk/maui/Pyramid-Charts/Getting-Started.md b/chart-sdk/maui/Pyramid-Charts/Getting-Started.md index e703448c5..a88d119a2 100644 --- a/chart-sdk/maui/Pyramid-Charts/Getting-Started.md +++ b/chart-sdk/maui/Pyramid-Charts/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Pyramid Chart control | Syncfusion -description: Learn here all about getting started with Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) control, its elements, and more. +title: Getting Started with .NET MAUI Pyramid Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Pyramid Chart control. Explore setup, customization, data labels, and visualization features. keywords: maui pyramid chart, getting started, setup, project creation, initialization platform: chart-sdk control: SfPyramidChart diff --git a/chart-sdk/maui/Pyramid-Charts/Legend.md b/chart-sdk/maui/Pyramid-Charts/Legend.md index 84add2cf0..c4827f450 100644 --- a/chart-sdk/maui/Pyramid-Charts/Legend.md +++ b/chart-sdk/maui/Pyramid-Charts/Legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI Pyramid Chart control | Syncfusion -description: This section explains how to initialize legend and customize it in Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) control. +title: Legend in .NET MAUI Pyramid Chart | Syncfusion® +description: Legend in .NET MAUI Pyramid Chart displays chart segment information with customizable styles, helping users identify and understand data categories. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui pyramid chart, legend, chart legend, legend items, legend cu The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.ChartBase.html#Syncfusion_Maui_Charts_ChartBase_Legend) provides a list of data points, helping to identify the corresponding pyramid segments in the chart. Here is a detailed guide on how to define and customize the legend in the pyramid chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. ## Defining the legend diff --git a/chart-sdk/maui/Pyramid-Charts/Liquid-Glass-Effect.md b/chart-sdk/maui/Pyramid-Charts/Liquid-Glass-Effect.md index 3460f7733..5b9e5dbbd 100644 --- a/chart-sdk/maui/Pyramid-Charts/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/Pyramid-Charts/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Pyramid Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) for stunning UI. +title: Liquid Glass Effect in .NET MAUI Pyramid Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Pyramid Chart applies a sleek glass-like visual style to chart segments, enhancing chart appearance and user experience. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -13,7 +13,7 @@ keywords: .net maui pyramid chart, glass effect, liquid glass effect, pyramid ch The Liquid Glass Effect is a modern design style that provides a sleek, minimalist appearance with clean lines, subtle visual effects, and elegant styling. It features smooth rounded corners and sophisticated visual treatments that create a polished, professional look for your charts. N> **Prerequisite:** -- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. - To use **SfGlassEffectView**, ensure that the Syncfusion.Maui.Core package is installed and import the Syncfusion.Maui.Core namespace. N> The liquid glass effect is supported with `.NET 10` and on iOS and macOS versions 26 or later. @@ -66,7 +66,7 @@ this.Content = glass; {% endtabs %} -For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/maui/liquid-glass-ui/getting-started). +For detailed guidance on [SfGlassEffectView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Core.SfGlassEffectView.html), refer to the Getting Started [documentation](https://help.syncfusion.com/chart-sdk/maui/liquid-glass-ui/getting-started). ### Enable Liquid Glass Effect for the Tooltip diff --git a/chart-sdk/maui/Pyramid-Charts/Orientation.md b/chart-sdk/maui/Pyramid-Charts/Orientation.md index 825e47a9a..f97ebfb54 100644 --- a/chart-sdk/maui/Pyramid-Charts/Orientation.md +++ b/chart-sdk/maui/Pyramid-Charts/Orientation.md @@ -1,7 +1,7 @@ --- layout: post -title: Orientation in .NET MAUI Pyramid Chart control (Syncfusion) -description: Learn how to change the rendering direction of segments in .NET MAUI Pyramid Chart (SfPyramidChart) using the Orientation property. +title: Orientation in .NET MAUI Pyramid Chart | Syncfusion® +description: Orientation in .NET MAUI Pyramid Chart allows you to display the pyramid vertically or horizontally, improving layout flexibility and data presentation. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The rendering direction of the pyramid chart can be changed using the [Orientation](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPyramidChart.html#Syncfusion_Maui_Charts_SfPyramidChart_Orientation) property. The default value of this property is `Vertical`, which arranges segments from top to bottom. It can be set to `Horizontal` to render segments from right to left. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Pyramid-Charts/Overview.md b/chart-sdk/maui/Pyramid-Charts/Overview.md index bed8c695c..20be8ea4e 100644 --- a/chart-sdk/maui/Pyramid-Charts/Overview.md +++ b/chart-sdk/maui/Pyramid-Charts/Overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Pyramid Chart Control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI Chart(SfPyramidChart) control with key features and more. +title: About Syncfusion .NET MAUI Pyramid Chart Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Pyramid Chart control, including customization options, data labels, legends, and visualization features. platform: chart-sdk control: SfPyramidChart documentation: ug --- -# .NET MAUI Pyramid Chart Overview +# About Syncfusion® .NET MAUI Pyramid Chart Control Syncfusion® .NET MAUI Chart ([SfPyramidChart]((https://www.syncfusion.com/maui-controls/maui-pyramid-charts))) is used to create the beautiful pyramid segments to visualize the proportions of a total in hierarchies, which are used in high-quality .NET MAUI applications. As a single series chart without an axis. Data is shown as percentages of a total (The sum of the parts makes up the whole). @@ -82,15 +82,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Funnel Charts](https://help.syncfusion.com/maui/funnel-charts/overview) for visualizing process stages and conversion flows using funnel charts. -- [Circular Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for representing proportional data using pie and doughnut charts. -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/getting-started) for visualizing data trends and comparisons using axis-based charts. +- [Funnel Charts](https://help.syncfusion.com/chart-sdk/maui/funnel-charts/overview) for visualizing process stages and conversion flows using funnel charts. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for representing proportional data using pie and doughnut charts. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/getting-started) for visualizing data trends and comparisons using axis-based charts. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started) shows a step‑by‑step guide to begin using the Pyramid Chart control. -- [Customization](https://help.syncfusion.com/maui/pyramid-charts/appearance) explains how to customize chart appearance and behavior. -- [Labels](https://help.syncfusion.com/maui/pyramid-charts/datalabels) helps configure data labels and segment details. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started) shows a step‑by‑step guide to begin using the Pyramid Chart control. +- [Customization](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/appearance) explains how to customize chart appearance and behavior. +- [Labels](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/datalabels) helps configure data labels and segment details. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/Pyramid-Charts/Segment-Spacing.md b/chart-sdk/maui/Pyramid-Charts/Segment-Spacing.md index d564ae2c7..79fa65b23 100644 --- a/chart-sdk/maui/Pyramid-Charts/Segment-Spacing.md +++ b/chart-sdk/maui/Pyramid-Charts/Segment-Spacing.md @@ -1,17 +1,17 @@ --- layout: post -title: Segment spacing in .NET MAUI Pyramid Chart control (Syncfusion) -description: Learn how to set the gap between segments in .NET MAUI Pyramid Chart (SfPyramidChart) using the GapRatio property. +title: Segment Spacing in .NET MAUI Pyramid Chart | Syncfusion® +description: Segment spacing in .NET MAUI Pyramid Chart lets you control the gap between pyramid segments, improving chart readability and visual clarity. platform: chart-sdk control: SfPyramidChart documentation: ug --- -# Segment spacing in .NET MAUI Pyramid Chart +# Segment Spacing in .NET MAUI Pyramid Chart The gap between each segment in the pyramid chart can be set using the [GapRatio](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPyramidChart.html#Syncfusion_Maui_Charts_SfPyramidChart_GapRatio) property. The default value of the [GapRatio](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Charts.SfPyramidChart.html#Syncfusion_Maui_Charts_SfPyramidChart_GapRatio) property is `0`, and its value ranges from `0` to `1`. This ratio represents the spacing relative to the segment height; a value of `0.2` means the gap is 20% of the segment's height. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/Pyramid-Charts/Tooltip.md b/chart-sdk/maui/Pyramid-Charts/Tooltip.md index df52262a0..0ac49a5f2 100644 --- a/chart-sdk/maui/Pyramid-Charts/Tooltip.md +++ b/chart-sdk/maui/Pyramid-Charts/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Pyramid Chart control | Syncfusion -description: This section explains how to enable and customize the tooltip in Syncfusion® .NET MAUI Pyramid Chart (SfPyramidChart) control +title: Tooltip in .NET MAUI Pyramid Chart | Syncfusion® +description: Tooltip in .NET MAUI Pyramid Chart displays detailed information for chart segments on interaction, helping users analyze and understand data easily. platform: chart-sdk control: SfPyramidChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The tooltip provides additional information when hovering over a pyramid segment. By default, the segment's Y value will be shown in the tooltip. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/pyramid-charts/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Pyramid Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/pyramid-charts/getting-started)** guide. ## Enable Tooltip diff --git a/chart-sdk/maui/Pyramid-Charts/migration.md b/chart-sdk/maui/Pyramid-Charts/migration.md index b4502a2cc..8eb2b4fc3 100644 --- a/chart-sdk/maui/Pyramid-Charts/migration.md +++ b/chart-sdk/maui/Pyramid-Charts/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migration from Xamarin to .NET MAUI Pyramid Chart control | Syncfusion -description: This section explains the features available in the .NET MAUI Pyramid Chart (SfPyramidChart) control over Xamarin SfChart. +title: Migrate Xamarin.Forms SfChart to .NET MAUI Pyramid Chart | Syncfusion® +description: Migrate from Xamarin.Forms SfChart to .NET MAUI Pyramid Chart with updated APIs, improved performance, and modern features for pyramid data visualization. platform: chart-sdk control: SfPyramidChart documentation: ug --- -# Migrate from Xamarin.Forms SfChart to .NET MAUI SfPyramidChart +# Migrate from Xamarin.Forms SfChart to .NET MAUI Pyramid Chart The Pyramid Chart was created from scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, minor code changes are required. Additionally, the single [SfChart](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfChart.XForms.SfChart.html) control has been split into five specialized chart controls in .NET MAUI for improved user experience and clarity. diff --git a/chart-sdk/maui/SunburstChart/Appearance.md b/chart-sdk/maui/SunburstChart/Appearance.md index fb990dd0e..754e78359 100644 --- a/chart-sdk/maui/SunburstChart/Appearance.md +++ b/chart-sdk/maui/SunburstChart/Appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Appearance in .NET MAUI Sunburst Chart control | Syncfusion -description: Learn here all about Sunburst Chart appearance customization in Syncfusion® .NET MAUI Sunburst Chart control. +title: Appearance in .NET MAUI Sunburst Chart | Syncfusion® +description: Appearance in .NET MAUI Sunburst Chart allows customization of chart visuals using colors, palettes and styling options. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The appearance of the [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html) can be customized using properties such as Title, Angle, Radius, Inner radius, and Stroke, which allow you to enhance the visual presentation of your application. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Add a Title The title of the sunburst chart provides quick information to the user about the data being plotted in the chart. The [Title](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_Title) property accepts a `View` and is used to set a title for the sunburst chart. The following example uses a `Label` as the title within a `ContentPage`. diff --git a/chart-sdk/maui/SunburstChart/CenterView.md b/chart-sdk/maui/SunburstChart/CenterView.md index 08141942b..44fe906f2 100644 --- a/chart-sdk/maui/SunburstChart/CenterView.md +++ b/chart-sdk/maui/SunburstChart/CenterView.md @@ -1,17 +1,17 @@ --- layout: post -title: Center view in .NET MAUI Sunburst Chart control | Syncfusion -description: This section explains how to add a center view in the Syncfusion® .NET MAUI Sunburst Chart control. +title: Center View in .NET MAUI Sunburst Chart | Syncfusion® +description: Center view in .NET MAUI Sunburst Chart displays custom content at the chart center, providing additional context and enhancing data presentation. platform: chart-sdk control: SfSunburstChart documentation: ug --- -# Center view in .NET MAUI Sunburst Chart +# Center View in .NET MAUI Sunburst Chart Any view can be added to the center of the sunburst chart using the [CenterView](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_CenterView) property of [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html). The view placed in the center of the chart is useful for displaying summary or contextual information about the sunburst chart. The binding context of the CenterView is the `SfSunburstChart` instance, so any binding in the CenterView resolves against the chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Add a center view diff --git a/chart-sdk/maui/SunburstChart/DataLabels.md b/chart-sdk/maui/SunburstChart/DataLabels.md index 7da71a0aa..c30a96222 100644 --- a/chart-sdk/maui/SunburstChart/DataLabels.md +++ b/chart-sdk/maui/SunburstChart/DataLabels.md @@ -1,7 +1,7 @@ --- layout: post -title: Data label in .NET MAUI Sunburst Chart control | Syncfusion -description: This section explains about how to configure the data labels and its features in .NET MAUI Sunburst Chart. +title: Data Labels in .NET MAUI Sunburst Chart | Syncfusion® +description: Data Labels in .NET MAUI Sunburst Chart display values directly on chart segments, helping users understand hierarchical data more effectively. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -11,11 +11,11 @@ documentation: ug Data labels are used to display information about segments of the sunburst chart. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Enable Data Labels -Data labels are enabled and disabled using the [ShowLabels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ShowLabels) property. The default value of the ShowLabels property is `False`. For data labels to appear, the chart must also be bound to data via the [ItemsSource](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ItemsSource), [ValueMemberPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ValueMemberPath), and [Levels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_Levels) properties. See the [Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started) topic for setup details. +Data labels are enabled and disabled using the [ShowLabels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ShowLabels) property. The default value of the ShowLabels property is `False`. For data labels to appear, the chart must also be bound to data via the [ItemsSource](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ItemsSource), [ValueMemberPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ValueMemberPath), and [Levels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_Levels) properties. See the [Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started) topic for setup details. The following code explains how to enable data labels. diff --git a/chart-sdk/maui/SunburstChart/DrillDown.md b/chart-sdk/maui/SunburstChart/DrillDown.md index 9c9c98659..4bac36e0b 100644 --- a/chart-sdk/maui/SunburstChart/DrillDown.md +++ b/chart-sdk/maui/SunburstChart/DrillDown.md @@ -1,7 +1,7 @@ --- layout: post -title: Drill Down in .NET MAUI Sunburst Chart control | Syncfusion -description: This section explains how to enable and customize drill-down toolbar in the Syncfusion® .NET MAUI Sunburst Chart control. +title: Drill Down in .NET MAUI Sunburst Chart | Syncfusion® +description: Drill Down in .NET MAUI Sunburst Chart enables interactive navigation through hierarchical data, allowing deeper exploration of chart segments and levels. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug Drill-down provides better visualization of hierarchical data by allowing large datasets to be visualized as simplified views. Users can drill down into each segment level. The Sunburst Chart provides animation along with drill-down support. Double-tapping (or double-clicking) a segment initiates the drill-down operation. A toolbar is enabled during drill-down, allowing zoom-back and reset operations. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Enable Drill Down diff --git a/chart-sdk/maui/SunburstChart/Getting-Started.md b/chart-sdk/maui/SunburstChart/Getting-Started.md index bde931647..a56f6085f 100644 --- a/chart-sdk/maui/SunburstChart/Getting-Started.md +++ b/chart-sdk/maui/SunburstChart/Getting-Started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Sunburst Chart control | Syncfusion -description: Learn here all about getting started with Syncfusion® .NET MAUI Sunburst Chart control, its elements, and more. +title: Getting Started with .NET MAUI Sunburst Chart | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Sunburst Chart control. Explore setup, drill-down, customization, and data visualization features. platform: chart-sdk control: SfSunburstChart documentation: ug diff --git a/chart-sdk/maui/SunburstChart/Legend.md b/chart-sdk/maui/SunburstChart/Legend.md index df417d539..0c926f34c 100644 --- a/chart-sdk/maui/SunburstChart/Legend.md +++ b/chart-sdk/maui/SunburstChart/Legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI Sunburst Chart control | Syncfusion -description: Learn here all about Legend in Syncfusion® .NET MAUI Sunburst Chart control, its elements, and more. +title: Legend in .NET MAUI Sunburst Chart | Syncfusion® +description: Legend in .NET MAUI Sunburst Chart displays chart segment information with customizable styles, helping users identify and interpret hierarchical data. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug The legend provides information about the data points (segments) displayed in the sunburst chart. The [Legend](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_Legend) property of the [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html) is used to enable the legend. By default, this property is `null`. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Enable a Legend diff --git a/chart-sdk/maui/SunburstChart/Liquid-Glass-Effect.md b/chart-sdk/maui/SunburstChart/Liquid-Glass-Effect.md index 2d62b3508..083f0c589 100644 --- a/chart-sdk/maui/SunburstChart/Liquid-Glass-Effect.md +++ b/chart-sdk/maui/SunburstChart/Liquid-Glass-Effect.md @@ -1,7 +1,7 @@ --- layout: post -title: Liquid Glass Effect in .NET MAUI Sunburst Chart control | Syncfusion -description: Learn how to enable and customize the Liquid Glass visual effect in Syncfusion® .NET MAUI Sunburst Chart (SfSunburstChart) for stunning UI. +title: Liquid Glass Effect in .NET MAUI Sunburst Chart | Syncfusion® +description: Liquid Glass Effect in .NET MAUI Sunburst Chart applies a sleek glass-like visual style to chart segments, enhancing chart appearance and visual appeal. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -14,7 +14,7 @@ The liquid glass effect is a modern design style that provides a sleek, minimali N> **Prerequisite:** -- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +- Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. - To use **SfGlassEffectView**, ensure that the Syncfusion.Maui.Core package is installed and import the Syncfusion.Maui.Core namespace. N> The liquid glass effect is supported only on `.NET 10` and on `iOS 26` and `macOS 26` or later. Enabling these properties on other platforms (such as Windows or Android) has no effect; the chart renders normally without the glass appearance. diff --git a/chart-sdk/maui/SunburstChart/Migration.md b/chart-sdk/maui/SunburstChart/Migration.md index 2fc5941d9..0a4be2568 100644 --- a/chart-sdk/maui/SunburstChart/Migration.md +++ b/chart-sdk/maui/SunburstChart/Migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Xamarin to .NET MAUI Sunburst Chart Migration | Syncfusion -description: This section explains the .NET MAUI SfSunburstChart features relative to the Xamarin SfSunburstChart control. +title: Migrate Xamarin.Forms Sunburst to .NET MAUI Sunburst | Syncfusion® +description: Migrate from Xamarin.Forms Sunburst Chart to .NET MAUI Sunburst Chart with updated APIs, improved performance, and modern hierarchical visualization features. platform: chart-sdk control: SfSunburstChart documentation: ug --- -# Migrate from Xamarin.Forms SunburstChart to .NET MAUI SunburstChart +# Migrate from Xamarin.Forms Sunburst Chart to .NET MAUI Sunburst Chart The SfSunburstChart was created from scratch using the upgraded APIs and performance of the .NET MAUI graphics library and framework layouts. However, to maintain API naming consistency in .NET MAUI SfSunburstChart, we renamed some of the APIs. The changes in APIs from Xamarin SfSunburstChart to .NET MAUI SfSunburstChart are detailed below. @@ -584,7 +584,7 @@ this.Content = sunburstChart; ### Selection -Selection in Xamarin was enabled by assigning a [SunburstSelectionSettings](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) instance to the chart. In .NET MAUI, the [SelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_SelectionSettings) property of [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html) accepts the [SunburstSelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html) class. The [SelectionType](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) property in Xamarin is renamed to [Type](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html#Syncfusion_Maui_SunburstChart_SunburstSelectionSettings_Type), and the [SelectionMode](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) property is renamed to [DisplayMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html#Syncfusion_Maui_SunburstChart_SunburstSelectionSettings_DisplayMode). For the full list of selection APIs, refer to the [Selection](https://help.syncfusion.com/maui/sunburstchart/selection) topic. +Selection in Xamarin was enabled by assigning a [SunburstSelectionSettings](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) instance to the chart. In .NET MAUI, the [SelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_SelectionSettings) property of [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html) accepts the [SunburstSelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html) class. The [SelectionType](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) property in Xamarin is renamed to [Type](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html#Syncfusion_Maui_SunburstChart_SunburstSelectionSettings_Type), and the [SelectionMode](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfSunburstChart.XForms.SunburstSelectionSettings.html) property is renamed to [DisplayMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html#Syncfusion_Maui_SunburstChart_SunburstSelectionSettings_DisplayMode). For the full list of selection APIs, refer to the [Selection](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/selection) topic. @@ -698,7 +698,7 @@ this.Content = sunburstChart;
### Drill down -Drill down in Xamarin was enabled by setting the `EnableDrillDown` property. In .NET MAUI, the [EnableDrillDown](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_EnableDrillDown) property enables the same feature, and the drill-down toolbar appearance and position can be customized using the [ToolbarSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ToolbarSettings) property of [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html). For the full list of drill-down APIs, refer to the [Drill Down](https://help.syncfusion.com/maui/sunburstchart/drilldown) topic. +Drill down in Xamarin was enabled by setting the `EnableDrillDown` property. In .NET MAUI, the [EnableDrillDown](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_EnableDrillDown) property enables the same feature, and the drill-down toolbar appearance and position can be customized using the [ToolbarSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ToolbarSettings) property of [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html). For the full list of drill-down APIs, refer to the [Drill Down](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/drilldown) topic. diff --git a/chart-sdk/maui/SunburstChart/Overview.md b/chart-sdk/maui/SunburstChart/Overview.md index 976f4c328..e493b2469 100644 --- a/chart-sdk/maui/SunburstChart/Overview.md +++ b/chart-sdk/maui/SunburstChart/Overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Sunburst Chart Control | Syncfusion -description: Learn here all about introduction of Syncfusion® .NET MAUI SunburstChart control with key features and more +title: About Syncfusion® .NET MAUI Sunburst Chart Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Sunburst Chart control, including drill-down, customization, and data visualization features. platform: chart-sdk control: SfSunburstChart documentation: ug --- -# .NET MAUI Sunburst Chart Overview +# About Syncfusion® .NET MAUI Sunburst Chart Control The Syncfusion® .NET MAUI Sunburst Chart ([SfSunburstChart](https://www.syncfusion.com/maui-controls/maui-sunburst-charts)) is used to visualize hierarchical data structures. The chart organizes data in multiple levels, where each level represents a different category or subcategory. This visualization helps users understand relationships and dependencies within the data in an intuitive and user-friendly way. @@ -86,15 +86,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [TreeMap](https://help.syncfusion.com/maui/treemap/overview) for visualizing hierarchical data using rectangular layouts. -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for visualizing tabular data trends and comparisons. +- [TreeMap](https://help.syncfusion.com/chart-sdk/maui/treemap/overview) for visualizing hierarchical data using rectangular layouts. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for representing proportional data using pie and doughnut charts. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for visualizing tabular data trends and comparisons. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started) shows a step‑by‑step guide to begin using the Sunburst Chart control. -- [Appearance](https://help.syncfusion.com/maui/sunburstchart/appearance) explains how to customize chart appearance and styling. -- [Labels](https://help.syncfusion.com/maui/sunburstchart/datalabels) helps configure data labels and segment display. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started) shows a step‑by‑step guide to begin using the Sunburst Chart control. +- [Appearance](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/appearance) explains how to customize chart appearance and styling. +- [Labels](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/datalabels) helps configure data labels and segment display. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/SunburstChart/Selection.md b/chart-sdk/maui/SunburstChart/Selection.md index b212de2c7..12c06003e 100644 --- a/chart-sdk/maui/SunburstChart/Selection.md +++ b/chart-sdk/maui/SunburstChart/Selection.md @@ -1,7 +1,7 @@ --- layout: post -title: Selection in .NET MAUI Sunburst Chart control | Syncfusion -description: This section explains how to enable and customize selection in the Syncfusion® .NET MAUI Sunburst Chart control. +title: Selection in .NET MAUI Sunburst Chart | Syncfusion® +description: Selection in .NET MAUI Sunburst Chart allows chart segments to be highlighted on interaction, improving data analysis and visual exploration. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -10,7 +10,7 @@ documentation: ug The Sunburst Chart supports segment selection and visual highlighting. Selection is triggered by tapping (touch) or clicking (mouse) a segment, enabling users to interact with hierarchical data. Selection requires the chart to be bound to data via the [ItemsSource](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ItemsSource), [ValueMemberPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_ValueMemberPath), and [Levels](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_Levels) properties. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. To enable selection, create an instance of the [SunburstSelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SunburstSelectionSettings.html) class and assign it to the [SelectionSettings](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html#Syncfusion_Maui_SunburstChart_SfSunburstChart_SelectionSettings) property of the [SfSunburstChart](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.SunburstChart.SfSunburstChart.html). The `Type` and `DisplayMode` properties of `SunburstSelectionSettings` are independent and can be combined. diff --git a/chart-sdk/maui/SunburstChart/Tooltip.md b/chart-sdk/maui/SunburstChart/Tooltip.md index 29ddc577b..1e0a18c75 100644 --- a/chart-sdk/maui/SunburstChart/Tooltip.md +++ b/chart-sdk/maui/SunburstChart/Tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Sunburst Chart control | Syncfusion -description: This section explains how to enable and customize tooltips in the Syncfusion® .NET MAUI Sunburst Chart control. +title: Tooltip in .NET MAUI Sunburst Chart | Syncfusion® +description: Tooltip in .NET MAUI Sunburst Chart displays detailed information for chart segments on interaction, helping users analyze and understand hierarchical data. platform: chart-sdk control: SfSunburstChart documentation: ug @@ -11,7 +11,7 @@ documentation: ug Tooltips provide additional information about segments in the sunburst chart. A tooltip is displayed when a segment is tapped or clicked. By default, the tooltip displays the corresponding segment's category (from the `Levels` group property) and value (from the `ValueMemberPath` property). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/sunburstchart/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Sunburst Chart** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/getting-started)** guide. ## Enable tooltip diff --git a/chart-sdk/maui/barcode-generator/customization.md b/chart-sdk/maui/barcode-generator/customization.md index f23924af5..89013b38f 100644 --- a/chart-sdk/maui/barcode-generator/customization.md +++ b/chart-sdk/maui/barcode-generator/customization.md @@ -1,7 +1,7 @@ --- layout: post -title: Customization in .NET MAUI Barcodes | Syncfusion® -description: Learn here all about Customization of Syncfusion® .NET MAUI Barcodes(SfBarcodeGenerator) control with key features and more. +title: Customization in .NET MAUI Barcode Generator | Syncfusion® +description: Customization in .NET MAUI Barcode Generator allows barcode appearance to be tailored using colors, sizing, labels, margins, and styling options. platform: chart-sdk control: SfBarcodeGenerator documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Customization in .NET MAUI Barcode Generator -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/barcode-generator/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/getting-started)** guide. ## Text customization @@ -166,7 +166,7 @@ this.Content = barcode; Both one-dimensional and two-dimensional symbologies support the [`Module`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.SymbologyBase.html#Syncfusion_Maui_Barcode_SymbologyBase_Module) property. This property is used to define the size of the smallest bar line or module in the barcode. The `Module` property is available on all symbology classes derived from [`SymbologyBase`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.SymbologyBase.html) and accepts a positive `double` value. -N> `SymbologyBase` is a public abstract base class. To use a barcode, instantiate one of its derived classes such as `Codabar`, `Code128`, `QRCode`, `DataMatrix`, or other available symbology types. For an introduction to symbologies and how to assign them, refer to the **[One-dimensional symbology](https://help.syncfusion.com/maui/barcode-generator/one-dimensional-symbology)** and **[Two-dimensional symbology](https://help.syncfusion.com/maui/barcode-generator/two-dimensional-symbology)** topics. +N> `SymbologyBase` is a public abstract base class. To use a barcode, instantiate one of its derived classes such as `Codabar`, `Code128`, `QRCode`, `DataMatrix`, or other available symbology types. For an introduction to symbologies and how to assign them, refer to the **[One-dimensional symbology](https://help.syncfusion.com/chart-sdk/barcode-generator/one-dimensional-symbology)** and **[Two-dimensional symbology](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/two-dimensional-symbology)** topics. If this property is not set for a one-dimensional barcode, the size of the smallest bar line is determined based on the available width. If the [`Module`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.SymbologyBase.html#Syncfusion_Maui_Barcode_SymbologyBase_Module) property is not set for a two-dimensional barcode, the size of the smallest module is calculated based on the minimum of the available width and height. When `Module` is not set, the barcode automatically scales to fit the available space while maintaining proper proportions for scanner readability. @@ -372,6 +372,6 @@ this.Content = barcode; ## Troubleshooting -- **Value not rendered or appears truncated:** Verify that the `Value` is valid for the assigned `Symbology`. Some symbologies restrict the supported character set and length; for example, `Codabar` accepts only digits and the start/stop characters `A`, `B`, `C`, and `D`. Refer to the **[One-dimensional symbology](https://help.syncfusion.com/maui/barcode-generator/one-dimensional-symbology)** and **[Two-dimensional symbology](https://help.syncfusion.com/maui/barcode-generator/two-dimensional-symbology)** topics for the supported input rules. +- **Value not rendered or appears truncated:** Verify that the `Value` is valid for the assigned `Symbology`. Some symbologies restrict the supported character set and length; for example, `Codabar` accepts only digits and the start/stop characters `A`, `B`, `C`, and `D`. Refer to the **[One-dimensional symbology](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/one-dimensional-symbology)** and **[Two-dimensional symbology](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/two-dimensional-symbology)** topics for the supported input rules. - **Barcode appears too small or too large:** Adjust the `Module` property on the assigned symbology, or increase the `WidthRequest` and `HeightRequest` of the `SfBarcodeGenerator`. - **Colors do not appear:** Confirm that `ForegroundColor` and `BackgroundColor` are set to contrasting colors; setting both to the same value produces a blank barcode. diff --git a/chart-sdk/maui/barcode-generator/getting-started.md b/chart-sdk/maui/barcode-generator/getting-started.md index cb03b47de..d64f15eb2 100644 --- a/chart-sdk/maui/barcode-generator/getting-started.md +++ b/chart-sdk/maui/barcode-generator/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Barcode Generator control | Syncfusion -description: Learn here all about getting started with Syncfusion® .NET MAUI Barcode Generator(SfBarcodeGenerator) control and more. +title: Getting Started with .NET MAUI Barcode Generator | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Barcode Generator control. Explore setup, barcode symbologies, customization, and generation features. platform: chart-sdk control: SfBarcodeGenerator documentation: ug diff --git a/chart-sdk/maui/barcode-generator/migration.md b/chart-sdk/maui/barcode-generator/migration.md index cf6d396d7..a9dbb833f 100644 --- a/chart-sdk/maui/barcode-generator/migration.md +++ b/chart-sdk/maui/barcode-generator/migration.md @@ -1,7 +1,7 @@ --- layout: post -title: Migrate from Xamarin to .NET MAUI Barcodes | Syncfusion® -description: Learn here all about Migrating from Syncfusion® Xamarin SfBarcode to Syncfusion® .NET MAUI SfBarcodeGenerator control and more. +title: Migrate SfBarcode to .NET MAUI SfBarcodeGenerator | Syncfusion® +description: Migrate from Xamarin.Forms SfBarcode to .NET MAUI SfBarcodeGenerator with updated APIs, improved performance, and modern barcode generation features. platform: chart-sdk control: SfBarcodeGenerator documentation: ug diff --git a/chart-sdk/maui/barcode-generator/one-dimensional-symbology.md b/chart-sdk/maui/barcode-generator/one-dimensional-symbology.md index e66df876a..f2976bf36 100644 --- a/chart-sdk/maui/barcode-generator/one-dimensional-symbology.md +++ b/chart-sdk/maui/barcode-generator/one-dimensional-symbology.md @@ -1,13 +1,13 @@ --- layout: post -title: One-dimensional symbology in .NET MAUI Barcodes | Syncfusion® -description: Learn here all about one dimensional symbology of Syncfusion® .NET MAUI Barcodes(SfBarcodeGenerator) control with key features and more. +title: One-Dimensional Symbology in .NET MAUI Barcode Generator | Syncfusion® +description: One-Dimensional Symbology in .NET MAUI Barcode Generator supports linear barcode formats, enabling accurate encoding and scanning of business data. platform: chart-sdk control: SfBarcodeGenerator documentation: ug --- -# One-dimensional symbology in .NET MAUI Barcode Generator +# One-Dimensional Symbology in .NET MAUI Barcode Generator The one-dimensional [.NET MAUI Barcode Generator](https://www.syncfusion.com/maui-controls/maui-barcodes) represents the data by varying the widths and spacings of the parallel lines. These barcode types are also known as linear barcode types. The Syncfusion® .NET MAUI barcode generator supports the following one-dimensional barcode types: @@ -24,7 +24,7 @@ The one-dimensional [.NET MAUI Barcode Generator](https://www.syncfusion.com/mau * [`EAN8`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.EAN8.html) * [`EAN13`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.EAN13.html) -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/barcode-generator/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/getting-started)** guide. N> All one-dimensional symbologies support the [`Module`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.SymbologyBase.html#Syncfusion_Maui_Barcode_SymbologyBase_Module) property, which defines the size of the smallest bar line of the barcode. By default, `Module` is not set; the smallest bar line size is automatically calculated based on the available size and the total number of bars for the provided input value. diff --git a/chart-sdk/maui/barcode-generator/overview.md b/chart-sdk/maui/barcode-generator/overview.md index b4ae64e16..0327d9e45 100644 --- a/chart-sdk/maui/barcode-generator/overview.md +++ b/chart-sdk/maui/barcode-generator/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Barcode Generator control | Syncfusion® -description: Learn here all about introduction of Syncfusion .NET MAUI Barcodes(SfBarcodeGenerator) control with key features and more. +title: About Syncfusion® .NET MAUI Barcode Generator Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Barcode Generator control, including barcode symbologies, customization options, and generation features. platform: chart-sdk control: SfBarcodeGenerator documentation: ug --- -# .NET MAUI Barcode Generator Overview +# About Syncfusion® .NET MAUI Barcode Generator Control The Syncfusion® [.NET MAUI Barcode Generator](https://www.syncfusion.com/maui-controls/maui-barcodes) is a data visualization control used to generate and display data in a machine-readable format. It provides a perfect approach to encode text using supported symbology types. @@ -31,15 +31,15 @@ The Syncfusion® [.NET MAUI Barcode Generator](https://www.syncfus ## Related controls -- [DataGrid](https://help.syncfusion.com/maui/datagrid/overview) for managing and displaying barcode-related data in tabular format. -- [ListView](https://help.syncfusion.com/maui/listview/overview) for presenting barcode items in list-based layouts. -- [TreeMap](https://help.syncfusion.com/maui/treemap/overview) for visualize barcode usage or distribution patterns in a hierarchical, comparative view. +- [DataGrid](https://help.syncfusion.com/chart-sdk/maui/datagrid/overview) for managing and displaying barcode-related data in tabular format. +- [ListView](https://help.syncfusion.com/chart-sdk/maui/listview/overview) for presenting barcode items in list-based layouts. +- [TreeMap](https://help.syncfusion.com/chart-sdk/maui/treemap/overview) for visualize barcode usage or distribution patterns in a hierarchical, comparative view. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/barcode-generator/getting-started) shows how to begin using the Barcode Generator step by step. -- [One Dimensional Symbology](https://help.syncfusion.com/maui/barcode-generator/one-dimensional-symbology) explains supported linear barcode types and usage. -- [Customization](https://help.syncfusion.com/maui/barcode-generator/customization) shows how to customize barcode appearance and behavior. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/getting-started) shows how to begin using the Barcode Generator step by step. +- [One Dimensional Symbology](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/one-dimensional-symbology) explains supported linear barcode types and usage. +- [Customization](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/customization) shows how to customize barcode appearance and behavior. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready-made UI examples. ## Resources diff --git a/chart-sdk/maui/barcode-generator/two-dimensional-symbology.md b/chart-sdk/maui/barcode-generator/two-dimensional-symbology.md index 7b258f12e..10dc9b34d 100644 --- a/chart-sdk/maui/barcode-generator/two-dimensional-symbology.md +++ b/chart-sdk/maui/barcode-generator/two-dimensional-symbology.md @@ -1,20 +1,20 @@ --- layout: post -title: Two-dimensional symbology in .NET MAUI Barcodes | Syncfusion® -description: Learn here all about two-dimensional symbology of Syncfusion® .NET MAUI Barcodes(SfBarcodeGenerator) control with key features and more. +title: Two-Dimensional Symbology in .NET MAUI Barcode Generator | Syncfusion® +description: Two-Dimensional Symbology in .NET MAUI Barcode Generator supports 2D barcode formats, enabling efficient encoding and storage of large amounts of data. platform: chart-sdk control: SfBarcodeGenerator documentation: ug --- -# Two-dimensional symbology in .NET MAUI Barcode Generator +# Two-Dimensional Symbology in .NET MAUI Barcode Generator The two-dimensional [.NET MAUI Barcode Generator](https://www.syncfusion.com/maui-controls/maui-barcodes) can represent more data per unit area compared to one-dimensional barcodes by using a two-dimensional layout. The barcode generator control supports the following two-dimensional symbology: * [`QRCode`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.QRCode.html) * [`DataMatrix`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.DataMatrix.html) -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/barcode-generator/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Barcode Generator** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/barcode-generator/getting-started)** guide. N> Like one-dimensional symbology, the two-dimensional symbology also supports the [`Module`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Barcode.SymbologyBase.html#Syncfusion_Maui_Barcode_SymbologyBase_Module) property. The property is used to define the size of the smallest module or dot of the barcode. If this property is not set, the size of the smallest dot of the barcode is automatically calculated based on the available size. diff --git a/chart-sdk/maui/linear-gauge/animation.md b/chart-sdk/maui/linear-gauge/animation.md index 593c8775d..991db4b3d 100644 --- a/chart-sdk/maui/linear-gauge/animation.md +++ b/chart-sdk/maui/linear-gauge/animation.md @@ -1,17 +1,17 @@ --- layout: post -title: Animation in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing animation of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Animation in .NET MAUI Linear Gauge | Syncfusion® +description: Animation in .NET MAUI Linear Gauge provides smooth transitions for gauge elements, improving visual feedback and enhancing the overall user experience. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Animation in .NET MAUI Linear Gauge (SfLinearGauge) +# Animation in .NET MAUI Linear Gauge All Linear Gauge elements including the scale, ticks and labels, range, bar pointer, shape marker pointer, and content marker pointer, can be animated separately. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. ## Animate axis diff --git a/chart-sdk/maui/linear-gauge/bar-pointer.md b/chart-sdk/maui/linear-gauge/bar-pointer.md index ecb73728c..5daeb2002 100644 --- a/chart-sdk/maui/linear-gauge/bar-pointer.md +++ b/chart-sdk/maui/linear-gauge/bar-pointer.md @@ -1,17 +1,17 @@ --- layout: post -title: Bar Pointer in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing Bar Pointer of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Bar Pointer in .NET MAUI Linear Gauge | Syncfusion® +description: Bar Pointer in .NET MAUI Linear Gauge represents values using a filled bar along the gauge scale, enabling clear and intuitive data visualization. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Bar Pointer in .NET MAUI Linear Gauge (SfLinearGauge) +# Bar Pointer in .NET MAUI Linear Gauge A bar pointer is an accenting line or shaded background that can be placed on a Linear Gauge to mark any current value in the scale track. The bar pointers always start from the minimum value of the scale and end with the specified value. Therefore, the [`Value`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearPointer.html#Syncfusion_Maui_Gauges_LinearPointer_Value) property is a required parameter for creating a bar pointer. Multiple bar pointers can be added to a single gauge. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. ## Default bar pointer diff --git a/chart-sdk/maui/linear-gauge/content-marker-pointer.md b/chart-sdk/maui/linear-gauge/content-marker-pointer.md index ba1ad6a04..dbc5c220a 100644 --- a/chart-sdk/maui/linear-gauge/content-marker-pointer.md +++ b/chart-sdk/maui/linear-gauge/content-marker-pointer.md @@ -1,17 +1,17 @@ --- layout: post -title: Content Marker Pointer in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about Content Pointer feature of the Syncfusion® .NET MAUI Linear Gauge control, including image, text pointer support and more. +title: Content Marker Pointer in .NET MAUI Linear Gauge | Syncfusion® +description: Content Marker Pointer in .NET MAUI Linear Gauge displays custom content as a marker pointer, enabling flexible representation of values within the gauge scale. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Content Marker Pointer in .NET MAUI Linear Gauge (SfLinearGauge) +# Content Marker Pointer in .NET MAUI Linear Gauge -The [`LinearContentPointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) in [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html) allows you to use any .NET MAUI content as a marker pointer. Multiple content marker pointers can be added to a single gauge. For animation support, refer to the [Pointer animation](https://help.syncfusion.com/maui/linear-gauge/animation#pointer-animation) documentation. The following code sample uses an `Image` as a marker pointer. +The [`LinearContentPointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) in [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html) allows you to use any .NET MAUI content as a marker pointer. Multiple content marker pointers can be added to a single gauge. For animation support, refer to the [Pointer animation](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/animation#pointer-animation) documentation. The following code sample uses an `Image` as a marker pointer. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. N> The image used in the `Image` source (e.g., `pin.png`) must be added to your project's resources. diff --git a/chart-sdk/maui/linear-gauge/getting-started.md b/chart-sdk/maui/linear-gauge/getting-started.md index d7d2b2368..778751f7f 100644 --- a/chart-sdk/maui/linear-gauge/getting-started.md +++ b/chart-sdk/maui/linear-gauge/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting started with .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here about getting started with Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control, its elements, and more. +title: Getting Started with .NET MAUI Linear Gauge | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Linear Gauge control. Explore setup, scales, pointers, ranges, and customization features. platform: chart-sdk control: SfLinearGauge documentation: ug @@ -126,7 +126,7 @@ using Syncfusion.Maui.Gauges; ## Step 5: Add a Linear Gauge with Pointers, Ranges, and Bar Pointers -Initialize the [SfLinearGauge](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1) to show values on a linear scale, with [ranges](https://help.syncfusion.com/maui/linear-gauge/range) highlighting value segments and [pointers](https://help.syncfusion.com/maui/linear-gauge/pointers) indicating specific values clearly. The [LinearRange](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearRange.html) highlights a value segment, the [LinearShapePointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearShapePointer.html) and [LinearContentPointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) are marker pointers, and the [BarPointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.BarPointer.html) is a shaded bar from the minimum scale value to the specified value. +Initialize the [SfLinearGauge](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1) to show values on a linear scale, with [ranges](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/range) highlighting value segments and [pointers](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/pointers) indicating specific values clearly. The [LinearRange](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearRange.html) highlights a value segment, the [LinearShapePointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearShapePointer.html) and [LinearContentPointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) are marker pointers, and the [BarPointer](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.BarPointer.html) is a shaded bar from the minimum scale value to the specified value. N> The image used in the `LinearContentPointer` source (e.g., `pin.png`) must be added to your project's resources. diff --git a/chart-sdk/maui/linear-gauge/labels.md b/chart-sdk/maui/linear-gauge/labels.md index e1d39431d..cf859501f 100644 --- a/chart-sdk/maui/linear-gauge/labels.md +++ b/chart-sdk/maui/linear-gauge/labels.md @@ -1,19 +1,19 @@ --- layout: post -title: Labels in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing Labels of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Labels in .NET MAUI Linear Gauge | Syncfusion® +description: Labels in .NET MAUI Linear Gauge display scale values with customizable formatting and positioning, improving readability and gauge interpretation. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Labels in .NET MAUI Linear Gauge (SfLinearGauge) +# Labels in .NET MAUI Linear Gauge The default style of gauge labels is as follows. ![Default .NET MAUI Linear Gauge labels](images/getting-started/default_linear_gauge.PNG) -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. ## Customize label styles diff --git a/chart-sdk/maui/linear-gauge/migration.md b/chart-sdk/maui/linear-gauge/migration.md index 478ad2da1..5b6d1da47 100644 --- a/chart-sdk/maui/linear-gauge/migration.md +++ b/chart-sdk/maui/linear-gauge/migration.md @@ -1,7 +1,7 @@ --- layout: post -title: Migrate from Xamarin to .NET MAUI SfLinearGauge | Syncfusion® -description: Learn here all about Migrating from Syncfusion Xamarin SfLinearGauge to Syncfusion® .NET MAUI SfLinearGauge control and more. +title: Migrate Xamarin SfLinearGauge to .NET MAUI SfLinearGauge | Syncfusion® +description: Migrate from Xamarin.Forms SfLinearGauge to .NET MAUI SfLinearGauge with updated APIs, improved performance, and modern gauge visualization features. platform: chart-sdk control: SfLinearGauge documentation: ug @@ -9,13 +9,13 @@ documentation: ug # Migrate from Xamarin.Forms SfLinearGauge to .NET MAUI SfLinearGauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. To make the migration from the [Xamarin SfLinearGauge](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfGauge.XForms.SfLinearGauge.html) to the [.NET MAUI SfLinearGauge](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html) easier, most of the similar APIs from the Xamarin [SfLinearGauge](https://help.syncfusion.com/cr/xamarin/Syncfusion.SfGauge.XForms.SfLinearGauge.html) were kept in the .NET MAUI [SfLinearGauge](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html). Also, the APIs have been restructured by considering various use cases and maintaining API consistency. Please find the difference in the following topics. ## Initialize control -To initialize the control, import the gauge namespace and initialize SfLinearGauge as shown in the following code sample. In .NET MAUI, you also need to register the Syncfusion core handler by calling `builder.ConfigureSyncfusionCore()` in the `MauiProgram.cs` file. For more information, refer to the [Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started) guide. +To initialize the control, import the gauge namespace and initialize SfLinearGauge as shown in the following code sample. In .NET MAUI, you also need to register the Syncfusion core handler by calling `builder.ConfigureSyncfusionCore()` in the `MauiProgram.cs` file. For more information, refer to the [Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) guide.
diff --git a/chart-sdk/maui/linear-gauge/mirror-linear-gauge.md b/chart-sdk/maui/linear-gauge/mirror-linear-gauge.md index ab775157f..74a5dcfeb 100644 --- a/chart-sdk/maui/linear-gauge/mirror-linear-gauge.md +++ b/chart-sdk/maui/linear-gauge/mirror-linear-gauge.md @@ -1,15 +1,15 @@ --- layout: post -title: Mirroring in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn how to use the IsMirrored property to mirror the Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control. +title: Mirroring in .NET MAUI Linear Gauge | Syncfusion® +description: Mirroring in .NET MAUI Linear Gauge reverses the gauge direction and element layout, enabling right-to-left orientation and flexible visual presentation. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Mirroring in .NET MAUI Linear Gauge (SfLinearGauge) +# Mirroring in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. The [`IsMirrored`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_IsMirrored) property in [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1) mirrors all the Linear Gauge elements (scale, labels, ticks, and pointers) in the [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1). This is useful for right-to-left (RTL) layout support. The default value of this property is `false`. The following code sample demonstrates how to set the [`IsMirrored`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_IsMirrored) property. diff --git a/chart-sdk/maui/linear-gauge/overview.md b/chart-sdk/maui/linear-gauge/overview.md index c95246cd5..2c9f9fe44 100644 --- a/chart-sdk/maui/linear-gauge/overview.md +++ b/chart-sdk/maui/linear-gauge/overview.md @@ -1,15 +1,15 @@ --- layout: post -title: About .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about introduction of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control, its features, and more. +title: About Syncfusion® .NET MAUI Linear Gauge Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Linear Gauge control, including scales, pointers, ranges, labels, and customization features. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# .NET MAUI Linear Gauge (SfLinearGauge) Overview +# About Syncfusion® .NET MAUI Linear Gauge Control -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. Syncfusion® [.NET MAUI Linear Gauge](https://www.syncfusion.com/maui-controls/maui-linear-gauge) is a data visualization control to display values on a linear scale. Use this control to craft high-quality mobile app user interfaces. The .NET MAUI Linear Gauge is supported on Windows, macOS, iOS, and Android. @@ -27,10 +27,10 @@ Syncfusion® [.NET MAUI Linear Gauge](https://www.syncfusion.com/maui-controls/m - **Orientation** enables displaying the gauge in horizontal or vertical layouts based on UI requirements. - **Customizable scale** enables configuring thickness, edge styles, and reversing the scale direction. - **Labels and ticks** enables styling labels, major ticks, and minor ticks for better readability. -- **[Range support](https://help.syncfusion.com/maui/linear-gauge/range)** enables highlighting value intervals on the scale with different visual styles. -- **[Pointer support](https://help.syncfusion.com/maui/linear-gauge/pointers)** enables using shape marker, content marker, and bar pointers to indicate values. -- **[Mirror mode](https://help.syncfusion.com/maui/linear-gauge/mirror-linear-gauge)** enables rendering gauge elements in a mirrored layout for alternate visual representation. -- **[Animation](https://help.syncfusion.com/maui/linear-gauge/animation)** enables animating gauge elements during load or value changes for better user experience. +- **[Range support](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/range)** enables highlighting value intervals on the scale with different visual styles. +- **[Pointer support](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/pointers)** enables using shape marker, content marker, and bar pointers to indicate values. +- **[Mirror mode](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/mirror-linear-gauge)** enables rendering gauge elements in a mirrored layout for alternate visual representation. +- **[Animation](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/animation)** enables animating gauge elements during load or value changes for better user experience. - **Interactive pointer** enables you to adjust values dynamically through drag or swipe gestures. ## Globalization @@ -84,15 +84,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Radial Gauge](https://help.syncfusion.com/maui/radial-gauge/overview) for visualizing values using circular gauge representation. -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for visualizing proportional data using circular charts. -- [Digital Gauge](https://help.syncfusion.com/maui/digitalgauge/overview) for displaying numeric or character values using segmented digital display styles. +- [Radial Gauge](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/overview) for visualizing values using circular gauge representation. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for visualizing proportional data using circular charts. +- [Digital Gauge](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/overview) for displaying numeric or character values using segmented digital display styles. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started) shows a step-by-step guide to begin using the Linear Gauge control. -- [Range](https://help.syncfusion.com/maui/linear-gauge/range) explains how to configure ranges and scale visualization. -- [Pointers](https://help.syncfusion.com/maui/linear-gauge/pointers) helps customize pointer types and behavior. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) shows a step-by-step guide to begin using the Linear Gauge control. +- [Range](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/range) explains how to configure ranges and scale visualization. +- [Pointers](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/pointers) helps customize pointer types and behavior. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready-made UI examples. ## Resources diff --git a/chart-sdk/maui/linear-gauge/pointers.md b/chart-sdk/maui/linear-gauge/pointers.md index 23240e525..9a7a8bcc6 100644 --- a/chart-sdk/maui/linear-gauge/pointers.md +++ b/chart-sdk/maui/linear-gauge/pointers.md @@ -1,21 +1,21 @@ --- layout: post -title: Pointers and Interaction in .NET MAUI Linear Gauge | Syncfusion® -description: Learn here all about the pointers and interactions in Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Pointers in .NET MAUI Linear Gauge | Syncfusion® +description: Pointers in .NET MAUI Linear Gauge indicate values along the gauge scale using different pointer types, enabling clear and effective data representation. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Pointers in .NET MAUI Linear Gauge (SfLinearGauge) +# Pointers in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. The pointer is used to indicate values on a scale. The Linear Gauge control has three types of pointers: -* [`Bar pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.BarPointer.html) - A shaded bar from the minimum scale value to the specified value. For more details, refer to the [Bar pointer](https://help.syncfusion.com/maui/linear-gauge/bar-pointer) documentation. -* [`Shape pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearShapePointer.html) - A built-in shape marker (e.g., circle, triangle) placed on the scale. For more details, refer to the [Shape marker pointer](https://help.syncfusion.com/maui/linear-gauge/shape-marker-pointer) documentation. -* [`Content pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) - Any .NET MAUI content (e.g., image, text, or custom view) placed on the scale. For more details, refer to the [Content marker pointer](https://help.syncfusion.com/maui/linear-gauge/content-marker-pointer) documentation. +* [`Bar pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.BarPointer.html) - A shaded bar from the minimum scale value to the specified value. For more details, refer to the [Bar pointer](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/bar-pointer) documentation. +* [`Shape pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearShapePointer.html) - A built-in shape marker (e.g., circle, triangle) placed on the scale. For more details, refer to the [Shape marker pointer](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/shape-marker-pointer) documentation. +* [`Content pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearContentPointer.html) - Any .NET MAUI content (e.g., image, text, or custom view) placed on the scale. For more details, refer to the [Content marker pointer](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/content-marker-pointer) documentation. All the pointers can be customized as needed. You can add multiple pointers to the gauge to point multiple values on the same scale. The value of the pointer is set using the [`Value`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearPointer.html#Syncfusion_Maui_Gauges_LinearPointer_Value) property. All three pointer types support interaction when the `IsInteractive` property is enabled. diff --git a/chart-sdk/maui/linear-gauge/range.md b/chart-sdk/maui/linear-gauge/range.md index cd9829453..1f6a4c4bf 100644 --- a/chart-sdk/maui/linear-gauge/range.md +++ b/chart-sdk/maui/linear-gauge/range.md @@ -1,15 +1,15 @@ --- layout: post -title: Range in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing Range of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Range in .NET MAUI Linear Gauge | Syncfusion® +description: Range in .NET MAUI Linear Gauge highlights specific value intervals on the gauge scale, improving data visualization and emphasizing important thresholds. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Range in .NET MAUI Linear Gauge (SfLinearGauge) +# Range in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the [.NET MAUI Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started) control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. A range is a visual element that helps you quickly visualize where a range falls on the axis track. Multiple ranges with different styles can be added to a linear gauge. The default style of range will be as follows. diff --git a/chart-sdk/maui/linear-gauge/scale.md b/chart-sdk/maui/linear-gauge/scale.md index 15723fa6f..cab064e93 100644 --- a/chart-sdk/maui/linear-gauge/scale.md +++ b/chart-sdk/maui/linear-gauge/scale.md @@ -1,16 +1,16 @@ --- layout: post -title: Scale in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing scale of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Scale in .NET MAUI Linear Gauge | Syncfusion® +description: Scale in .NET MAUI Linear Gauge defines the measurement axis for displaying values, supporting customizable intervals, labels, and visual styling. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Scale in .NET MAUI Linear Gauge (SfLinearGauge) +# Scale in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. The Linear Gauge scale on which a set of values can be plotted. A scale can be customized by changing the thickness, color, and edge styles. Scale elements such as labels and ticks can also be easily customized and the scale can be inversed. diff --git a/chart-sdk/maui/linear-gauge/shape-marker-pointer.md b/chart-sdk/maui/linear-gauge/shape-marker-pointer.md index 6cfffcc9a..c724ae8bf 100644 --- a/chart-sdk/maui/linear-gauge/shape-marker-pointer.md +++ b/chart-sdk/maui/linear-gauge/shape-marker-pointer.md @@ -1,15 +1,15 @@ --- layout: post -title: Shape Marker Pointer in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing Shape Marker Pointer of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Shape Marker Pointer in .NET MAUI Linear Gauge | Syncfusion® +description: Shape Marker Pointer in .NET MAUI Linear Gauge displays values using customizable marker shapes, enabling clear visualization and precise value indication. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Shape Marker Pointer in .NET MAUI Linear Gauge (SfLinearGauge) +# Shape Marker Pointer in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. The [`LinearShapePointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.LinearShapePointer.html) in [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html) has the following pre-defined shapes to mark a specific value. The default shape pointer is [`InvertedTriangle`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.ShapeType.html#Syncfusion_Maui_Gauges_ShapeType_InvertedTriangle). diff --git a/chart-sdk/maui/linear-gauge/ticks.md b/chart-sdk/maui/linear-gauge/ticks.md index 4a972278b..20fcc1c90 100644 --- a/chart-sdk/maui/linear-gauge/ticks.md +++ b/chart-sdk/maui/linear-gauge/ticks.md @@ -1,15 +1,15 @@ --- layout: post -title: Ticks in .NET MAUI Linear Gauge control | Syncfusion® -description: Learn here all about adding and customizing Ticks of Syncfusion® .NET MAUI Linear Gauge (SfLinearGauge) control and more. +title: Ticks in .NET MAUI Linear Gauge | Syncfusion® +description: Ticks in .NET MAUI Linear Gauge indicate scale intervals and measurement points, improving readability and helping interpret gauge values accurately. platform: chart-sdk control: SfLinearGauge documentation: ug --- -# Ticks in .NET MAUI Linear Gauge (SfLinearGauge) +# Ticks in .NET MAUI Linear Gauge -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/linear-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Linear Gauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/getting-started)** guide. The default style of scale ticks is as follows. @@ -78,7 +78,7 @@ SfLinearGauge gauge = new SfLinearGauge(); ## Customize Minor Tick Interval -The major ticks are generated based on the [`Interval`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_Interval) property, which defines the interval between major ticks. For more details, refer to the [`Customize the interval between labels`](https://help.syncfusion.com/maui/linear-gauge/labels#customize-interval-between-labels) topic. The minor ticks are calculated using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_MinorTicksPerInterval) property of [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1). By default, the value of this property is 1. +The major ticks are generated based on the [`Interval`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_Interval) property, which defines the interval between major ticks. For more details, refer to the [`Customize the interval between labels`](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/labels#customize-interval-between-labels) topic. The minor ticks are calculated using the [`MinorTicksPerInterval`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_MinorTicksPerInterval) property of [`SfLinearGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html?tabs=tabid-1). By default, the value of this property is 1. {% tabs %} @@ -126,7 +126,7 @@ SfLinearGauge gauge = new SfLinearGauge(); ## Customize Tick Position -The linear scale allows you to position the ticks either inside or outside the scale track using the [`TickPosition`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_TickPosition) property. The available positions are [`Inside`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Inside), [`Outside`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Outside), and [`Cross`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Cross). By default, ticks are positioned inside the scale track. N> The [`LabelPosition`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_LabelPosition) property is also set to `Outside` in the sample below for visual consistency. For details, refer to the [labels](https://help.syncfusion.com/maui/linear-gauge/labels) topic. +The linear scale allows you to position the ticks either inside or outside the scale track using the [`TickPosition`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_TickPosition) property. The available positions are [`Inside`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Inside), [`Outside`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Outside), and [`Cross`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeElementPosition.html#Syncfusion_Maui_Gauges_GaugeElementPosition_Cross). By default, ticks are positioned inside the scale track. N> The [`LabelPosition`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfLinearGauge.html#Syncfusion_Maui_Gauges_SfLinearGauge_LabelPosition) property is also set to `Outside` in the sample below for visual consistency. For details, refer to the [labels](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/labels) topic. {% tabs %} diff --git a/chart-sdk/maui/maps/AI-driven-smart-location-search.md b/chart-sdk/maui/maps/AI-driven-smart-location-search.md index de588aa48..796fd794d 100644 --- a/chart-sdk/maui/maps/AI-driven-smart-location-search.md +++ b/chart-sdk/maui/maps/AI-driven-smart-location-search.md @@ -1,17 +1,17 @@ --- layout: post -title: AI-Driven smart location search in .NET MAUI Maps control | Syncfusion -description: Learn here all about the AI-Driven smart location searching feature of Syncfusion® .NET MAUI Maps (SfMaps) control and more. +title: AI-Driven Smart Location Search in .NET MAUI Maps | Syncfusion® +description: AI-Driven Smart Location Search in .NET MAUI Maps enables intelligent location discovery through AI-powered search, improving navigation and map interactions. platform: chart-sdk control: SfMaps documentation: ug --- -# AI-Driven Smart Location Search in .NET MAUI Maps (SfMaps) +# AI-Driven Smart Location Search in .NET MAUI Maps This document provides a comprehensive guide to implementing advanced search functionality within the Syncfusion [.NET MAUI Maps](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.SfMaps.html) control. By integrating **Azure OpenAI**, this solution enables an intelligent, AI-powered location search experience. -N> **Prerequisite:** Ensure that the required NuGet packages are installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[.NET MAUI Maps Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. Also, refer to the **[.NET MAUI Autocomplete Getting Started](https://help.syncfusion.com/maui/autocomplete/getting-started)** guide before proceeding with this documentation. +N> **Prerequisite:** Ensure that the required NuGet packages are installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[.NET MAUI Maps Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. Also, refer to the **[.NET MAUI Autocomplete Getting Started](https://help.syncfusion.com/chart-sdk/maui/autocomplete/getting-started)** guide before proceeding with this documentation. ## Integrating Azure OpenAI with the .NET MAUI app @@ -153,7 +153,7 @@ public class CustomMarker : MapMarker ### Step 2: Add Maps tile layer in .NET MAUI Maps -Add a [tile layer](https://help.syncfusion.com/maui/maps/getting-started#add-tile-layer) in the .NET MAUI Maps that can be used to search for and locate landmarks based on user input. The `EnableCenterAnimation` property animates the map center change, `CanCacheTiles` enables local tile caching for faster reloads, and `ZoomLevel` sets the initial magnification. +Add a [tile layer](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started#add-tile-layer) in the .NET MAUI Maps that can be used to search for and locate landmarks based on user input. The `EnableCenterAnimation` property animates the map center change, `CanCacheTiles` enables local tile caching for faster reloads, and `ZoomLevel` sets the initial magnification. N> The OpenStreetMap tile URL used here is subject to the [OSM Tile Usage Policy](https://operations.osmfoundation.org/policies/tiles/). Use a suitable tile provider for production and respect the provider's usage limits. diff --git a/chart-sdk/maui/maps/bubble.md b/chart-sdk/maui/maps/bubble.md index e3fbda5f4..379921a74 100644 --- a/chart-sdk/maui/maps/bubble.md +++ b/chart-sdk/maui/maps/bubble.md @@ -1,15 +1,15 @@ --- layout: post -title: Bubbles in .NET MAUI Maps Control | Syncfusion® -description: Learn all about the Bubbles feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize their appearances and more. +title: Bubbles in .NET MAUI Maps | Syncfusion® +description: Bubbles in .NET MAUI Maps visualize data using scalable markers, making it easy to represent geographic values and compare data across locations. platform: chart-sdk control: SfMaps documentation: ug --- -# Bubbles in .NET MAUI Maps (SfMaps) +# Bubbles in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. Bubbles can be rendered in different colors and sizes based on the data values of their assigned shape. You can add information to shapes such as population density, number of users, and more. diff --git a/chart-sdk/maui/maps/custom-shape.md b/chart-sdk/maui/maps/custom-shape.md index c94e54fd8..db716801c 100644 --- a/chart-sdk/maui/maps/custom-shape.md +++ b/chart-sdk/maui/maps/custom-shape.md @@ -1,22 +1,22 @@ --- layout: post -title: Custom Shapes in .NET MAUI Maps Control | Syncfusion® -description: Learn here all about the custom shapes feature of Syncfusion® .NET MAUI Maps (SfMaps) control, its features, and more. +title: Custom Shapes in .NET MAUI Maps | Syncfusion® +description: Custom Shapes in .NET MAUI Maps enable personalized geographic visualizations using custom shape data, improving map representation and spatial analysis. platform: chart-sdk control: SfMaps documentation: ug keywords: .net maui maps, .net maui shape maps --- -# Custom shapes in .NET MAUI Maps (SfMaps) +# Custom Shapes in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **.NET MAUI Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The [.NET MAUI Maps](https://www.syncfusion.com/maui-controls/maui-maps) control allows you to render any custom shape to make a map look like building infrastructure, a sports stadium, a plane or bus seat arrangement, and more, using the [`Geometry`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_Geometry) property. The [`Geometry`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_Geometry) property accepts a [`MapGeometryType`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapGeometryType.html) enum value. When set to [`MapGeometryType.Points`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapGeometryType.html), the layer renders the points defined in the [`ShapesSource`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShapesSource) as custom shapes (instead of interpreting the source as GeoJSON polygons/paths). Use [`ShapesSource`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShapesSource) to supply the custom-shape definition file. -N> When loading an embedded shape source with [`MapSource.FromResource`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapSource.html), the JSON file must be embedded in the assembly. Set its build action to `EmbeddedResource`, and reference it by its resource ID (for example, `MyProject.floor_planning.json`). For more details, see the **[Load an embedded file](https://help.syncfusion.com/maui/maps/getting-started#load-an-embedded-file)** section of the Getting Started guide. +N> When loading an embedded shape source with [`MapSource.FromResource`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapSource.html), the JSON file must be embedded in the assembly. Set its build action to `EmbeddedResource`, and reference it by its resource ID (for example, `MyProject.floor_planning.json`). For more details, see the **[Load an embedded file](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started#load-an-embedded-file)** section of the Getting Started guide. {% tabs %} @@ -60,8 +60,8 @@ The following properties are commonly used to customize the rendered custom shap ## See Also -* [Markers in .NET MAUI Maps](https://help.syncfusion.com/maui/maps/markers) -* [Shape sublayer in .NET MAUI Maps](https://help.syncfusion.com/maui/maps/shape-sublayer) -* [Data labels in .NET MAUI Maps](https://help.syncfusion.com/maui/maps/data-labels) +* [Markers in .NET MAUI Maps](https://help.syncfusion.com/chart-sdk/maui/maps/markers) +* [Shape sublayer in .NET MAUI Maps](https://help.syncfusion.com/chart-sdk/maui/maps/shape-sublayer) +* [Data labels in .NET MAUI Maps](https://help.syncfusion.com/chart-sdk/maui/maps/data-labels) ![Custom shapes in .NET MAUI Maps](images/custom-shape/maps_cartesian_view.png) \ No newline at end of file diff --git a/chart-sdk/maui/maps/data-labels.md b/chart-sdk/maui/maps/data-labels.md index 64ef367e8..b91397846 100644 --- a/chart-sdk/maui/maps/data-labels.md +++ b/chart-sdk/maui/maps/data-labels.md @@ -1,15 +1,15 @@ --- layout: post -title: Data Labels in .NET MAUI Maps control | Syncfusion® -description: Learn all about the Data Labels feature of Syncfusion® .NET MAUI Maps (SfMaps) control to add labels to the shapes and more. +title: Data Labels in .NET MAUI Maps | Syncfusion® +description: Data Labels in .NET MAUI Maps display descriptive information for map elements, helping identify locations and improve geographic data visualization. platform: chart-sdk control: SfMaps documentation: ug --- -# Data Labels in .NET MAUI Maps (SfMaps) +# Data Labels in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. Data labels provide identification for the shapes by displaying their names. You can trim or hide the labels if they exceed the shape bounds. diff --git a/chart-sdk/maui/maps/getting-started.md b/chart-sdk/maui/maps/getting-started.md index 6c967cc22..17b7e3078 100644 --- a/chart-sdk/maui/maps/getting-started.md +++ b/chart-sdk/maui/maps/getting-started.md @@ -1,16 +1,16 @@ --- layout: post -title: Getting started with .NET MAUI Maps control | Syncfusion® -description: Learn here about getting started with Syncfusion® .NET MAUI Maps (SfMaps) control, its elements, and more. +title: Getting Started with .NET MAUI Maps | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Maps control. Explore setup, layers, markers, shapes, and geographic visualization features. platform: chart-sdk control: SfMaps documentation: ug keywords: .net maui maps, .net maui maps library. --- -# Getting started with .NET MAUI Maps (SfMaps) +# Getting Started with .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. This section explains the steps required to add the maps control with the shape layer and its elements such as data labels, tooltip, markers, and legends. This section covers only basic features needed to know to get started with Syncfusion® maps. Follow the steps below to add .NET MAUI Maps control to your project. diff --git a/chart-sdk/maui/maps/legend.md b/chart-sdk/maui/maps/legend.md index fe67142c9..69c03bf02 100644 --- a/chart-sdk/maui/maps/legend.md +++ b/chart-sdk/maui/maps/legend.md @@ -1,15 +1,15 @@ --- layout: post -title: Legend in .NET MAUI Maps control | Syncfusion® -description: Learn all about the Legend feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance including text, icon and more. +title: Legend in .NET MAUI Maps | Syncfusion® +description: Legend in .NET MAUI Maps displays map data categories with customizable styles, helping users identify and interpret geographic information effectively. platform: chart-sdk control: SfMaps documentation: ug --- -# Legend in .NET MAUI Maps (SfMaps) +# Legend in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. Using a legend, you can provide clear information on the data plotted on the map. diff --git a/chart-sdk/maui/maps/markers.md b/chart-sdk/maui/maps/markers.md index 12396c37b..9e65cd6f9 100644 --- a/chart-sdk/maui/maps/markers.md +++ b/chart-sdk/maui/maps/markers.md @@ -1,7 +1,7 @@ --- layout: post -title: Markers in .NET MAUI Maps control | Syncfusion -description: Learn all about the Markers feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance, including text, icon and more. +title: Markers in .NET MAUI Maps | Syncfusion® +description: Markers in .NET MAUI Maps highlight geographic locations using customizable symbols, improving map visualization and location-based data representation. platform: chart-sdk control: SfMaps documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui maps, .net maui interactive map marker. Markers can be used to denote locations. It is possible to use the built-in symbols or display a custom control at a specific latitude and longitude on a map. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps markers, you can check the following video. diff --git a/chart-sdk/maui/maps/migration.md b/chart-sdk/maui/maps/migration.md index d657b314d..9567a25a2 100644 --- a/chart-sdk/maui/maps/migration.md +++ b/chart-sdk/maui/maps/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migrate from Xamarin SfMaps to .NET MAUI Maps | Syncfusion® -description: Learn here all about Migrating from Syncfusion® Xamarin SfMaps to Syncfusion® .NET MAUI Maps control and more. +title: Migrate Xamarin.Forms SfMaps to .NET MAUI SfMaps | Syncfusion® +description: Migrate from Xamarin.Forms SfMaps to .NET MAUI SfMaps with updated APIs, improved performance, and modern mapping features for geographic visualization. platform: chart-sdk control: SfMaps documentation: ug --- -# Migrate from Xamarin.Forms SfMaps to .NET MAUI Maps +# Migrate from Xamarin.Forms SfMaps to .NET MAUI SfMaps To make the migration from the [Xamarin SfMaps](https://www.syncfusion.com/xamarin-ui-controls/xamarin-maps) to [.NET MAUI SfMaps](https://www.syncfusion.com/maui-controls/maui-maps) easier, most of the APIs from the Xamarin SfMaps are kept in the.NET MAUI SfMaps. However, some APIs have been renamed to maintain the consistency of API naming in the .NET MAUI SfMaps. Please find the difference in the following topics. diff --git a/chart-sdk/maui/maps/overview.md b/chart-sdk/maui/maps/overview.md index 9092a3960..983bca355 100644 --- a/chart-sdk/maui/maps/overview.md +++ b/chart-sdk/maui/maps/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: Overview of .NET MAUI Maps Control | Syncfusion -description: Learn here all about the introduction of Syncfusion® .NET MAUI Maps (SfMaps) control, its features, and more. +title: About Syncfusion® .NET MAUI Maps Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Maps control, including map layers, markers, legends, shapes, and geographic visualization features. platform: chart-sdk control: SfMaps documentation: ug --- -# .NET MAUI Maps (SfMaps) Overview +# About Syncfusion® .NET MAUI Maps Control The Syncfusion® [.NET MAUI Maps](https://www.syncfusion.com/maui-controls/maui-maps) control is a powerful data visualization component that displays statistical information for a geographical area. It has highly interactive and customizable features such as selection, tooltip, legends, markers, bubbles, and color mapping. Using the Maps control, you can generate maps for population density, sales, political boundaries, weather, elections, and routes. @@ -22,25 +22,25 @@ The Syncfusion® [.NET MAUI Maps](https://www.syncfusion.com/maui-controls/maui- ## Key features -- **[Shape layer](https://help.syncfusion.com/maui/maps/shape)** allows visualizing geographical regions using GeoJSON or shapefile data. -- **[Data labels](https://help.syncfusion.com/maui/maps/data-labels)** allows displaying names or information for map shapes with intelligent layout handling. -- **[Markers](https://help.syncfusion.com/maui/maps/markers)** allows placing symbols or custom UI elements at specific latitude and longitude locations. -- **[Bubbles](https://help.syncfusion.com/maui/maps/bubble)** allows representing data values using varying sizes and colors of bubbles. -- **[Shape selection](https://help.syncfusion.com/maui/maps/selection)** allows highlighting specific regions and handling selection interactions. -- **[Legend](https://help.syncfusion.com/maui/maps/legend)** allows explaining the data representation used in the map for better understanding. -- **[Colors](https://help.syncfusion.com/maui/maps/shape#shape-color)** allows categorizing and styling regions based on underlying data values or ranges. -- **[Tooltip](https://help.syncfusion.com/maui/maps/tooltip)** allows displaying additional information for shapes, markers, and bubbles interactively. +- **[Shape layer](https://help.syncfusion.com/chart-sdk/maui/maps/shape)** allows visualizing geographical regions using GeoJSON or shapefile data. +- **[Data labels](https://help.syncfusion.com/chart-sdk/maui/maps/data-labels)** allows displaying names or information for map shapes with intelligent layout handling. +- **[Markers](https://help.syncfusion.com/chart-sdk/maui/maps/markers)** allows placing symbols or custom UI elements at specific latitude and longitude locations. +- **[Bubbles](https://help.syncfusion.com/chart-sdk/maui/maps/bubble)** allows representing data values using varying sizes and colors of bubbles. +- **[Shape selection](https://help.syncfusion.com/chart-sdk/maui/maps/selection)** allows highlighting specific regions and handling selection interactions. +- **[Legend](https://help.syncfusion.com/chart-sdk/maui/maps/legend)** allows explaining the data representation used in the map for better understanding. +- **[Colors](https://help.syncfusion.com/chart-sdk/maui/maps/shape#shape-color)** allows categorizing and styling regions based on underlying data values or ranges. +- **[Tooltip](https://help.syncfusion.com/chart-sdk/maui/maps/tooltip)** allows displaying additional information for shapes, markers, and bubbles interactively. ## Related controls -- [TreeMap](https://help.syncfusion.com/maui/treemap/overview) for displaying hierarchical and comparative data visualization. -- [DataGrid](https://help.syncfusion.com/maui/datagrid/overview) for managing and presenting location-based data in tabular format. -- [Cartesian Charts](https://help.syncfusion.com/maui/cartesian-charts/overview) for visualizing geographical or statistical data trends using interactive charts. +- [TreeMap](https://help.syncfusion.com/chart-sdk/maui/treemap/overview) for displaying hierarchical and comparative data visualization. +- [DataGrid](https://help.syncfusion.com/chart-sdk/maui/datagrid/overview) for managing and presenting location-based data in tabular format. +- [Cartesian Charts](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for visualizing geographical or statistical data trends using interactive charts. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/maps/getting-started) shows a step‑by‑step guide to begin using the Maps control. -- [Vector Layers](https://help.syncfusion.com/maui/maps/vector-layers/line-layer) lets you add line, polygon, or point layers to visualize geographic data clearly. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started) shows a step‑by‑step guide to begin using the Maps control. +- [Vector Layers](https://help.syncfusion.com/chart-sdk/maui/maps/vector-layers/line-layer) lets you add line, polygon, or point layers to visualize geographic data clearly. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/maps/selection.md b/chart-sdk/maui/maps/selection.md index 652c78318..e373f4740 100644 --- a/chart-sdk/maui/maps/selection.md +++ b/chart-sdk/maui/maps/selection.md @@ -1,7 +1,7 @@ --- layout: post -title: Shape Selection in .NET MAUI Maps control | Syncfusion® -description: Learn here all about the Shape Selection feature of Syncfusion® .NET MAUI Maps (SfMaps) control and more. +title: Shape Selection in .NET MAUI Maps | Syncfusion® +description: Shape Selection in .NET MAUI Maps allows map shapes to be highlighted on interaction, improving geographic data analysis and user engagement. platform: chart-sdk control: SfMaps documentation: ug @@ -11,7 +11,7 @@ documentation: ug You can select a shape to highlight that area on a map. You can use the event for performing any action during shape selection. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. ## Enable shape selection diff --git a/chart-sdk/maui/maps/shape-sublayer.md b/chart-sdk/maui/maps/shape-sublayer.md index 2e85ae7d9..d4af9a482 100644 --- a/chart-sdk/maui/maps/shape-sublayer.md +++ b/chart-sdk/maui/maps/shape-sublayer.md @@ -1,7 +1,7 @@ --- layout: post -title: Shape Sublayer in .NET MAUI Maps control | Syncfusion® -description: Learn here all about the Shape Sublayer feature of the Syncfusion® .NET MAUI Maps (SfMaps) control to customize their appearances and more. +title: Shape Sublayer in .NET MAUI Maps | Syncfusion® +description: Shape Sublayer in .NET MAUI Maps overlays additional shape data on maps, enabling visualization of multiple geographic layers within a single map view. platform: chart-sdk control: SfMaps documentation: ug @@ -11,7 +11,7 @@ documentation: ug The shape sublayer is where geographical rendering will happen for the sublayer. This is similar to the main [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html) rendering. This section explains adding a shape sublayer on the shape layer. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps shape sub layer, you can check the following video. @@ -457,7 +457,7 @@ public class Model You can enable bubbles to the shape sublayer using the [`ShowBubbles`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeSublayer.html#Syncfusion_Maui_Maps_MapShapeSublayer_ShowBubbles) property. You can customize the bubbles appearance using the [`BubbleSettings`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeSublayer.html#Syncfusion_Maui_Maps_MapShapeSublayer_BubbleSettings) property. This property is used to specify the value based on which the bubble's size has to be rendered. -N> Refer to the [`Bubbles`](https://help.syncfusion.com/maui/maps/bubble) section, to know more about the bubbles customization. +N> Refer to the [`Bubbles`](https://help.syncfusion.com/chart-sdk/maui/maps/bubble) section, to know more about the bubbles customization. {% tabs %} @@ -569,7 +569,7 @@ You can enable tooltip for the shape sublayer using the [`ShowShapeTooltip`](htt N> It is applicable for shape layer. -N> Refer to the [`Tooltip`](https://help.syncfusion.com/maui/maps/tooltip) section to know more about the tooltip customization. +N> Refer to the [`Tooltip`](https://help.syncfusion.com/chart-sdk/maui/maps/tooltip) section to know more about the tooltip customization. {% tabs %} @@ -768,7 +768,7 @@ The [`ShapeSelected`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.M N> It is applicable for shape layer. -N> Refer to the [`Shape selection`](https://help.syncfusion.com/maui/maps/selection) section to know more about the selection feature. +N> Refer to the [`Shape selection`](https://help.syncfusion.com/chart-sdk/maui/maps/selection) section to know more about the selection feature. {% tabs %} @@ -878,8 +878,8 @@ You can show markers at any position on the map by providing latitude and longit N> It is applicable for both tile layer and shape layer. N> -* Refer to the [`Markers`](https://help.syncfusion.com/maui/maps/markers) section to know more about the marker feature. -* Refer to the [`Tooltip`](https://help.syncfusion.com/maui/maps/tooltip) section to know more about the tooltip feature. +* Refer to the [`Markers`](https://help.syncfusion.com/chart-sdk/maui/maps/markers) section to know more about the marker feature. +* Refer to the [`Tooltip`](https://help.syncfusion.com/chart-sdk/maui/maps/tooltip) section to know more about the tooltip feature. N> You can refer to our [.NET MAUI Maps](https://www.syncfusion.com/maui-controls/maui-maps) feature tour page for its groundbreaking feature representations. You can also explore our [.NET MAUI Maps Sublayer example](https://github.com/syncfusion/maui-demos/tree/master/MAUI/Maps) that shows how to configure a Maps in .NET MAUI. \ No newline at end of file diff --git a/chart-sdk/maui/maps/shape.md b/chart-sdk/maui/maps/shape.md index c94701e74..fa0a714f6 100644 --- a/chart-sdk/maui/maps/shape.md +++ b/chart-sdk/maui/maps/shape.md @@ -1,7 +1,7 @@ --- layout: post -title: Shape in .NET MAUI Maps control | Syncfusion® -description: Learn all about different shape appearance customization options of the Syncfusion® .NET MAUI Maps (SfMaps) control. +title: Shapes in .NET MAUI Maps | Syncfusion® +description: Shapes in .NET MAUI Maps display geographic regions using shape data, enabling interactive visualization and analysis of location-based information. platform: chart-sdk control: SfMaps documentation: ug @@ -12,7 +12,7 @@ keywords: .net maui maps, .net maui shape maps. This section explains shapes, how to map the data source, add shape layer map elements, and apply colors to them based on specific values in the .NET MAUI Maps. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps shape layer, you can check the following video. @@ -261,13 +261,13 @@ public class Model Add the basic maps elements such as data labels, legend, and tooltip as shown in the below code snippet. -* **[Data labels](https://help.syncfusion.com/maui/maps/data-labels)** - You can show data labels using the [`ShowDataLabels`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShowDataLabels) property and also, customize it using the [`DataLabelSettings`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_DataLabelSettings) property. +* **[Data labels](https://help.syncfusion.com/chart-sdk/maui/maps/data-labels)** - You can show data labels using the [`ShowDataLabels`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShowDataLabels) property and also, customize it using the [`DataLabelSettings`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_DataLabelSettings) property. -* **[Markers](https://help.syncfusion.com/maui/maps/markers)** - You can show markers at any position on the map by providing latitude and longitude position to the [`MapMarker`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapMarker.html), which is from the [`Markers`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLayer.html#Syncfusion_Maui_Maps_MapLayer_Markers) collection. +* **[Markers](https://help.syncfusion.com/chart-sdk/maui/maps/markers)** - You can show markers at any position on the map by providing latitude and longitude position to the [`MapMarker`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapMarker.html), which is from the [`Markers`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLayer.html#Syncfusion_Maui_Maps_MapLayer_Markers) collection. -* **[Legend](https://help.syncfusion.com/maui/maps/legend)** - You can enable legend using the [`Legend`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_Legend) property. The legend's text is displayed based on the [`ColorMapping.Text`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.ColorMapping.html#Syncfusion_Maui_Maps_ColorMapping_Text) property. It is possible to customize the legend text using the [`TextStyle`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLegend.html#Syncfusion_Maui_Maps_MapLegend_TextStyle) property. +* **[Legend](https://help.syncfusion.com/chart-sdk/maui/maps/legend)** - You can enable legend using the [`Legend`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_Legend) property. The legend's text is displayed based on the [`ColorMapping.Text`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.ColorMapping.html#Syncfusion_Maui_Maps_ColorMapping_Text) property. It is possible to customize the legend text using the [`TextStyle`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLegend.html#Syncfusion_Maui_Maps_MapLegend_TextStyle) property. -* **[Tooltip](https://help.syncfusion.com/maui/maps/tooltip)** - You can enable tooltip for the shapes using the [`ShowShapeTooltip`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShowShapeTooltip) property. It will be displayed when you interact with the shapes, i.e., while tapping on touch devices and hovering on mouse-enabled devices. +* **[Tooltip](https://help.syncfusion.com/chart-sdk/maui/maps/tooltip)** - You can enable tooltip for the shapes using the [`ShowShapeTooltip`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html#Syncfusion_Maui_Maps_MapShapeLayer_ShowShapeTooltip) property. It will be displayed when you interact with the shapes, i.e., while tapping on touch devices and hovering on mouse-enabled devices. {% tabs %} diff --git a/chart-sdk/maui/maps/tile-layer.md b/chart-sdk/maui/maps/tile-layer.md index 9f43d59b8..0347dcdb1 100644 --- a/chart-sdk/maui/maps/tile-layer.md +++ b/chart-sdk/maui/maps/tile-layer.md @@ -1,7 +1,7 @@ --- layout: post -title: Tile Layer in .NET MAUI Maps control | Syncfusion -description: Learn here all about the Tile Layer feature of the Syncfusion® .NET MAUI Maps (SfMaps) control to customize their appearances and more. +title: Tile Layer in .NET MAUI Maps | Syncfusion® +description: Tile Layer in .NET MAUI Maps displays map tiles from online or custom sources, enabling interactive and scalable map visualization. platform: chart-sdk control: SfMaps documentation: ug @@ -11,7 +11,7 @@ documentation: ug The tile layer renders the tiles returned from web map tile services such as Bing Maps, OpenStreetMaps, Google Maps, TomTom, etc. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps tile layer, you can check the following video. @@ -93,7 +93,7 @@ private async Task GenerateBing(MapTileLayer tileLayer) Our tile layer is not limited or specific to any tile providers mentioned here. It supports requesting tiles from any tile providers using the unique URL for respective tile providers and renders them. -For other map providers like TomTom, MapBox, etc., you can check the respective official websites and provide the URL in the format mentioned in the [`Setting URL template`](https://help.syncfusion.com/maui/maps/tile-layer#setting-url-template) section. +For other map providers like TomTom, MapBox, etc., you can check the respective official websites and provide the URL in the format mentioned in the [`Setting URL template`](https://help.syncfusion.com/chart-sdk/maui/maps/tile-layer#setting-url-template) section. Below is the example of adding TomTom map. You can get the TomTom API key from this [`link`](https://developer.tomtom.com/map-display-api/documentation/product-information/introduction). @@ -113,7 +113,7 @@ this.Content = map; You can set the center position by setting the [`MapTileLayer.Center`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapTileLayer.html#Syncfusion_Maui_Maps_MapTileLayer_Center) property. It represents the center position of the map layer. -Based on the size of the [`SfMaps`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.html) control, [`Center`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapTileLayer.html#Syncfusion_Maui_Maps_MapTileLayer_Center) and [`ZoomLevel`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapZoomPanBehavior.html#Syncfusion_Maui_Maps_MapZoomPanBehavior_ZoomLevel), the number of initial tiles needed in the viewport alone will be rendered. Refer this section for enabling [`zooming and panning`](https://help.syncfusion.com/maui/maps/zoom-pan). +Based on the size of the [`SfMaps`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.html) control, [`Center`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapTileLayer.html#Syncfusion_Maui_Maps_MapTileLayer_Center) and [`ZoomLevel`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapZoomPanBehavior.html#Syncfusion_Maui_Maps_MapZoomPanBehavior_ZoomLevel), the number of initial tiles needed in the viewport alone will be rendered. Refer this section for enabling [`zooming and panning`](https://help.syncfusion.com/chart-sdk/maui/maps/zoom-pan). Defaults to [`MapLatLng`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLatLng.html)`(0.0, 0.0)`. @@ -213,7 +213,7 @@ tileLayer.DeleteTilesFromCache(); ## Markers -You can add markers in the tile layer. The procedure is very similar to the shape layer. Kindly refer to the [markers](https://help.syncfusion.com/maui/maps/markers) section. +You can add markers in the tile layer. The procedure is very similar to the shape layer. Kindly refer to the [markers](https://help.syncfusion.com/chart-sdk/maui/maps/markers) section. ## Event diff --git a/chart-sdk/maui/maps/tooltip.md b/chart-sdk/maui/maps/tooltip.md index aa00a2a11..4fd4b3f95 100644 --- a/chart-sdk/maui/maps/tooltip.md +++ b/chart-sdk/maui/maps/tooltip.md @@ -1,7 +1,7 @@ --- layout: post -title: Tooltip in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding the Tooltip feature of Syncfusion® .NET MAUI Maps (SfMaps) control and more. +title: Tooltip in .NET MAUI Maps | Syncfusion® +description: Tooltip in .NET MAUI Maps displays detailed information for map elements on interaction, helping users understand and analyze geographic data. platform: chart-sdk control: SfMaps documentation: ug @@ -11,7 +11,7 @@ documentation: ug A tooltip indicates the shape, bubble, and marker information during the tap or hover interactions. This section demonstrates how to show tooltips for the shapes, bubbles, and markers in the maps and how to customize them. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps tooltip, you can check the following video. diff --git a/chart-sdk/maui/maps/vector-layers/arc-layer.md b/chart-sdk/maui/maps/vector-layers/arc-layer.md index 84fb77072..549acba42 100644 --- a/chart-sdk/maui/maps/vector-layers/arc-layer.md +++ b/chart-sdk/maui/maps/vector-layers/arc-layer.md @@ -1,15 +1,15 @@ --- layout: post -title: Adding Arc layer in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding the Arc Layer feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance and more. +title: Arc Layer in .NET MAUI Maps | Syncfusion® +description: Arc Layer in .NET MAUI Maps visualizes connections between geographic locations using curved lines, enabling effective representation of spatial relationships. platform: MAUI control: SfMaps documentation: ug --- -# Arc Layer in .NET MAUI Maps (SfMaps) +# Arc Layer in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The arc layer is a sublayer that renders a group of [`MapArc`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapArc.html) on a [`MapArcLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapArcLayer.html), which can be added as a sublayer of [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html). This section explains how to add and customize arcs. diff --git a/chart-sdk/maui/maps/vector-layers/circle-layer.md b/chart-sdk/maui/maps/vector-layers/circle-layer.md index 6fc0a6e91..d1b4bc1d3 100644 --- a/chart-sdk/maui/maps/vector-layers/circle-layer.md +++ b/chart-sdk/maui/maps/vector-layers/circle-layer.md @@ -1,15 +1,15 @@ --- layout: post -title: Adding Circle Layer in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding Circle Layer feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance and more. +title: Circle Layer in .NET MAUI Maps | Syncfusion® +description: Circle Layer in .NET MAUI Maps displays data using scalable circles, enabling effective visualization of geographic values and location-based information. platform: MAUI control: SfMaps documentation: ug --- -# Circle Layer in .NET MAUI Maps (SfMaps) +# Circle Layer in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The circle layer is a sublayer that renders a group of [`MapCircle`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapCircle.html) on a [`MapCircleLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapCircleLayer.html), which can be added as a sublayer of [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html). This section explains how to add and customize circles. diff --git a/chart-sdk/maui/maps/vector-layers/line-layer.md b/chart-sdk/maui/maps/vector-layers/line-layer.md index 7fb65260f..b824ac48a 100644 --- a/chart-sdk/maui/maps/vector-layers/line-layer.md +++ b/chart-sdk/maui/maps/vector-layers/line-layer.md @@ -1,15 +1,15 @@ --- layout: post -title: Lines in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding the Line Layer feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance and more. +title: Lines Layer in .NET MAUI Maps | Syncfusion® +description: Lines Layer in .NET MAUI Maps displays connections between geographic locations using line segments, enabling visualization of routes and spatial relationships. platform: MAUI control: SfMaps documentation: ug --- -# Lines in .NET MAUI Maps (SfMaps) +# Lines Layer in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The line layer is a sublayer that renders a group of [`MapLine`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLine.html) on a [`MapLineLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapLineLayer.html), which can be added as a sublayer of [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html). This section explains how to add and customize lines. diff --git a/chart-sdk/maui/maps/vector-layers/polygon-layer.md b/chart-sdk/maui/maps/vector-layers/polygon-layer.md index a1e55dbb1..c9b6ad9fc 100644 --- a/chart-sdk/maui/maps/vector-layers/polygon-layer.md +++ b/chart-sdk/maui/maps/vector-layers/polygon-layer.md @@ -1,15 +1,15 @@ --- layout: post -title: Adding polygons in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding the Polygons feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize its appearance and more. +title: Polygons Layer in .NET MAUI Maps | Syncfusion® +description: Polygons Layer in .NET MAUI Maps displays geographic regions using polygon shapes, enabling visualization and analysis of area-based spatial data. platform: MAUI control: SfMaps documentation: ug --- -# Polygons in .NET MAUI Maps (SfMaps) +# Polygons Layer in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **Maps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The polygon layer is a sublayer that renders a group of [`MapPolygon`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapPolygon.html) on a [`MapPolygonLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapPolygonLayer.html), which can be added as a sublayer of [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html). This section explains how to add and customize polygons. diff --git a/chart-sdk/maui/maps/vector-layers/polyline-layer.md b/chart-sdk/maui/maps/vector-layers/polyline-layer.md index 4a255556d..d22fc5bb7 100644 --- a/chart-sdk/maui/maps/vector-layers/polyline-layer.md +++ b/chart-sdk/maui/maps/vector-layers/polyline-layer.md @@ -1,15 +1,15 @@ --- layout: post -title: Adding Polylines in .NET MAUI Maps control | Syncfusion -description: Learn here all about adding the Polylines feature of Syncfusion® .NET MAUI Maps (SfMaps) control to customize their appearances and more. +title: Polylines Layer in .NET MAUI Maps | Syncfusion® +description: Polylines Layer in .NET MAUI Maps displays connected line paths between geographic locations, enabling visualization of routes and spatial relationships. platform: MAUI control: SfMaps documentation: ug --- -# Polylines in .NET MAUI Maps (SfMaps) +# Polylines Layer in .NET MAUI Maps -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. The polyline layer is a sublayer that renders a group of [`MapPolyline`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapPolyline.html) on [`MapShapeLayer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Maps.MapShapeLayer.html). This section explains how to add and customize polylines. diff --git a/chart-sdk/maui/maps/zoom-pan.md b/chart-sdk/maui/maps/zoom-pan.md index 99e105384..a7123508c 100644 --- a/chart-sdk/maui/maps/zoom-pan.md +++ b/chart-sdk/maui/maps/zoom-pan.md @@ -1,7 +1,7 @@ --- layout: post -title: Zooming and Panning in .NET MAUI Maps Control | Syncfusion -description: Learn here all about the Zooming and Panning feature of the Syncfusion® .NET MAUI Maps (SfMaps) control to customize their appearances and more. +title: Zooming and Panning in .NET MAUI Maps | Syncfusion® +description: Zooming and Panning in .NET MAUI Maps enable interactive navigation across map content, making it easier to explore and analyze geographic data. platform: chart-sdk control: SfMaps documentation: ug @@ -13,7 +13,7 @@ You can zoom in and out on any layer to take a closer look at a specific region The procedure for zooming and panning for both layers is very similar. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/maps/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfMaps** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/maps/getting-started)** guide. To learn more about the .NET MAUI Maps zoom and pan, you can check the following video. diff --git a/chart-sdk/maui/radial-gauge/animation.md b/chart-sdk/maui/radial-gauge/animation.md index 9a17d5249..0f98f0604 100644 --- a/chart-sdk/maui/radial-gauge/animation.md +++ b/chart-sdk/maui/radial-gauge/animation.md @@ -1,7 +1,7 @@ --- layout: post -title: Animation in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about Animation feature of Syncfusion® .NET MAUI Radial Gauge control with pointer animation support and more. +title: Animation in .NET MAUI Radial Gauge | Syncfusion® +description: Animation in .NET MAUI Radial Gauge provides smooth transitions for gauge elements, improving visual feedback and enhancing the overall user experience. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -13,7 +13,7 @@ documentation: ug The radial gauge allows all of its elements to be animated using the [`EnableLoadingAnimation`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialAxis.html#Syncfusion_Maui_Gauges_RadialAxis_EnableLoadingAnimation) property. The default value of this property is `false`. The duration of the loading animation can be controlled by using the [`AnimationDuration`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialAxis.html#Syncfusion_Maui_Gauges_RadialAxis_AnimationDuration) property of the [`RadialAxis`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialAxis.html). The default value of [`AnimationDuration`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialAxis.html#Syncfusion_Maui_Gauges_RadialAxis_AnimationDuration) is `1500` milliseconds. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/annotation.md b/chart-sdk/maui/radial-gauge/annotation.md index 7566f1017..53339e3a9 100644 --- a/chart-sdk/maui/radial-gauge/annotation.md +++ b/chart-sdk/maui/radial-gauge/annotation.md @@ -1,7 +1,7 @@ --- layout: post -title: Annotation in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about Annotation feature of Syncfusion® .NET MAUI Radial Gauge control with positioning support and more. +title: Annotation in .NET MAUI Radial Gauge | Syncfusion® +description: Annotation in .NET MAUI Radial Gauge displays custom content within the gauge, enabling additional information and enhanced visual presentation. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -23,7 +23,7 @@ The following properties are available in [`Annotation`](https://help.syncfusion * [`VerticalAlignment`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeAnnotation.html#Syncfusion_Maui_Gauges_GaugeAnnotation_VerticalAlignment), of the [`GaugeAlignment`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.GaugeAlignment.html) enum, specifies the vertical alignment for positioning the annotation. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/axes.md b/chart-sdk/maui/radial-gauge/axes.md index 4507821e9..f840f0d6b 100644 --- a/chart-sdk/maui/radial-gauge/axes.md +++ b/chart-sdk/maui/radial-gauge/axes.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Axis feature of Syncfusion® .NET MAUI Radial Gauge (SfRadialGauge) control using the custom scale support. +title: Axis in .NET MAUI Radial Gauge | Syncfusion® +description: Axis in .NET MAUI Radial Gauge defines the gauge scale and supports customizable ranges, labels, ticks, and styling for effective value representation. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug The [`Radial Axis`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialAxis.html) is a circular arc in which a set of values are displayed along a linear or custom scale based on the design requirements. Axis elements such as labels, ticks, and the axis line can be easily customized. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. ## Axis customization @@ -1273,7 +1273,7 @@ N> The [`OffsetUnit`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges ## Multiple axis -The [`radial gauge`](https://help.syncfusion.com/maui/radial-gauge/overview) allows you to add any number of radial axes to its [`Axes`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfRadialGauge.html#Syncfusion_Maui_Gauges_SfRadialGauge_Axes) collection. You can also customize each axis added to the collection independently. +The [`radial gauge`](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/overview) allows you to add any number of radial axes to its [`Axes`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfRadialGauge.html#Syncfusion_Maui_Gauges_SfRadialGauge_Axes) collection. You can also customize each axis added to the collection independently. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/content-pointer.md b/chart-sdk/maui/radial-gauge/content-pointer.md index 42e60bbb5..b512be45a 100644 --- a/chart-sdk/maui/radial-gauge/content-pointer.md +++ b/chart-sdk/maui/radial-gauge/content-pointer.md @@ -1,7 +1,7 @@ --- layout: post -title: Content Pointer in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about Content Pointer feature of the Syncfusion® .NET MAUI Radial Gauge control, including image, text pointer support and more. +title: Content Pointers in .NET MAUI Radial Gauge | Syncfusion® +description: Content Pointers in .NET MAUI Radial Gauge display custom content as pointers, enabling flexible value representation and enhanced gauge visualization. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug The [`ContentPointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.ContentPointer.html) in [`SfRadialGauge`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.SfRadialGauge.html) allows you to use any .NET MAUI content as a pointer. The following code sample uses a `RoundRectangle` and a `Label` as the content pointer. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/getting-started.md b/chart-sdk/maui/radial-gauge/getting-started.md index 0ce8d7b21..92a8feca1 100644 --- a/chart-sdk/maui/radial-gauge/getting-started.md +++ b/chart-sdk/maui/radial-gauge/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about getting started with Syncfusion® .NET MAUI Radial Gauge (SfRadialGauge) control and more. +title: Getting Started with .NET MAUI Radial Gauge | Syncfusion® +description: Learn how to get started with the Syncfusion® .NET MAUI Radial Gauge control. Explore setup, axes, pointers, ranges, annotations, and customization features. platform: chart-sdk control: SfRadialGauge documentation: ug diff --git a/chart-sdk/maui/radial-gauge/migration.md b/chart-sdk/maui/radial-gauge/migration.md index a6dc0f074..a9f109c37 100644 --- a/chart-sdk/maui/radial-gauge/migration.md +++ b/chart-sdk/maui/radial-gauge/migration.md @@ -1,7 +1,7 @@ --- layout: post -title: Migrate from Xamarin to .NET MAUI Radial Gauge | Syncfusion® -description: Learn here all about migrating from the Syncfusion Xamarin SfCircularGauge to the Syncfusion® .NET MAUI SfRadialGauge control and more. +title: Migrate SfCircularGauge to .NET MAUI SfRadialGauge | Syncfusion® +description: Migrate from Xamarin.Forms SfCircularGauge to .NET MAUI SfRadialGauge with updated APIs, improved performance, and modern gauge visualization features. platform: chart-sdk control: SfRadialGauge documentation: ug diff --git a/chart-sdk/maui/radial-gauge/needle-pointer.md b/chart-sdk/maui/radial-gauge/needle-pointer.md index 5c1590016..73f3f5e10 100644 --- a/chart-sdk/maui/radial-gauge/needle-pointer.md +++ b/chart-sdk/maui/radial-gauge/needle-pointer.md @@ -1,7 +1,7 @@ --- layout: post -title: Needle Pointer in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Needle Pointer feature of Syncfusion® .NET MAUI Radial Gauge control using the customization support. +title: Needle Pointer in .NET MAUI Radial Gauge | Syncfusion® +description: Needle Pointer in .NET MAUI Radial Gauge indicates values using a needle-shaped pointer, enabling precise measurement and intuitive gauge visualization. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug The [`Needle Pointer`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.NeedlePointer.html) contains three parts, namely needle, knob, and tail, and can be placed on a gauge to mark values. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/overview.md b/chart-sdk/maui/radial-gauge/overview.md index 224087ab9..3a8badbf6 100644 --- a/chart-sdk/maui/radial-gauge/overview.md +++ b/chart-sdk/maui/radial-gauge/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: About .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about introduction of Syncfusion® .NET MAUI Radial Gauge(SfRadialGauge) control with key features and more. +title: About Syncfusion® .NET MAUI Radial Gauge Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI Radial Gauge control, including axes, pointers, ranges, annotations, and customization features. platform: chart-sdk control: SfRadialGauge documentation: ug --- -# Overview of .NET MAUI Radial Gauge +# About Syncfusion® .NET MAUI Radial Gauge Control The Syncfusion® [.NET MAUI Radial Gauge](https://www.syncfusion.com/maui-controls/maui-radial-gauge) is a multi-purpose data visualization control, that displays numerical values on a circular scale. It has a rich set of features such as axes, ranges, pointers, and annotations that are fully customizable and extendable. Use it to create speedometers, temperature monitors, dashboards, meter gauges, multi axis clocks, watches, progress indicators, compasses, and more. @@ -80,15 +80,15 @@ The following table summarizes the globalization support available in this contr ## Related controls -- [Linear Gauge](https://help.syncfusion.com/maui/linear-gauge/overview) for displaying values along a linear scale. -- [Circular Charts](https://help.syncfusion.com/maui/circular-charts/overview) for visualizing proportional data using circular charts. -- [Digital Gauge](https://help.syncfusion.com/maui/digitalgauge/overview) for displaying numeric or character values using segmented digital display styles. +- [Linear Gauge](https://help.syncfusion.com/chart-sdk/maui/linear-gauge/overview) for displaying values along a linear scale. +- [Circular Charts](https://help.syncfusion.com/chart-sdk/maui/circular-charts/overview) for visualizing proportional data using circular charts. +- [Digital Gauge](https://help.syncfusion.com/chart-sdk/maui/digitalgauge/overview) for displaying numeric or character values using segmented digital display styles. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started) shows a step‑by‑step guide to begin using the Radial Gauge control. -- [Pointers](https://help.syncfusion.com/maui/radial-gauge/pointers) explains how to configure different pointer types and behavior. -- [Annotation](https://help.syncfusion.com/maui/radial-gauge/annotation) helps add labels, shapes, or custom content inside the gauge for context. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started) shows a step‑by‑step guide to begin using the Radial Gauge control. +- [Pointers](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/pointers) explains how to configure different pointer types and behavior. +- [Annotation](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/annotation) helps add labels, shapes, or custom content inside the gauge for context. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/radial-gauge/pointers.md b/chart-sdk/maui/radial-gauge/pointers.md index 3e805974c..042303a90 100644 --- a/chart-sdk/maui/radial-gauge/pointers.md +++ b/chart-sdk/maui/radial-gauge/pointers.md @@ -1,7 +1,7 @@ --- layout: post -title: Pointers in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Pointers feature of Syncfusion® .NET MAUI Radial Gauge control with multiple pointer support and more. +title: Pointers in .NET MAUI Radial Gauge | Syncfusion® +description: Pointers in .NET MAUI Radial Gauge indicate values along the gauge axis using different pointer types, enabling accurate and effective data visualization. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,14 +11,14 @@ documentation: ug A pointer is used to indicate values on an axis. The radial gauge control has the following types of pointers: -* [`Shape pointer`](https://help.syncfusion.com/maui/radial-gauge/shape-pointer) -* [`Content pointer`](https://help.syncfusion.com/maui/radial-gauge/content-pointer) -* [`Needle pointer`](https://help.syncfusion.com/maui/radial-gauge/needle-pointer) -* [`Range pointer`](https://help.syncfusion.com/maui/radial-gauge/range-pointer) +* [`Shape pointer`](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/shape-pointer) +* [`Content pointer`](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/content-pointer) +* [`Needle pointer`](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/needle-pointer) +* [`Range pointer`](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/range-pointer) All the pointers can be customized as needed. You can add multiple pointers to the gauge to point to multiple values on the same scale. The value of the pointer is set using the [`Value`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.RadialPointer.html#Syncfusion_Maui_Gauges_RadialPointer_Value) property. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. ![Pointers in .NET MAUI Radial Gauge](images/pointers/maui-radial-gauge-pointers.png) diff --git a/chart-sdk/maui/radial-gauge/range-pointer.md b/chart-sdk/maui/radial-gauge/range-pointer.md index f0f468c56..ec5236346 100644 --- a/chart-sdk/maui/radial-gauge/range-pointer.md +++ b/chart-sdk/maui/radial-gauge/range-pointer.md @@ -1,7 +1,7 @@ --- layout: post -title: Range Pointer in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Range Pointer feature of Syncfusion® .NET MAUI Radial Gauge control with customization support. +title: Range Pointer in .NET MAUI Radial Gauge | Syncfusion® +description: Range Pointer in .NET MAUI Radial Gauge highlights values using a filled arc along the gauge axis, enabling clear progress tracking and value visualization. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug A range pointer is an accenting line or shaded background range that can be placed on a gauge to mark the current value. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/radial-gauge/ranges.md b/chart-sdk/maui/radial-gauge/ranges.md index 84e0f0e4c..0ef289b89 100644 --- a/chart-sdk/maui/radial-gauge/ranges.md +++ b/chart-sdk/maui/radial-gauge/ranges.md @@ -1,7 +1,7 @@ --- layout: post -title: Radial Range in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Range feature of Syncfusion® .NET MAUI Radial Gauge control with customization support and more. +title: Radial Range in .NET MAUI Radial Gauge | Syncfusion® +description: Radial Range in .NET MAUI Radial Gauge highlights specific value intervals on the gauge axis, improving data visualization and emphasizing important thresholds. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug A radial range is a visual element that helps to quickly visualize where a value falls on the axis. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. ## Setting start and end values diff --git a/chart-sdk/maui/radial-gauge/shape-pointer.md b/chart-sdk/maui/radial-gauge/shape-pointer.md index 4f2127a4e..6ae0317d8 100644 --- a/chart-sdk/maui/radial-gauge/shape-pointer.md +++ b/chart-sdk/maui/radial-gauge/shape-pointer.md @@ -1,7 +1,7 @@ --- layout: post -title: Shape Pointer in .NET MAUI Radial Gauge control | Syncfusion® -description: Learn here all about the Shape Pointer feature of Syncfusion® .NET MAUI Radial Gauge control with built-in shapes. +title: Shape Pointer in .NET MAUI Radial Gauge | Syncfusion® +description: Shape Pointer in .NET MAUI Radial Gauge displays values using customizable pointer shapes, enabling clear value indication and enhanced gauge visualization. platform: chart-sdk control: SfRadialGauge documentation: ug @@ -11,7 +11,7 @@ documentation: ug Indicate current values by using different types of shape pointers. You can change the shape type using the [`ShapeType`](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.Gauges.ShapeType.html) property. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/radial-gauge/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **SfRadialGauge** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/radial-gauge/getting-started)** guide. {% tabs %} diff --git a/chart-sdk/maui/treemap/accessibility.md b/chart-sdk/maui/treemap/accessibility.md index e7f2b3a43..46e5ee9c4 100644 --- a/chart-sdk/maui/treemap/accessibility.md +++ b/chart-sdk/maui/treemap/accessibility.md @@ -1,19 +1,19 @@ --- layout: post -title: Accessibility in .NET MAUI TreeMap (SfTreeMap) Control | Syncfusion® -description: Learn here about performing actions using accessibility in Syncfusion® .NET MAUI TreeMap (SfTreeMap) control. +title: Accessibility in .NET MAUI TreeMap | Syncfusion® +description: Accessibility in .NET MAUI TreeMap provides support for keyboard navigation, screen readers, and assistive technologies, improving usability for all users. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Accessibility in .NET MAUI TreeMap (SfTreeMap) +# Accessibility in .NET MAUI TreeMap The .NET MAUI TreeMap (SfTreeMap) control supports keyboard navigation and provides accessible descriptions of its items for assistive technologies such as Narrator and VoiceOver. This topic covers the keyboard shortcuts available in the control and explains how selection behavior interacts with keyboard focus. Keyboard navigation is enabled by default; no additional configuration is required to move focus between items. To interact with the control using the keyboard, first set focus on the TreeMap (for example, by clicking an item or by tabbing to the control from the previous focusable element). Keyboard shortcuts are supported on Windows and macOS only. On Android and iOS, the keyboard shortcuts have no effect and interaction is performed through touch gestures. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Keyboard shortcuts in .NET MAUI TreeMap (SfTreeMap) diff --git a/chart-sdk/maui/treemap/brush-settings.md b/chart-sdk/maui/treemap/brush-settings.md index 48b2d2f06..583512d0e 100644 --- a/chart-sdk/maui/treemap/brush-settings.md +++ b/chart-sdk/maui/treemap/brush-settings.md @@ -1,15 +1,15 @@ --- layout: post -title: Brush Settings in .NET MAUI TreeMap Control | Syncfusion® -description: Learn here how to apply brush settings for tree map items in Syncfusion® .NET MAUI TreeMap control, enhancing the tree map visualization. +title: Brush Settings in .NET MAUI TreeMap | Syncfusion® +description: Brush Settings in .NET MAUI TreeMap customize item colors using solid, gradient, and palette brushes, improving visual distinction and data presentation. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Brush Settings in .NET MAUI TreeMap (SfTreeMap) +# Brush Settings in .NET MAUI TreeMap -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Leaf Item Brush Settings diff --git a/chart-sdk/maui/treemap/drilldown.md b/chart-sdk/maui/treemap/drilldown.md index 36739bdeb..02b5c8d84 100644 --- a/chart-sdk/maui/treemap/drilldown.md +++ b/chart-sdk/maui/treemap/drilldown.md @@ -1,17 +1,17 @@ --- layout: post -title: Drilldown support in .NET MAUI TreeMap Control | Syncfusion® -description: Learn here all about Drilldown feature and the header customization of Syncfusion® .NET MAUI TreeMap (SfTreeMap) control and more. +title: Drilldown in .NET MAUI TreeMap | Syncfusion® +description: Drilldown in .NET MAUI TreeMap enables interactive navigation through hierarchical data, allowing deeper exploration of grouped items and levels. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Drilldown in .NET MAUI TreeMap (SfTreeMap) +# Drilldown in .NET MAUI TreeMap The drilldown feature in the .NET MAUI TreeMap provides a better visualization of hierarchical data by breaking a large dataset down into smaller, focused views. Each level of items can be drilled into, and the control animates the transition between levels during drilldown. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. N> Drilldown requires at least one [TreeMapLevel](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.TreeMapLevel.html) to be configured in the `Levels` collection. For more information about levels, refer to the [Levels](levels.md) documentation. diff --git a/chart-sdk/maui/treemap/events.md b/chart-sdk/maui/treemap/events.md index c454738cf..f0fc074dc 100644 --- a/chart-sdk/maui/treemap/events.md +++ b/chart-sdk/maui/treemap/events.md @@ -1,15 +1,15 @@ --- layout: post -title: Events in .NET MAUI TreeMap (SfTreeMap) Control | Syncfusion® -description: Learn here all about the Events support in the Syncfusion® .NET MAUI TreeMap (SfTreeMap) control and more. +title: Events in .NET MAUI TreeMap | Syncfusion® +description: Events in .NET MAUI TreeMap provide notifications for user interactions and control actions, enabling customized behavior and interactive experiences. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Events in .NET MAUI TreeMap (SfTreeMap) +# Events in .NET MAUI TreeMap -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## SelectionChanged event diff --git a/chart-sdk/maui/treemap/getting-started.md b/chart-sdk/maui/treemap/getting-started.md index 8c11f0422..0184fc468 100644 --- a/chart-sdk/maui/treemap/getting-started.md +++ b/chart-sdk/maui/treemap/getting-started.md @@ -1,13 +1,13 @@ --- layout: post title: Getting Started with .NET MAUI TreeMap | Syncfusion® -description: Learn about getting started with Syncfusion® .NET MAUI TreeMap (SfTreeMap) in mobile and desktop applications from a single shared codebase. +description: Learn how to get started with the Syncfusion® .NET MAUI TreeMap control. Explore setup, hierarchical data visualization, customization, and key features. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Getting Started with the .NET MAUI TreeMap +# Getting Started with .NET MAUI TreeMap This section provides a quick overview of how to get started with the [.NET MAUI SfTreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map) and a walk-through to configure the .NET MAUI TreeMap in a real-time scenario. Follow the steps below to add the .NET MAUI TreeMap control to your project. diff --git a/chart-sdk/maui/treemap/layouts.md b/chart-sdk/maui/treemap/layouts.md index 0d95ac0de..1274017ee 100644 --- a/chart-sdk/maui/treemap/layouts.md +++ b/chart-sdk/maui/treemap/layouts.md @@ -1,17 +1,17 @@ --- layout: post -title: Layout Types in .NET MAUI TreeMap (SfTreeMap) Control | Syncfusion® -description: Learn here all about adding different layouts of the Syncfusion® .NET MAUI TreeMap (SfTreeMap) control and more. +title: Layouts in .NET MAUI TreeMap | Syncfusion® +description: Layouts in .NET MAUI TreeMap determine how hierarchical data is arranged, enabling clear visualization through different layout algorithms and structures. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Layouts in .NET MAUI TreeMap (SfTreeMap) +# Layouts in .NET MAUI TreeMap The TreeMap control provides multiple layout types for organizing hierarchical data effectively. You can utilize the [LayoutType](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.SfTreeMap.html#Syncfusion_Maui_TreeMap_SfTreeMap_LayoutType) property within the [SfTreeMap](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.SfTreeMap.html) to switch between four distinct layouts: [Squarified](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.LayoutType.html#Syncfusion_Maui_TreeMap_LayoutType_Squarified), [SliceAndDiceAuto](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.LayoutType.html#Syncfusion_Maui_TreeMap_LayoutType_SliceAndDiceAuto), [SliceAndDiceHorizontal](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.LayoutType.html#Syncfusion_Maui_TreeMap_LayoutType_SliceAndDiceHorizontal), and [SliceAndDiceVertical](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.LayoutType.html#Syncfusion_Maui_TreeMap_LayoutType_SliceAndDiceVertical). -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Squarified diff --git a/chart-sdk/maui/treemap/leaf-item-settings.md b/chart-sdk/maui/treemap/leaf-item-settings.md index 4bcfe6bab..50ed8b272 100644 --- a/chart-sdk/maui/treemap/leaf-item-settings.md +++ b/chart-sdk/maui/treemap/leaf-item-settings.md @@ -1,17 +1,17 @@ --- layout: post title: Leaf Item Settings in .NET MAUI TreeMap | Syncfusion® -description: Learn about leaf items in Syncfusion® .NET MAUI TreeMap, including key features and functionalities for effective and insightful TreeMap visualization. +description: Leaf Item Settings in .NET MAUI TreeMap customize the appearance and behavior of leaf nodes, improving data representation and visual clarity. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Leaf Item Settings in .NET MAUI TreeMap (SfTreeMap) +# Leaf Item Settings in .NET MAUI TreeMap A leaf item in the TreeMap represents a visualized data element. It does not contain child items but may have a parent item if levels are specified in the TreeMap control. It also allows you to customize the spacing between items, stroke color, stroke width, text style, and text format option in the TreeMap control. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Add Labels diff --git a/chart-sdk/maui/treemap/legend.md b/chart-sdk/maui/treemap/legend.md index 974631784..aa53572bc 100644 --- a/chart-sdk/maui/treemap/legend.md +++ b/chart-sdk/maui/treemap/legend.md @@ -1,7 +1,7 @@ --- layout: post -title: Legend in .NET MAUI TreeMap Control | Syncfusion® -description: Learn here all about how to customize the appearance of legend items in Syncfusion® .NET MAUI TreeMap control by changing text color, icon size, and more. +title: Legend in .NET MAUI TreeMap | Syncfusion® +description: Legend in .NET MAUI TreeMap displays hierarchical data categories with customizable styles, helping users identify and interpret TreeMap data effectively. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug @@ -11,7 +11,7 @@ documentation: ug The legend provides valuable information for interpreting TreeMap displays by presenting data through various colors, shapes, and other identifiers. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Enable legend diff --git a/chart-sdk/maui/treemap/levels.md b/chart-sdk/maui/treemap/levels.md index d8946c239..e65453796 100644 --- a/chart-sdk/maui/treemap/levels.md +++ b/chart-sdk/maui/treemap/levels.md @@ -1,15 +1,15 @@ --- layout: post -title: Understanding Levels in .NET MAUI TreeMap | Syncfusion® -description: Learn about the levels within Syncfusion® .NET MAUI TreeMap control, exploring its fundamental features and functionalities for effective treemap visualization. +title: Levels in .NET MAUI TreeMap | Syncfusion® +description: Levels in .NET MAUI TreeMap organize hierarchical data into grouped categories, enabling structured visualization and improved data interpretation. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Levels in .NET MAUI TreeMap (SfTreeMap) +# Levels in .NET MAUI TreeMap -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. Levels in .NET MAUI TreeMap allow for hierarchical data visualization, enabling multi-level categorization and exploration of complex datasets. The TreeMap supports n number of levels and each level is separated using the [GroupPath](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.TreeMapLevel.html#Syncfusion_Maui_TreeMap_TreeMapLevel_GroupPath) property. diff --git a/chart-sdk/maui/treemap/migration.md b/chart-sdk/maui/treemap/migration.md index e4f6256f1..8248bbc18 100644 --- a/chart-sdk/maui/treemap/migration.md +++ b/chart-sdk/maui/treemap/migration.md @@ -1,13 +1,13 @@ --- layout: post -title: Migrate from Xamarin to .NET MAUI TreeMap (SfTreeMap) | Syncfusion® -description: Learn about Migrating from Syncfusion® Xamarin.Forms TreeMap control to .NET MAUI TreeMap (SfTreeMap) control. +title: Migrate Xamarin.Forms SfTreeMap to .NET MAUI SfTreeMap | Syncfusion® +description: Migrate from Xamarin.Forms TreeMap to .NET MAUI TreeMap with updated APIs, improved performance, and modern features for hierarchical data visualization. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Migrate from Xamarin.Forms TreeMap to .NET MAUI TreeMap (SfTreeMap) +# Migrate from Xamarin.Forms SfTreeMap to .NET MAUI SfTreeMap To make the migration from the [Xamarin SfTreeMap](https://www.syncfusion.com/xamarin-ui-controls/xamarin-treemap) to the [.NET MAUI SfTreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map) easier, most of the APIs from the [Xamarin SfTreeMap](https://www.syncfusion.com/xamarin-ui-controls/xamarin-treemap) to the [.NET MAUI SfTreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map) were kept in the [.NET MAUI SfTreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map). However, to maintain the consistency of API naming in the [.NET MAUI SfTreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map), some of the APIs have been renamed. Please find the difference in the following topics. diff --git a/chart-sdk/maui/treemap/overview.md b/chart-sdk/maui/treemap/overview.md index 059312c02..e85b91f9a 100644 --- a/chart-sdk/maui/treemap/overview.md +++ b/chart-sdk/maui/treemap/overview.md @@ -1,13 +1,13 @@ --- layout: post -title: Overview of .NET MAUI TreeMap | Syncfusion -description: Learn about the introduction to Syncfusion® .NET MAUI TreeMap (SfTreeMap) control, its basic features, and the functionalities of treemap. +title: About Syncfusion® .NET MAUI TreeMap Control | Syncfusion® +description: Learn about the overview of Syncfusion® .NET MAUI TreeMap control, including hierarchical data visualization, layouts, legends, and customization features. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Overview of .NET MAUI TreeMap +# About Syncfusion® .NET MAUI TreeMap Control The Syncfusion® [.NET MAUI TreeMap](https://www.syncfusion.com/maui-controls/maui-tree-map) control allows you to visually represent hierarchical data with rectangles that are sized and colored based on underlying values. It efficiently displays grouped and nested data structures, offering various layout options, extensive customization options, and supports item selection, data binding to different sources, and more. @@ -74,24 +74,24 @@ The following table summarizes the globalization support available in this contr - + - - + +
TreeMap not-applicablefull-supportfull-support not-applicablefull-supportfull-supportfull-supportfull-support
## Related Controls -- [Sunburst Chart](https://help.syncfusion.com/maui/sunburstchart/overview) for visualizing hierarchical data using a radial layout. -- [.NET MAUI Cartesian Chart](https://help.syncfusion.com/maui/cartesian-charts/overview) for analyzing data trends using axis-based charts. -- [Maps](https://help.syncfusion.com/maui/maps/overview) for visualizing location-based hierarchical data. +- [Sunburst Chart](https://help.syncfusion.com/chart-sdk/maui/sunburstchart/overview) for visualizing hierarchical data using a radial layout. +- [.NET MAUI Cartesian Chart](https://help.syncfusion.com/chart-sdk/maui/cartesian-charts/overview) for analyzing data trends using axis-based charts. +- [Maps](https://help.syncfusion.com/chart-sdk/maui/maps/overview) for visualizing location-based hierarchical data. ## See Also -- [Getting Started](https://help.syncfusion.com/maui/treemap/getting-started) shows a step‑by‑step guide to begin using the TreeMap control. -- [Layouts](https://help.syncfusion.com/maui/treemap/layouts) explains how to configure layout types and data arrangement. -- [Drilldown](https://help.syncfusion.com/maui/treemap/drilldown) helps dive into details by exploring data hierarchies step by step. +- [Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started) shows a step‑by‑step guide to begin using the TreeMap control. +- [Layouts](https://help.syncfusion.com/chart-sdk/maui/treemap/layouts) explains how to configure layout types and data arrangement. +- [Drilldown](https://help.syncfusion.com/chart-sdk/maui/treemap/drilldown) helps dive into details by exploring data hierarchies step by step. - [UI Kit](https://www.syncfusion.com/demos/maui#maui-ui-control) provides interactive demos and ready‑made UI examples. ## Resources diff --git a/chart-sdk/maui/treemap/right-to-left.md b/chart-sdk/maui/treemap/right-to-left.md index 8bb64b910..217ebfb3d 100644 --- a/chart-sdk/maui/treemap/right-to-left.md +++ b/chart-sdk/maui/treemap/right-to-left.md @@ -1,17 +1,17 @@ --- layout: post -title: Right to left (RTL) support in .NET MAUI TreeMap Control | Syncfusion® -description: Learn here all about the flow direction feature of Syncfusion® .NET MAUI TreeMap (SfTreeMap) control. +title: Right To Left in .NET MAUI TreeMap | Syncfusion® +description: Right To Left in .NET MAUI TreeMap supports RTL layouts for hierarchical data visualization, improving usability for right-to-left language users. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Right To Left in .NET MAUI TreeMap (SfTreeMap) +# Right To Left in .NET MAUI TreeMap SfTreeMap supports changing the flow to the right-to-left direction by setting the `FlowDirection` to RightToLeft. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. {% tabs %} {% highlight xaml hl_lines="4" %} diff --git a/chart-sdk/maui/treemap/selection-and-highlights.md b/chart-sdk/maui/treemap/selection-and-highlights.md index cc5c23946..5d3fcfc10 100644 --- a/chart-sdk/maui/treemap/selection-and-highlights.md +++ b/chart-sdk/maui/treemap/selection-and-highlights.md @@ -1,17 +1,17 @@ --- layout: post title: Selection and Highlights in .NET MAUI TreeMap | Syncfusion® -description: Learn about the functionality of selection and highlights within the Syncfusion® .NET MAUI TreeMap (SfTreeMap) control. +description: Selection and Highlights in .NET MAUI TreeMap allow TreeMap items to be selected and highlighted, improving data analysis and visual exploration. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Selection and Highlights in .NET MAUI TreeMap (SfTreeMap) +# Selection and Highlights in .NET MAUI TreeMap The TreeMap control enables users to select specific groups or items for distinction, with the tooltip feature providing additional information during interaction. However, when the [SelectionMode](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.SfTreeMap.html#Syncfusion_Maui_TreeMap_SfTreeMap_SelectionMode) is set to [None](https://help.syncfusion.com/cr/maui/Syncfusion.Maui.TreeMap.SelectionMode.html#Syncfusion_Maui_TreeMap_SelectionMode_None), interaction with treemap items is disabled. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Selection Mode diff --git a/chart-sdk/maui/treemap/tooltip.md b/chart-sdk/maui/treemap/tooltip.md index 09f0c6353..bcca07725 100644 --- a/chart-sdk/maui/treemap/tooltip.md +++ b/chart-sdk/maui/treemap/tooltip.md @@ -1,17 +1,17 @@ --- layout: post -title: Tooltip in .NET MAUI TreeMap Control | Syncfusion® -description: Learn here all about how to customize the appearance of tooltip in Syncfusion® .NET MAUI TreeMap control and more. +title: Tooltip in .NET MAUI TreeMap | Syncfusion® +description: Tooltip in .NET MAUI TreeMap displays detailed information for TreeMap items on interaction, helping users analyze and understand hierarchical data. platform: chart-sdk control: TreeMap (SfTreeMap) documentation: ug --- -# Tooltip in .NET MAUI TreeMap (SfTreeMap) +# Tooltip in .NET MAUI TreeMap The tooltip provides information when hovering over or selecting items in the interactive TreeMap, displaying details about the values of each item. -N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/maui/treemap/getting-started)** guide. +N> **Prerequisite:** Ensure that the required NuGet package is installed, the necessary namespaces are imported, and the **TreeMap** control is properly configured in your application. For detailed setup and configuration instructions, refer to the **[Getting Started](https://help.syncfusion.com/chart-sdk/maui/treemap/getting-started)** guide. ## Enable Tooltip diff --git a/chart-sdk/react/3d-charts/Chart-types/bar.md b/chart-sdk/react/3d-charts/Chart-types/bar.md index 5d0fbb490..634037a94 100644 --- a/chart-sdk/react/3d-charts/Chart-types/bar.md +++ b/chart-sdk/react/3d-charts/Chart-types/bar.md @@ -1,14 +1,14 @@ --- layout: post -title: Bar chart in React 3D Chart component | Syncfusion -description: Learn here all about bar chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Bar Chart in React 3D Charts | Syncfusion +description: Learn how to render a 3D bar chart in Syncfusion React 3D Charts to compare values across categories with a horizontal cylindrical look. +control: Bar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bar Chart in React 3D Chart component +# Bar Chart in React 3D Charts ## Bar chart diff --git a/chart-sdk/react/3d-charts/Chart-types/column.md b/chart-sdk/react/3d-charts/Chart-types/column.md index 77d4fb20a..3d9a88c36 100644 --- a/chart-sdk/react/3d-charts/Chart-types/column.md +++ b/chart-sdk/react/3d-charts/Chart-types/column.md @@ -1,14 +1,14 @@ --- layout: post -title: Column Chart in React 3D Chart component | Syncfusion -description: Learn here all about column chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Column Chart in React 3D Charts | Syncfusion +description: Learn how to render a 3D column chart in Syncfusion React 3D Charts to compare values across categories with a vertical cylindrical look. +control: Column Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Column Chart in React 3D Chart control +# Column Chart in React 3D Charts ## Column chart diff --git a/chart-sdk/react/3d-charts/Chart-types/stack-bar.md b/chart-sdk/react/3d-charts/Chart-types/stack-bar.md index f44acb701..4fada0e12 100644 --- a/chart-sdk/react/3d-charts/Chart-types/stack-bar.md +++ b/chart-sdk/react/3d-charts/Chart-types/stack-bar.md @@ -1,13 +1,13 @@ --- layout: post -title: Stacked Bar Chart in React 3D Chart component | Syncfusion -description: Learn here all about stacked bar chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Stacked Bar Chart in React 3D Charts | Syncfusion +description: Learn how to render a stacked 3D bar chart in Syncfusion React 3D Charts to show the contribution of multiple series to a total horizontal value. +control: Stack Bar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Stacked bar chart in React Chart component +# Stacked Bar Chart in React 3D Charts ## Stacked bar chart diff --git a/chart-sdk/react/3d-charts/Chart-types/stack-column.md b/chart-sdk/react/3d-charts/Chart-types/stack-column.md index 6af65e9fa..af73d779c 100644 --- a/chart-sdk/react/3d-charts/Chart-types/stack-column.md +++ b/chart-sdk/react/3d-charts/Chart-types/stack-column.md @@ -1,14 +1,14 @@ --- layout: post -title: Stacked Column Chart in React 3D Chart component | Syncfusion -description: Learn here all about stacked column chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Stacked Column Chart in React 3D Charts | Syncfusion +description: Learn how to render a stacked 3D column charts in Syncfusion React 3D Chart to show the contribution of multiple series to a total vertical value. +control: Stack Column Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Stacked column chart in React 3D Chart control +# Stacked Column Chart in React 3D Charts ## Stacked column chart diff --git a/chart-sdk/react/3d-charts/Chart-types/stacked-bar.md b/chart-sdk/react/3d-charts/Chart-types/stacked-bar.md index 10f100e6f..5dd58f9a1 100644 --- a/chart-sdk/react/3d-charts/Chart-types/stacked-bar.md +++ b/chart-sdk/react/3d-charts/Chart-types/stacked-bar.md @@ -1,14 +1,14 @@ --- layout: post -title: 100% Stacked Bar Chart in React 3D Chart component | Syncfusion -description: Learn here all about 100% stacked bar chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: 100% Stacked Bar Chart in React 3D Charts | Syncfusion +description: Learn how to render a 100% stacked 3D bar chart in Syncfusion React 3D Charts to show the relative share of each category as a full horizontal bar. +control: Stack Bar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# 100% Stacked bar chart in React 3D Chart control +# 100% Stacked Bar Chart in React 3D Charts ## 100% Stacked bar chart diff --git a/chart-sdk/react/3d-charts/Chart-types/stacked-column.md b/chart-sdk/react/3d-charts/Chart-types/stacked-column.md index 18a7c1ddb..2e52e4842 100644 --- a/chart-sdk/react/3d-charts/Chart-types/stacked-column.md +++ b/chart-sdk/react/3d-charts/Chart-types/stacked-column.md @@ -1,14 +1,14 @@ --- layout: post -title: 100% Stacked Column Chart in React 3D Chart component | Syncfusion -description: Learn here all about 100% stacked column chart in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: 100% Stacked Column Chart in React 3D Charts | Syncfusion +description: Learn how to render a 100% stacked 3D column chart in Syncfusion React 3D Charts to show the relative share of each category as a full vertical bar. +control: Stack Column Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# 100% Stacked column chart in React 3D Chart control +# 100% Stacked Column Chart in React 3D Charts ## 100% Stacked column chart diff --git a/chart-sdk/react/3d-charts/accessibility.md b/chart-sdk/react/3d-charts/accessibility.md index bb0e917eb..5db2c5d8a 100644 --- a/chart-sdk/react/3d-charts/accessibility.md +++ b/chart-sdk/react/3d-charts/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React 3D Chart component | Syncfusion -description: Learn here all about accessibility in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Accessibility in React 3D Charts | Syncfusion +description: Learn how Syncfusion React 3D Charts support accessibility with WAI-ARIA roles, attributes, and keyboard navigation for screen readers. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React 3D Chart control +# Accessibility in React 3D Charts Accessibility is achieved in the 3D chart control through WAI-ARIA standard and keyboard navigation. The 3D chart features can be effectively accessed through assistive technologies such as screen readers. diff --git a/chart-sdk/react/3d-charts/appearance.md b/chart-sdk/react/3d-charts/appearance.md index bb099851b..0b1294482 100644 --- a/chart-sdk/react/3d-charts/appearance.md +++ b/chart-sdk/react/3d-charts/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React 3D Chart component | Syncfusion -description: Learn here all about appearance in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Appearance in React 3D Charts | Syncfusion +description: Learn how to customize the appearance of Syncfusion React 3D Charts with custom palettes, point colors, chart area, animation, rotation, and title styling. +control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React 3D Chart control +# Appearance in React 3D Charts ## Custom color palette diff --git a/chart-sdk/react/3d-charts/axis-customization.md b/chart-sdk/react/3d-charts/axis-customization.md index 71553e5d8..cb15e4e5b 100644 --- a/chart-sdk/react/3d-charts/axis-customization.md +++ b/chart-sdk/react/3d-charts/axis-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis customization in React 3D Chart component | Syncfusion -description: Learn here all about axis customization in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Axis Customization in React 3D Charts | Syncfusion +description: Learn how to customize axes in Syncfusion React 3D Charts with axis titles, tick lines, grid lines, multiple axes, inversed direction, and opposed position. +control: Axis Customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in React 3D Chart control +# Axis Customization in React 3D Charts ## Title diff --git a/chart-sdk/react/3d-charts/axis-labels.md b/chart-sdk/react/3d-charts/axis-labels.md index e321511a3..b38a449d9 100644 --- a/chart-sdk/react/3d-charts/axis-labels.md +++ b/chart-sdk/react/3d-charts/axis-labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis labels in React 3D Chart component | Syncfusion -description: Learn here all about axis labels in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Axis Labels in React 3D Charts | Syncfusion +description: Learn how to handle axis labels in Syncfusion React 3D Charts with smart label placement, edge label fitting, and maximum labels per pixel range. +control: Axis Labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis labels in React 3D Chart control +# Axis Labels in React 3D Charts Axis labels are the labels that are positioned adjacent to the y-axis and beneath the x-axis. It provides descriptive information about the axis. diff --git a/chart-sdk/react/3d-charts/category-axis.md b/chart-sdk/react/3d-charts/category-axis.md index 825ecdcd4..7035d8a7f 100644 --- a/chart-sdk/react/3d-charts/category-axis.md +++ b/chart-sdk/react/3d-charts/category-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Category axis in React 3D Chart component | Syncfusion -description: Learn here all about category axis in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Category Axis in React 3D Charts | Syncfusion +description: Learn how to configure the category axis in the Syncfusion React 3D Charts to render text labels along the horizontal axis with flexible label placement. +control: Category Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Category axis in React 3D Chart control +# Category Axis in React 3D Charts The category axis is the horizontal axis of a 3D chart that shows text values rather than numerical values. Compared to the vertical axis, this axis has fewer labels. The following sample shows to render the 3D chart using category axis. diff --git a/chart-sdk/react/3d-charts/data-label.md b/chart-sdk/react/3d-charts/data-label.md index 1a2eae0d0..0a96df541 100644 --- a/chart-sdk/react/3d-charts/data-label.md +++ b/chart-sdk/react/3d-charts/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data labels in React 3D Chart component | Syncfusion -description: Learn here all about data labels in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Data Labels in React 3D Charts | Syncfusion +description: Learn how to show point values on the Syncfusion React 3D Charts series using data labels with smart placement, text mapping, and template customization. +control: Data Label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data labels in React 3D Chart control +# Data Labels in React 3D Charts Data labels are fields that includes information about the sample point connected to an output. It can be added to a chart series by enabling the [`visible`](https://helpej2.syncfusion.com/react/documentation/api/chart3d/dataLabelStyleModel#visible) option in the dataLabel. By default, the labels will arrange smartly without overlapping. diff --git a/chart-sdk/react/3d-charts/datetime-axis.md b/chart-sdk/react/3d-charts/datetime-axis.md index 7b20141b4..f37525e5e 100644 --- a/chart-sdk/react/3d-charts/datetime-axis.md +++ b/chart-sdk/react/3d-charts/datetime-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: DateTime axis in React 3D Chart component | Syncfusion -description: Learn here all about DateTime axis in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: DateTime Axis in React 3D Charts | Syncfusion +description: Learn how to use the DateTime axis in the Syncfusion React 3D Charts to display time-scale values on the axis with a configurable date-time label format. +control: Datetime Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# DateTime axis in React 3D Chart control +# DateTime Axis in React 3D Charts ## DateTime axis diff --git a/chart-sdk/react/3d-charts/dimensions.md b/chart-sdk/react/3d-charts/dimensions.md index f3d96ab33..d648a63e8 100644 --- a/chart-sdk/react/3d-charts/dimensions.md +++ b/chart-sdk/react/3d-charts/dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Dimensions in React 3D Chart component | Syncfusion -description: Learn here all about dimensions in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Dimensions in React 3D Charts | Syncfusion +description: Learn how to set the Syncfusion React 3D Charts size to a fixed container, the parent element, or a custom width and height using CSS or inline style. +control: Dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Dimensions in React 3D Chart control +# Dimensions in React 3D Charts ## Size for container diff --git a/chart-sdk/react/3d-charts/getting-started.md b/chart-sdk/react/3d-charts/getting-started.md index 2cf654cfa..4497fdec4 100644 --- a/chart-sdk/react/3d-charts/getting-started.md +++ b/chart-sdk/react/3d-charts/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React 3D Chart component | Syncfusion -description: Check out and learn about the Getting started with the React 3D Chart component of Syncfusion Essential JS 2 and more details. -control: Getting started +title: Getting Started with React 3D Charts | Syncfusion +description: Learn how to get started with the Syncfusion React 3D Charts Component. Explore setup, features, examples, and customization options. +control: Getting Started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting started with React 3D Chart component +# Getting Started with React 3D Charts This section describes the steps to create a simple 3D Chart component and demonstrates its basic usage. diff --git a/chart-sdk/react/3d-charts/legend.md b/chart-sdk/react/3d-charts/legend.md index 263a3238f..9cafdb61d 100644 --- a/chart-sdk/react/3d-charts/legend.md +++ b/chart-sdk/react/3d-charts/legend.md @@ -1,15 +1,15 @@ --- layout: post -title: Legend in React 3D Chart component | Syncfusion -description: Learn here all about legend in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Legend in React 3D Charts | Syncfusion +description: Learn how to enable the legend in the Syncfusion React 3D Charts to identify each series, with options for position, shape, paging, and click toggling. +control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React 3D Chart control +# Legend in React 3D Charts diff --git a/chart-sdk/react/3d-charts/logarithmic-axis.md b/chart-sdk/react/3d-charts/logarithmic-axis.md index d9f0b4430..733b993f2 100644 --- a/chart-sdk/react/3d-charts/logarithmic-axis.md +++ b/chart-sdk/react/3d-charts/logarithmic-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Logarithmic axis in React 3D Chart component | Syncfusion -description: Learn here all about logarithmic axis in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Logarithmic Axis in React 3D Charts | Syncfusion +description: Learn how to use the logarithmic axis in the Syncfusion React 3D Charts to plot data that spans several orders of magnitude on a customizable log scale. +control: Logarithmic Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Logarithmic axis in React 3D Chart control +# Logarithmic Axis in React 3D Charts Logarithmic axis uses logarithmic scale and it is very useful in visualizing data, when it has numerical values in both lower order of magnitude (eg: 10-6) and higher order of magnitude (eg: 106). diff --git a/chart-sdk/react/3d-charts/multiple-pane.md b/chart-sdk/react/3d-charts/multiple-pane.md index 8799dcb82..39ba85e52 100644 --- a/chart-sdk/react/3d-charts/multiple-pane.md +++ b/chart-sdk/react/3d-charts/multiple-pane.md @@ -1,14 +1,14 @@ --- layout: post -title: Multiple panes in React 3D Chart component | Syncfusion -description: Learn here all about multiple panes in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Multiple Panes in React 3D Charts | Syncfusion +description: Learn how to split the Syncfusion React 3D Charts plot area into rows and columns of sized panes to compare multiple series in a single chart. +control: Multiple Panes platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Multiple panes in React 3D Chart control +# Multiple Panes in React 3D Charts The chart area can be divided into multiple panes using [`rows`](https://ej2.syncfusion.com/react/documentation/api/chart3d/chart3DModel#rows) and [`columns`](https://ej2.syncfusion.com/react/documentation/api/chart3d/chart3DModel#columns). diff --git a/chart-sdk/react/3d-charts/numeric-axis.md b/chart-sdk/react/3d-charts/numeric-axis.md index 208a383b8..d87b3ed40 100644 --- a/chart-sdk/react/3d-charts/numeric-axis.md +++ b/chart-sdk/react/3d-charts/numeric-axis.md @@ -1,8 +1,8 @@ --- layout: post -title: Numeric axis in React 3D Chart component | Syncfusion -description: Learn here all about numeric axis in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Numeric Axis in React 3D Charts | Syncfusion +description: Learn how to use the numeric axis in the Syncfusion React 3D Charts to plot double values with optional range padding, formatting, and label customization. +control: Numeric Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Numeric axis in React 3D Chart control +# Numeric Axis in React 3D Charts The numeric axis can be used to represent the numeric values of data in 3D chart. By default, the `valueType` of an axis is **Double**. diff --git a/chart-sdk/react/3d-charts/print-export.md b/chart-sdk/react/3d-charts/print-export.md index 20bc8d9e2..6fa18afeb 100644 --- a/chart-sdk/react/3d-charts/print-export.md +++ b/chart-sdk/react/3d-charts/print-export.md @@ -1,14 +1,14 @@ --- layout: post -title: Print and Export in React 3D Chart component | Syncfusion -description: Learn here all about print and export in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Print and Export in React 3D Charts | Syncfusion +description: Learn how to print or export the Syncfusion React 3D Charts to PDF, image, or SVG using the public print and export methods on the chart instance. +control: Print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and Export in React 3D Chart control +# Print and Export in React 3D Charts ## Print diff --git a/chart-sdk/react/3d-charts/selection.md b/chart-sdk/react/3d-charts/selection.md index 266f1380c..fecba3308 100644 --- a/chart-sdk/react/3d-charts/selection.md +++ b/chart-sdk/react/3d-charts/selection.md @@ -1,8 +1,8 @@ --- layout: post -title: Selection in React 3D Chart component | Syncfusion -description: Learn here all about selection in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Selection in React 3D Charts | Syncfusion +description: Learn how to select series or data points in the Syncfusion React 3D Charts on mouse click with selection modes for series, point, or cluster. +control: Selection platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Selection in React 3D Chart control +# Selection in React 3D Charts The 3D chart provides selection support for the series and its data points on mouse click. diff --git a/chart-sdk/react/3d-charts/tool-tip.md b/chart-sdk/react/3d-charts/tool-tip.md index 15018bdf8..f1b35f851 100644 --- a/chart-sdk/react/3d-charts/tool-tip.md +++ b/chart-sdk/react/3d-charts/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React 3D Chart component | Syncfusion -description: Learn here all about tooltip in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Tooltip in React 3D Charts | Syncfusion +description: Learn how to enable tooltip in the Syncfusion React 3D Charts to show point details on hover, with template and format options for richer context. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React 3D Chart control +# Tooltip in React 3D Charts diff --git a/chart-sdk/react/3d-charts/workig-with-data.md b/chart-sdk/react/3d-charts/workig-with-data.md index c6831b4cf..888e43e79 100644 --- a/chart-sdk/react/3d-charts/workig-with-data.md +++ b/chart-sdk/react/3d-charts/workig-with-data.md @@ -1,15 +1,15 @@ --- layout: post -title: Working with data source in React 3D Chart component | Syncfusion -description: Learn here all about working with data source in Syncfusion React 3D Chart component of Syncfusion Essential JS 2 and more. -control: 3D Chart +title: Working with Data in React 3D Charts | Syncfusion +description: Learn how to bind local or remote JSON data in the Syncfusion React 3D Charts by mapping fields to xName and yName on the series dataSource property. +control: Working with data platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Working with data in React 3D Chart control +# Working with Data in React 3D Charts ## Local Data diff --git a/chart-sdk/react/3d-circular-charts/data-label.md b/chart-sdk/react/3d-circular-charts/data-label.md index 4e5fcdcc3..c9fb9d141 100644 --- a/chart-sdk/react/3d-circular-charts/data-label.md +++ b/chart-sdk/react/3d-circular-charts/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data Label in React 3D Circular Chart component | Syncfusion -description: Learn here all about data label in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Data Label in React 3D Circular Charts | Syncfusion +description: Learn how to show point values on the Syncfusion React 3D Circular Charts series using data labels with smart placement and template customization. control: Data Label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data Label in React 3D Circular Chart component +# Data Label in React 3D Circular Charts A data label refers to a label associated with specific data points. It can be added to a 3D Circular Chart series by enabling the `visible` option in the `dataLabel` property. By default, the labels will arrange themselves smartly to avoid overlapping. diff --git a/chart-sdk/react/3d-circular-charts/empty-points.md b/chart-sdk/react/3d-circular-charts/empty-points.md index a88f6358d..5103fa709 100644 --- a/chart-sdk/react/3d-circular-charts/empty-points.md +++ b/chart-sdk/react/3d-circular-charts/empty-points.md @@ -1,14 +1,14 @@ --- layout: post -title: Empty points in React 3D Circular Chart component | Syncfusion -description: Learn here all about empty points in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Empty Points in React 3D Circular Charts | Syncfusion +description: Learn how to handle missing or zero values in the Syncfusion React 3D Circular Charts by configuring empty-point mode, fill, and border. control: Empty points platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Empty points in React 3D Circular Chart component +# Empty Points in React 3D Circular Charts Data points containing `null` or `undefined` values are considered empty points. These empty data points are ignored and not plotted in the 3D Circular Chart. You can customize the handling of empty points using the `emptyPointSettings` property in the series. The default mode for empty points is `Gap`. Other supported modes include `Average`, `Drop`, and `Zero`. diff --git a/chart-sdk/react/3d-circular-charts/getting-started.md b/chart-sdk/react/3d-circular-charts/getting-started.md index 5993c6670..42cf6ef3c 100644 --- a/chart-sdk/react/3d-circular-charts/getting-started.md +++ b/chart-sdk/react/3d-circular-charts/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React 3D Circular Chart component | Syncfusion -description: Check out and learn about getting started with the React 3D Circular Chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React 3D Circular Charts Component | Syncfusion +description: Learn how to get started with the Syncfusion React 3D Circular Charts control. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting started with React 3D Circular Chart component +# Getting Started with React 3D Circular Charts This section describes the steps to create a simple 3D Circular Chart and demonstrates the basic usage of the 3D Circular Chart component. diff --git a/chart-sdk/react/3d-circular-charts/legend.md b/chart-sdk/react/3d-circular-charts/legend.md index ea60e2c83..fd2348cb9 100644 --- a/chart-sdk/react/3d-circular-charts/legend.md +++ b/chart-sdk/react/3d-circular-charts/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React 3D Circular Chart component | Syncfusion -description: Learn here all about legend in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Legend in React 3D Circular Charts Component | Syncfusion +description: Learn how to enable the legend in the Syncfusion React 3D Circular Charts to identify each slice, with options for position, shape, paging and more. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React 3D Circular Chart component +# Legend in React 3D Circular Charts The legend provides information about the data points rendered in the 3D Circular Chart. It can be added by enabling the `visible` option in the `legendSettings` property. diff --git a/chart-sdk/react/3d-circular-charts/pie-donut-chart.md b/chart-sdk/react/3d-circular-charts/pie-donut-chart.md index f9740dc95..4b4ed9c40 100644 --- a/chart-sdk/react/3d-circular-charts/pie-donut-chart.md +++ b/chart-sdk/react/3d-circular-charts/pie-donut-chart.md @@ -1,14 +1,14 @@ --- layout: post -title: Pie and Donut in React 3D Circular Chart component | Syncfusion -description: Learn here all about Pie and Donut in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Pie and Donut in React 3D Circular Charts Component | Syncfusion +description: Learn how to render pie and donut series in the Syncfusion React 3D Circular Charts to compare category shares with inner-radius and explode options. control: Pie and Donut platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Pie and Donut in React 3D Circular Chart component +# Pie and Donut in React 3D Circular Charts ## Pie chart diff --git a/chart-sdk/react/3d-circular-charts/print-and-export.md b/chart-sdk/react/3d-circular-charts/print-and-export.md index 5bab3d453..9c9ea81cd 100644 --- a/chart-sdk/react/3d-circular-charts/print-and-export.md +++ b/chart-sdk/react/3d-circular-charts/print-and-export.md @@ -1,14 +1,14 @@ --- layout: post -title: Print and Export in React 3D Circular Chart | Syncfusion -description: Learn here all about print and export in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Print and Export in React 3D Circular Charts | Syncfusion +description: Learn how to print or export the Syncfusion React 3D Circular Charts to PDF, image, or SVG using the public print and export methods. control: Print and Export platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and Export in React 3D Circular Chart component +# Print and Export in React 3D Circular Charts ## Print diff --git a/chart-sdk/react/3d-circular-charts/title-and-subtitle.md b/chart-sdk/react/3d-circular-charts/title-and-subtitle.md index e9ef256e3..9ed71bbf6 100644 --- a/chart-sdk/react/3d-circular-charts/title-and-subtitle.md +++ b/chart-sdk/react/3d-circular-charts/title-and-subtitle.md @@ -1,14 +1,14 @@ --- layout: post -title: Title and subtitle in React 3D Circular Chart component | Syncfusion -description: Learn here all about title and subtitle in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Title and Subtitle in React 3D Circular Charts | Syncfusion +description: Learn how to add and customize a title and subtitle for the Syncfusion React 3D Circular Charts using text, alignment, and style options. control: Title and subtitle platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title and subtitle in React 3D Circular Chart component +# Title and Subtitle in React 3D Circular Charts ## Title diff --git a/chart-sdk/react/3d-circular-charts/tooltip.md b/chart-sdk/react/3d-circular-charts/tooltip.md index ccd35bd8d..f9a56832e 100644 --- a/chart-sdk/react/3d-circular-charts/tooltip.md +++ b/chart-sdk/react/3d-circular-charts/tooltip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React 3D Circular Chart component | Syncfusion -description: Learn here all about tooltip in Syncfusion React 3D Circular Chart component of Syncfusion Essential JS 2 and more. +title: Tooltip in React 3D Circular Charts | Syncfusion +description: Learn how to enable tooltips in the Syncfusion React 3D Circular Charts to show point details on hover with template and format options. control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React 3D Circular Chart component +# Tooltip in React 3D Circular Charts The 3D Circular Chart will display details about the points through a tooltip, when the mouse is moved over a specific point. By default, the tooltip is not visible. It can be enabled by using the `enable` property in `tooltip` to **true**. diff --git a/chart-sdk/react/accumulation-charts/accessibility.md b/chart-sdk/react/accumulation-charts/accessibility.md index cce94132d..f2c6539c0 100644 --- a/chart-sdk/react/accumulation-charts/accessibility.md +++ b/chart-sdk/react/accumulation-charts/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Accumulation chart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Accessibility +title: Accessibility in React Accumulation Charts | Syncfusion +description: Learn how the Syncfusion React Accumulation Charts support accessibility with WAI-ARIA roles, attributes, and keyboard navigation for screen readers. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Accumulation chart component +# Accessibility in React Accumulation Charts The Accumulation chart component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/accumulation-charts/advanced-accessibility-configuration.md b/chart-sdk/react/accumulation-charts/advanced-accessibility-configuration.md index 95392f2fc..cd1060875 100644 --- a/chart-sdk/react/accumulation-charts/advanced-accessibility-configuration.md +++ b/chart-sdk/react/accumulation-charts/advanced-accessibility-configuration.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility customization | Syncfusion -description: Learn here all about Accessibility customization in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Accessibility Customization in React Accumulation Charts | Syncfusion +description: Learn how to configure advanced accessibility options in the Syncfusion React Accumulation Charts with custom ARIA attributes, roles, and keyboard patterns. control: Accessibility customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility customization +# Accessibility Customization in React Accumulation Charts The Syncfusion® React Accumulation Chart control is structured to visualize data in a graphical manner. It provides robust customization options for accessibility, allowing you to enhance the user experience for those with disabilities. The main attributes of the React Accumulation Chart control's accessibility customization are briefly explained in this section. diff --git a/chart-sdk/react/accumulation-charts/annotation.md b/chart-sdk/react/accumulation-charts/annotation.md index c17d284a6..7e7fd3f9a 100644 --- a/chart-sdk/react/accumulation-charts/annotation.md +++ b/chart-sdk/react/accumulation-charts/annotation.md @@ -1,14 +1,14 @@ --- layout: post -title: Annotation in React Accumulation chart component | Syncfusion -description: Learn here all about Annotation in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Annotation +title: Annotation in React Accumulation Charts | Syncfusion +description: Learn how to add text, shape, or image annotations to the Syncfusion React Accumulation Charts using region, coordinate units, and alignment options. +control: Annotation platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Annotation in React Accumulation chart component +# Annotation in React Accumulation Charts The annotations are used to mark the specific area of interest in the chart area with texts, shapes or images. diff --git a/chart-sdk/react/accumulation-charts/appearance.md b/chart-sdk/react/accumulation-charts/appearance.md index ce61f5e9c..b4890b2a4 100644 --- a/chart-sdk/react/accumulation-charts/appearance.md +++ b/chart-sdk/react/accumulation-charts/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React Accumulation chart component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Appearance +title: Appearance in React Accumulation Charts | Syncfusion +description: Learn how to customize the appearance of the Syncfusion React Accumulation Charts with custom palettes and animation. +control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Accumulation chart component +# Appearance in React Accumulation Charts ## Custom Color Palette diff --git a/chart-sdk/react/accumulation-charts/centerlabel.md b/chart-sdk/react/accumulation-charts/centerlabel.md index d7a33d73a..d779d0ecd 100644 --- a/chart-sdk/react/accumulation-charts/centerlabel.md +++ b/chart-sdk/react/accumulation-charts/centerlabel.md @@ -1,14 +1,14 @@ --- layout: post -title: Center label in React Accumulation chart component | Syncfusion -description: Learn here all about Center label in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Center label +title: Center Label in React Accumulation Charts | Syncfusion +description: Learn how to show a center label in the Syncfusion React Accumulation Charts doughnut to display total, percentage, or custom text in the inner radius. +control: Center label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Center label in React Accumulation chart component +# Center Label in React Accumulation Charts ## Center label diff --git a/chart-sdk/react/accumulation-charts/chart-print.md b/chart-sdk/react/accumulation-charts/chart-print.md index 4a9777db7..f7c9df6c7 100644 --- a/chart-sdk/react/accumulation-charts/chart-print.md +++ b/chart-sdk/react/accumulation-charts/chart-print.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart print in React Accumulation chart component | Syncfusion -description: Learn here all about Chart print in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Print and Export in React Accumulation Charts | Syncfusion +description: Learn how to print or export the Syncfusion React Accumulation Charts to PDF, image, or SVG using the public print and export methods. control: Chart print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart print in React Accumulation chart component +# Print and Export in React Accumulation Charts ## Print diff --git a/chart-sdk/react/accumulation-charts/data-label.md b/chart-sdk/react/accumulation-charts/data-label.md index 7e0233c51..b689315bc 100644 --- a/chart-sdk/react/accumulation-charts/data-label.md +++ b/chart-sdk/react/accumulation-charts/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data label in React Accumulation chart component | Syncfusion -description: Learn here all about Data label in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Data Label in React Accumulation Charts | Syncfusion +description: Learn how to show point values on the Syncfusion React Accumulation Charts series using data labels with smart placement and template customization. control: Data label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data label in React Accumulation chart component +# Data Label in React Accumulation Charts Data label can be added to a chart series by enabling the [`visible`](https://ej2.syncfusion.com/react/documentation/api/accumulation-chart/accumulationDataLabelSettings#visible) option in the dataLabel property. diff --git a/chart-sdk/react/accumulation-charts/dynamic-data-update.md b/chart-sdk/react/accumulation-charts/dynamic-data-update.md index 1114cbcfb..3654eefcb 100644 --- a/chart-sdk/react/accumulation-charts/dynamic-data-update.md +++ b/chart-sdk/react/accumulation-charts/dynamic-data-update.md @@ -1,15 +1,15 @@ --- layout: post -title: Dynamic data update in Accumulation Chart component | Syncfusion -description: Learn here all about dynamic data update in Syncfusion Accumulation Chart component in Syncfusion Essential JS 2 and more. -platform: chart-sdk +title: Dynamic Data Update in React Accumulation Charts | Syncfusion +description: Learn how to update the Syncfusion React Accumulation Charts data dynamically at runtime using the addPoint, removePoint, and setData methods. +platform: ej2-react control: Dynamic Data Update documentation: ug publishingplatform: chart-sdk domainurl: https://help.syncfusion.com/chart-sdk --- -# Dynamic data update in React Accumulation Chart component +# Dynamic Data Update in React Accumulation Charts ## Adding a new data point diff --git a/chart-sdk/react/accumulation-charts/ej1-api-migration.md b/chart-sdk/react/accumulation-charts/ej1-api-migration.md index bb6349de1..7aba5c0fb 100644 --- a/chart-sdk/react/accumulation-charts/ej1-api-migration.md +++ b/chart-sdk/react/accumulation-charts/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Accumulation chart component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Migration from Essential JS 1 in React Accumulation Charts | Syncfusion +description: Learn how to migrate the Syncfusion React Accumulation Charts from Essential JS 1 to EJ2 with API mapping and code rewrite guidance. control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Accumulation chart component +# Migration from Essential JS 1 in React Accumulation Charts This article describes the API migration process of Chart component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/accumulation-charts/empty-points.md b/chart-sdk/react/accumulation-charts/empty-points.md index ceeb09fc0..8598902bf 100644 --- a/chart-sdk/react/accumulation-charts/empty-points.md +++ b/chart-sdk/react/accumulation-charts/empty-points.md @@ -1,14 +1,14 @@ --- layout: post -title: Empty points in React Accumulation chart component | Syncfusion -description: Learn here all about Empty points in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Empty Points in React Accumulation Charts | Syncfusion +description: Learn how to handle null or undefined values in the Syncfusion React Accumulation Charts with empty-point modes Gap, Average, and Zero. control: Empty points platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Empty points in React Accumulation chart component +# Empty Points in React Accumulation Charts The data points those uses the `null` or `undefined` as value are considered as empty points. The empty data points are ignored and not plotted in the chart. You can customize those points, using the `emptyPointSettings` property in series. The default mode of the empty point is `Gap`. Other supported modes are `Average` and `Zero`. diff --git a/chart-sdk/react/accumulation-charts/funnel.md b/chart-sdk/react/accumulation-charts/funnel.md index 79c270b6c..fded9c64b 100644 --- a/chart-sdk/react/accumulation-charts/funnel.md +++ b/chart-sdk/react/accumulation-charts/funnel.md @@ -1,14 +1,14 @@ --- layout: post -title: Funnel in React Accumulation chart component | Syncfusion -description: Learn here all about Funnel in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Funnel in React Accumulation Charts | Syncfusion +description: Learn how to render a funnel chart in the Syncfusion React Accumulation Charts to visualize values across progressive stages of a process. control: Funnel platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Funnel in React Accumulation chart component +# Funnel in React Accumulation Charts To render a funnel series, use the series [`type`](https://ej2.syncfusion.com/react/documentation/api/accumulation-chart/accumulationSeriesModel#type) as `Funnel` and inject the `FunnelSeries` module into the `services`. diff --git a/chart-sdk/react/accumulation-charts/getting-started.md b/chart-sdk/react/accumulation-charts/getting-started.md index 069257ac6..0fa3ff081 100644 --- a/chart-sdk/react/accumulation-charts/getting-started.md +++ b/chart-sdk/react/accumulation-charts/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React Accumulation Chart component | Syncfusion -description: Check out and learn about the Getting started with React Accumulation Chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Accumulation Charts | Syncfusion +description: Learn how to get started with the Syncfusion React Accumulation Charts Component. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Accumulation Chart Component +# Getting Started with React Accumulation Charts This section describes the steps to create a simple Accumulation Chart component. diff --git a/chart-sdk/react/accumulation-charts/gradient.md b/chart-sdk/react/accumulation-charts/gradient.md index d467e84f8..291ba443e 100644 --- a/chart-sdk/react/accumulation-charts/gradient.md +++ b/chart-sdk/react/accumulation-charts/gradient.md @@ -1,7 +1,7 @@ --- layout: post -title: Gradient in React Accumulation chart component | Syncfusion -description: Learn here all about Gradient in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Gradient in React Accumulation Charts | Syncfusion +description: Learn how to apply linear and radial gradients to slices of the Syncfusion React Accumulation Charts for richer visual styling. control: Gradient platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gradient in React Accumulation chart control +# Gradient in React Accumulation Charts diff --git a/chart-sdk/react/accumulation-charts/grouping.md b/chart-sdk/react/accumulation-charts/grouping.md index d140efa5c..c3005f233 100644 --- a/chart-sdk/react/accumulation-charts/grouping.md +++ b/chart-sdk/react/accumulation-charts/grouping.md @@ -1,14 +1,14 @@ --- layout: post -title: Grouping in React Accumulation chart component | Syncfusion -description: Learn here all about Grouping in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Grouping +title: Grouping in React Accumulation Charts | Syncfusion +description: Learn how to group small slices in the Syncfusion React Accumulation Charts into a single slice using groupMode for cleaner category comparison. +control: Grouping platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Grouping in React Accumulation chart component +# Grouping in React Accumulation Charts You can club/group few points of the series based on [`groupTo`](https://ej2.syncfusion.com/react/documentation/api/accumulation-chart/accumulationSeriesModel#groupto) property. For example, if the club value is 11, then the points with value less than 11 is grouped together and will be showed as a single point with label `others`. The property also takes value in percentage (percentage of total data points value). diff --git a/chart-sdk/react/accumulation-charts/legend.md b/chart-sdk/react/accumulation-charts/legend.md index c6c931a69..7e6e9c4a3 100644 --- a/chart-sdk/react/accumulation-charts/legend.md +++ b/chart-sdk/react/accumulation-charts/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Accumulation chart component | Syncfusion -description: Learn here all about Legend in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Legend +title: Legend in React Accumulation Charts | Syncfusion +description: Learn how to enable and customize the legend in the Syncfusion React Accumulation Charts to identify each slice, with options for position, shape, and more. +control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Accumulation chart component +# Legend in React Accumulation Charts As like a chart, the legend is also available for accumulation charts, which gives information about the points. By default, the legend will be placed on the right, if the width of the chart is high or will be placed on the bottom, if the height of the chart is high. Other customization features regarding the legend element are same as the [`chart legend`](http://ej2.syncfusion.com/documentation/chart/legend.html#position-and-alignment). diff --git a/chart-sdk/react/accumulation-charts/pie-dough-nut.md b/chart-sdk/react/accumulation-charts/pie-dough-nut.md index abc49cea2..6287374d0 100644 --- a/chart-sdk/react/accumulation-charts/pie-dough-nut.md +++ b/chart-sdk/react/accumulation-charts/pie-dough-nut.md @@ -1,14 +1,14 @@ --- layout: post -title: Pie dough nut in React Accumulation chart component | Syncfusion -description: Learn here all about Pie dough nut in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Pie dough nut +title: Pie and Doughnut in React Accumulation Charts | Syncfusion +description: Learn how to render pie and doughnut series in the Syncfusion React Accumulation Charts to compare category shares with inner-radius and explode options. +control: Pie dough nut platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Pie dough nut in React Accumulation chart component +# Pie and Doughnut in React Accumulation Charts ## Pie chart diff --git a/chart-sdk/react/accumulation-charts/pyramid.md b/chart-sdk/react/accumulation-charts/pyramid.md index e0e095874..220822cb2 100644 --- a/chart-sdk/react/accumulation-charts/pyramid.md +++ b/chart-sdk/react/accumulation-charts/pyramid.md @@ -1,14 +1,14 @@ --- layout: post -title: Pyramid in React Accumulation chart component | Syncfusion -description: Learn here all about Pyramid in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. +title: Pyramid in React Accumulation Charts | Syncfusion +description: Learn how to render a pyramid chart in the Syncfusion React Accumulation Charts to compare values that decrease proportionally from base to apex. control: Pyramid platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Pyramid in React Accumulation chart component +# Pyramid in React Accumulation Charts To render a pyramid series, use the series [`type`](https://ej2.syncfusion.com/react/documentation/api/accumulation-chart/accumulationSeriesModel#type) as `Pyramid` and inject `PyramidSeries` module into the `services`. diff --git a/chart-sdk/react/accumulation-charts/title-and-sub-title.md b/chart-sdk/react/accumulation-charts/title-and-sub-title.md index b94f76d8f..a38b4af20 100644 --- a/chart-sdk/react/accumulation-charts/title-and-sub-title.md +++ b/chart-sdk/react/accumulation-charts/title-and-sub-title.md @@ -1,14 +1,14 @@ --- layout: post -title: Title and sub title in React Accumulation chart component | Syncfusion -description: Learn here all about Title and sub title in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Title and sub title +title: Title and Subtitle in React Accumulation Charts | Syncfusion +description: Learn how to add a chart title or subtitle to the Syncfusion React Accumulation Charts with custom position, alignment, and style options. +control: Title and sub title platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title and sub title in React Accumulation chart component +# Title and Subtitle in React Accumulation Charts ## Title diff --git a/chart-sdk/react/accumulation-charts/tool-tip.md b/chart-sdk/react/accumulation-charts/tool-tip.md index 5000bca38..c0e30e1a0 100644 --- a/chart-sdk/react/accumulation-charts/tool-tip.md +++ b/chart-sdk/react/accumulation-charts/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React Accumulation chart component | Syncfusion -description: Learn here all about Tooltip in Syncfusion React Accumulation chart component of Syncfusion Essential JS 2 and more. -control: Tooltip +title: Tooltip in React Accumulation Charts | Syncfusion +description: Learn how to enable tooltips in the Syncfusion React Accumulation Charts to show point details on hover with template and format options. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React Accumulation chart component +# Tooltip in React Accumulation Charts Tooltip for the accumulation chart can be enabled by using the [`enable`](https://ej2.syncfusion.com/react/documentation/api/accumulation-chart/tooltipSettingsModel#enable) property. diff --git a/chart-sdk/react/bullet-charts/accessibility.md b/chart-sdk/react/bullet-chart/accessibility.md similarity index 94% rename from chart-sdk/react/bullet-charts/accessibility.md rename to chart-sdk/react/bullet-chart/accessibility.md index e5ffe8ef3..afe76f879 100644 --- a/chart-sdk/react/bullet-charts/accessibility.md +++ b/chart-sdk/react/bullet-chart/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Bullet chart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Bullet Chart | Syncfusion +description: Learn how the Syncfusion React Bullet Chart Component supports accessibility with WAI-ARIA, Section 508, WCAG 2.2, and keyboard navigation. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Bullet chart component +# Accessibility in React Bullet Chart The Bullet chart component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/bullet-charts/axis-customization.md b/chart-sdk/react/bullet-chart/axis-customization.md similarity index 97% rename from chart-sdk/react/bullet-charts/axis-customization.md rename to chart-sdk/react/bullet-chart/axis-customization.md index 35bb6a2f9..550b6e82a 100644 --- a/chart-sdk/react/bullet-charts/axis-customization.md +++ b/chart-sdk/react/bullet-chart/axis-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis customization in React Bullet chart component | Syncfusion -description: Learn here all about Axis customization in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Axis Customization in React Bullet Chart | Syncfusion +description: Learn how to customize the axis in the Syncfusion React Bullet Chart Component with title, labels, ranges, and tick lines. control: Axis customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in React Bullet chart component +# Axis Customization in React Bullet Chart ## MajorTickLines and MinorTickLines Customization diff --git a/chart-sdk/react/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/react/bullet-chart/bullet-chart-dimensions.md similarity index 91% rename from chart-sdk/react/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/react/bullet-chart/bullet-chart-dimensions.md index 798d8f064..03c693b95 100644 --- a/chart-sdk/react/bullet-charts/bullet-chart-dimensions.md +++ b/chart-sdk/react/bullet-chart/bullet-chart-dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Bullet chart dimensions in React Bullet chart component | Syncfusion -description: Learn here all about Bullet chart dimensions in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Dimensions in React Bullet Chart | Syncfusion +description: Learn how to set the Syncfusion React Bullet Chart Component size to a fixed container or a custom width and height using CSS or inline style. control: Bullet chart dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bullet chart dimensions in React Bullet chart component +# Dimensions in React Bullet Chart ## Size for Container diff --git a/chart-sdk/react/bullet-charts/comparative-bar.md b/chart-sdk/react/bullet-chart/comparative-bar.md similarity index 90% rename from chart-sdk/react/bullet-charts/comparative-bar.md rename to chart-sdk/react/bullet-chart/comparative-bar.md index c8186c67e..d8fc54a82 100644 --- a/chart-sdk/react/bullet-charts/comparative-bar.md +++ b/chart-sdk/react/bullet-chart/comparative-bar.md @@ -1,14 +1,14 @@ --- layout: post -title: Comparative bar in React Bullet chart component | Syncfusion -description: Learn here all about Comparative bar in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. -control: Comparative bar +title: Target Bar in React Bullet Chart | Syncfusion +description: Learn how to render the target bar in the Syncfusion React Bullet Chart Component to compare against the actual value with custom color and width. +control: Target bar platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Comparative bar in React Bullet chart component +# Target Bar in React Bullet Chart The line marker that runs perpendicular to the orientation of the graph is known as the **Comparative Measure** and it is used as a target marker to compare against the feature measure value. This is also called as the **Target Bar** in the Bullet Chart. To display the target bar, the [`targetField`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#targetfield) should be mapped to the appropriate field from the datasource. diff --git a/chart-sdk/react/bullet-charts/customization.md b/chart-sdk/react/bullet-chart/customization.md similarity index 92% rename from chart-sdk/react/bullet-charts/customization.md rename to chart-sdk/react/bullet-chart/customization.md index 86b55571d..a14cf5d17 100644 --- a/chart-sdk/react/bullet-charts/customization.md +++ b/chart-sdk/react/bullet-chart/customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Customization in React Bullet chart component | Syncfusion -description: Learn here all about Customization in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Customization in React Bullet Chart | Syncfusion +description: Learn how to customize the Syncfusion React Bullet Chart Component with themes, orientation, and animation options. control: Customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Customization in React Bullet chart component +# Customization in React Bullet Chart ## Orientation diff --git a/chart-sdk/react/bullet-charts/data-binding.md b/chart-sdk/react/bullet-chart/data-binding.md similarity index 82% rename from chart-sdk/react/bullet-charts/data-binding.md rename to chart-sdk/react/bullet-chart/data-binding.md index 84d933315..2dd50b075 100644 --- a/chart-sdk/react/bullet-charts/data-binding.md +++ b/chart-sdk/react/bullet-chart/data-binding.md @@ -1,14 +1,14 @@ --- layout: post -title: Data binding in React Bullet chart component | Syncfusion -description: Learn here all about Data binding in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Data Binding in React Bullet Chart | Syncfusion +description: Learn how to bind data to the Syncfusion React Bullet Chart Component using dataSource, valueField, and targetField properties. control: Data binding platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data binding in React Bullet chart component +# Data Binding in React Bullet Chart The [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#datasource) property accepts a collection of values as input that helps to display measures, and compares them to a target bar. To display the actual and target bar, specify the property from the datasource into the [`valueField`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#valuefield) and [`targetField`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#targetfield) respectively. diff --git a/chart-sdk/react/bullet-charts/data-label.md b/chart-sdk/react/bullet-chart/data-label.md similarity index 88% rename from chart-sdk/react/bullet-charts/data-label.md rename to chart-sdk/react/bullet-chart/data-label.md index 29b83b330..93206cea1 100644 --- a/chart-sdk/react/bullet-charts/data-label.md +++ b/chart-sdk/react/bullet-chart/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data label in React Bullet chart component | Syncfusion -description: Learn here all about Data label in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. +title: Data Labels in React Bullet Chart | Syncfusion +description: Learn how to show point values on the Syncfusion React Bullet Chart Component using data labels with customization. control: Data label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data label in React Bullet chart component +# Data Labels in React Bullet Chart Data Labels are used to identify the value of actual bar in the Bullet Chart component. The Data Labels will be shown by specifying the [`dataLabel`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#datalabel) setting's [`enable`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart/bulletDataLabelModel#enable) property to **true**. diff --git a/chart-sdk/react/bullet-charts/getting-started.md b/chart-sdk/react/bullet-chart/getting-started.md similarity index 97% rename from chart-sdk/react/bullet-charts/getting-started.md rename to chart-sdk/react/bullet-chart/getting-started.md index fad4e4f74..24a63077d 100644 --- a/chart-sdk/react/bullet-charts/getting-started.md +++ b/chart-sdk/react/bullet-chart/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting started with React Bullet Chart component | Syncfusion -description: Check out and learn about getting started with the React Bullet Chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Bullet Chart | Syncfusion +description: Learn how to get started with the Syncfusion React Bullet Chart Component. Explore setup, features, examples, and customization options. control: Getting Started platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Getting started with React Bullet Chart component +# Getting Started with React Bullet Chart This section describes the steps to create a simple Bullet Chart component. diff --git a/chart-sdk/react/bullet-charts/ranges.md b/chart-sdk/react/bullet-chart/ranges.md similarity index 85% rename from chart-sdk/react/bullet-charts/ranges.md rename to chart-sdk/react/bullet-chart/ranges.md index 6318ef57e..819230fa1 100644 --- a/chart-sdk/react/bullet-charts/ranges.md +++ b/chart-sdk/react/bullet-chart/ranges.md @@ -1,14 +1,14 @@ --- layout: post -title: Ranges in React Bullet chart component | Syncfusion -description: Learn here all about Ranges in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. -control: Ranges +title: Ranges in React Bullet Chart | Syncfusion +description: Learn how to configure ranges in the Syncfusion React Bullet Chart Component to compare actual and target values against thresholds with custom colors. +control: Ranges platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ranges in React Bullet chart component +# Ranges in React Bullet Chart Ranges represent the quality of a specific range such as **Good**, **Bad** and **Satisfactory** in the Bullet Chart scale. The ending point of a qualitative range is specified in the [`end`](https://ej2.syncfusion.com/angular/documentation/api/bullet-chart/rangeModel#end) property in [`ranges`](https://ej2.syncfusion.com/angular/documentation/api/bullet-chart#ranges). The [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/bullet-chart#minimum) value of a quantitative scale is considered the starting point of the first range or the previous range end point. diff --git a/chart-sdk/react/bullet-charts/title.md b/chart-sdk/react/bullet-chart/title.md similarity index 95% rename from chart-sdk/react/bullet-charts/title.md rename to chart-sdk/react/bullet-chart/title.md index 178ecfb4f..e12a46977 100644 --- a/chart-sdk/react/bullet-charts/title.md +++ b/chart-sdk/react/bullet-chart/title.md @@ -1,14 +1,14 @@ --- layout: post -title: Title in React Bullet chart component | Syncfusion -description: Learn here all about Title in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. -control: Title +title: Title and Subtitle in React Bullet Chart | Syncfusion +description: Learn how to add and customize a title and subtitle for the Syncfusion React Bullet Chart Component using text, position, and style options. +control: Title platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title in React Bullet chart component +# Title and Subtitle in React Bullet Chart ## Title diff --git a/chart-sdk/react/bullet-charts/tool-tip.md b/chart-sdk/react/bullet-chart/tool-tip.md similarity index 91% rename from chart-sdk/react/bullet-charts/tool-tip.md rename to chart-sdk/react/bullet-chart/tool-tip.md index da97288fe..cb9755c54 100644 --- a/chart-sdk/react/bullet-charts/tool-tip.md +++ b/chart-sdk/react/bullet-chart/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip in React Bullet chart component | Syncfusion -description: Learn here all about Tool tip in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. -control: Tool tip +title: Tooltip in React Bullet Chart | Syncfusion +description: Learn how to enable and customize tooltips on the Syncfusion React Bullet Chart Component with template options. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip in React Bullet chart component +# Tooltip in React Bullet Chart When the mouse is hovered over a bar in the Bullet Chart, the tooltip displays important summary about the actual and the target bar values. diff --git a/chart-sdk/react/bullet-charts/value-bar.md b/chart-sdk/react/bullet-chart/value-bar.md similarity index 93% rename from chart-sdk/react/bullet-charts/value-bar.md rename to chart-sdk/react/bullet-chart/value-bar.md index 2862bf088..980b2b4bf 100644 --- a/chart-sdk/react/bullet-charts/value-bar.md +++ b/chart-sdk/react/bullet-chart/value-bar.md @@ -1,14 +1,14 @@ --- layout: post -title: Value bar in React Bullet chart component | Syncfusion -description: Learn here all about Value bar in Syncfusion React Bullet chart component of Syncfusion Essential JS 2 and more. -control: Value bar +title: Actual Bar in React Bullet Chart | Syncfusion +description: Learn how to render the actual bar in the Syncfusion React Bullet Chart Component to show a primary value. +control: Actual bar platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Value bar in React Bullet chart component +# Actual Bar in React Bullet Chart To display the primary data or the current value of the data being measured known as the **Feature Measure** that should be encoded as a bar. This is called as the **Actual Bar** or the **Feature Bar** in the Bullet Chart, and to display the actual bar the [`valueField`](https://ej2.syncfusion.com/react/documentation/api/bullet-chart#valuefield) should be mapped to the appropriate field from the data source. diff --git a/chart-sdk/react/charts/accessibility.md b/chart-sdk/react/charts/accessibility.md index c57b2a848..762f8c807 100644 --- a/chart-sdk/react/charts/accessibility.md +++ b/chart-sdk/react/charts/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Chart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Accessibility +title: Accessibility in React Charts | Syncfusion +description: Learn how to make Syncfusion React Charts accessible with WCAG 2.2, Section 508, WAI-ARIA attributes, and full keyboard navigation support. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Chart component +# Accessibility in React Charts The Chart component follows the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22), and relevant [WAI-ARIA](https://www.w3.org/TR/wai-aria#roles) roles. diff --git a/chart-sdk/react/charts/advanced-accessibility-configuration.md b/chart-sdk/react/charts/advanced-accessibility-configuration.md index 1e0f64798..9edc91e48 100644 --- a/chart-sdk/react/charts/advanced-accessibility-configuration.md +++ b/chart-sdk/react/charts/advanced-accessibility-configuration.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility customization in React Chart component | Syncfusion -description: Learn here all about Accessibility customization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Accessibility Customization in React Charts | Syncfusion +description: Learn how to customize accessibility in Syncfusion React Charts with descriptions, roles, focus borders, and tab order for chart elements, series, title, and legend. control: Accessibility customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility customization in React Chart component +# Accessibility Customization in React Charts The [React Charts](https://www.syncfusion.com/react-components/react-charts) component visualizes data graphically and provides accessibility customization options to improve usability for people with disabilities. The primary accessibility attributes are described in this section. diff --git a/chart-sdk/react/charts/api.md b/chart-sdk/react/charts/api.md index 63b9b484b..6a73c8d85 100644 --- a/chart-sdk/react/charts/api.md +++ b/chart-sdk/react/charts/api.md @@ -1,14 +1,14 @@ --- layout: post -title: Api in React Chart component | Syncfusion -description: Learn here all about Api in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Api +title: API in React Charts | Syncfusion +description: Learn how to use the Syncfusion React Charts API reference, including the public classes, interfaces, and members exposed by the component. +control: Api platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Api in React Chart component +# API in React Charts ## Components diff --git a/chart-sdk/react/charts/axis-customization.md b/chart-sdk/react/charts/axis-customization.md index 0eddbbe6d..3efcb333a 100644 --- a/chart-sdk/react/charts/axis-customization.md +++ b/chart-sdk/react/charts/axis-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis customization in React Chart component | Syncfusion -description: Learn here all about Axis customization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Axis Customization in React Charts | Syncfusion +description: Learn how to customize Syncfusion React Charts axes with titles, tick lines, grid lines, multiple axes, opposed position, and inverse axis options. control: Axis customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in React Chart component +# Axis Customization in React Charts ## Axis Crossing diff --git a/chart-sdk/react/charts/axis-labels.md b/chart-sdk/react/charts/axis-labels.md index 0b6f00faf..48cb9530f 100644 --- a/chart-sdk/react/charts/axis-labels.md +++ b/chart-sdk/react/charts/axis-labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis labels in React Chart component | Syncfusion -description: Learn here all about Axis labels in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Axis labels +title: Axis Labels in React Charts | Syncfusion +description: Learn how to format and customize axis labels in Syncfusion React Charts with smart positioning, multilevel labels, sorting, edge placement, and label templates. +control: Axis labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis labels in React Chart component +# Axis Labels in React Charts To get start quickly with Axis Labels in React Charts, you can check on this video: diff --git a/chart-sdk/react/charts/category-axis.md b/chart-sdk/react/charts/category-axis.md index 08d05c31e..87597ddc8 100644 --- a/chart-sdk/react/charts/category-axis.md +++ b/chart-sdk/react/charts/category-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Category axis in React Chart component | Syncfusion -description: Learn here all about Category axis in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Category Axis in React Charts | Syncfusion +description: Learn how to use the category axis in Syncfusion React Charts to plot string-based values, customize label placement, set visible range, and enable indexed category axis. control: Category axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Category axis in React Chart component +# Category Axis in React Charts The category axis is used to represent string-based values instead of numeric values. It is commonly used for displaying discrete categories such as names, labels, or textual groupings along an axis. diff --git a/chart-sdk/react/charts/chart-annotations.md b/chart-sdk/react/charts/chart-annotations.md index e6efe40ba..4e6c607a1 100644 --- a/chart-sdk/react/charts/chart-annotations.md +++ b/chart-sdk/react/charts/chart-annotations.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart annotations in React Chart component | Syncfusion -description: Learn here all about Chart annotations in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Chart Annotations in React Charts | Syncfusion +description: Learn how to add HTML annotations to Syncfusion React Charts with custom positioning, regions, and coordinate units. control: Chart annotations platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart annotations in React Chart component +# Chart Annotations in React Charts Chart annotations allow highlighting specific areas of the chart using text, shapes, images, or custom HTML elements. Annotations can be used to emphasize trends, mark thresholds, show custom notes, or display additional information directly inside the chart area. diff --git a/chart-sdk/react/charts/chart-appearance.md b/chart-sdk/react/charts/chart-appearance.md index c83e7a888..e49b23d54 100644 --- a/chart-sdk/react/charts/chart-appearance.md +++ b/chart-sdk/react/charts/chart-appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart appearance in React Chart component | Syncfusion -description: Learn here all about Chart appearance in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Chart Appearance in React Charts | Syncfusion +description: Learn how to style Syncfusion React Charts with custom color palettes, point and range color mapping, chart area customization, and animation options. control: Chart appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart appearance in React Chart component +# Chart Appearance in React Charts ## Custom color palette diff --git a/chart-sdk/react/charts/chart-dimensions.md b/chart-sdk/react/charts/chart-dimensions.md index 6bec2167d..789ee6a68 100644 --- a/chart-sdk/react/charts/chart-dimensions.md +++ b/chart-sdk/react/charts/chart-dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart dimensions in React Chart component | Syncfusion -description: Learn here all about Chart dimensions in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Chart Dimensions in React Charts | Syncfusion +description: Learn how to set Syncfusion React Charts size for its container, in pixels, or as a percentage of the parent container. control: Chart dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart dimensions in React Chart component +# Chart Dimensions in React Charts ## Size for Container diff --git a/chart-sdk/react/charts/chart-print.md b/chart-sdk/react/charts/chart-print.md index 8ce8f73de..0fee2ccaf 100644 --- a/chart-sdk/react/charts/chart-print.md +++ b/chart-sdk/react/charts/chart-print.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart print in React Chart component | Syncfusion -description: Learn here all about Chart print in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Print and Export in React Charts | Syncfusion +description: Learn how to print and export Syncfusion React Charts to PDF, image, Excel, and CSV formats with multiple Charts on one page. control: Chart print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart print in React Chart component +# Print and Export in React Charts ## Print diff --git a/chart-sdk/react/charts/chart-series.md b/chart-sdk/react/charts/chart-series.md index 73ea7ccc9..aa0f886e6 100644 --- a/chart-sdk/react/charts/chart-series.md +++ b/chart-sdk/react/charts/chart-series.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart series in React Chart component | Syncfusion -description: Learn here all about Chart series in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Chart Series in React Charts | Syncfusion +description: Learn how to render multiple or combination of chart series in Syncfusion React Charts to compare distinct datasets in a single chart area. control: Chart series platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart series in React Chart component +# Chart Series in React Charts ## Multiple Series diff --git a/chart-sdk/react/charts/chart-types/area.md b/chart-sdk/react/charts/chart-types/area.md index 3cac65dac..c66f94629 100644 --- a/chart-sdk/react/charts/chart-types/area.md +++ b/chart-sdk/react/charts/chart-types/area.md @@ -1,8 +1,8 @@ --- layout: post title: Area Chart in React Charts | Syncfusion -description: Learn here all about Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Area Chart +description: Learn to render, customize, and bind Area series in Syncfusion React Charts to visualize trends with filled regions, gradient fills, and border styling. +control: Area Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/bar.md b/chart-sdk/react/charts/chart-types/bar.md index 0c32cb985..e8aa08f48 100644 --- a/chart-sdk/react/charts/chart-types/bar.md +++ b/chart-sdk/react/charts/chart-types/bar.md @@ -1,7 +1,7 @@ --- layout: post title: Bar Chart in React Charts | Syncfusion -description: Learn here all about Bar Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Bar series in Syncfusion React Charts for comparing values across categories with adjustable width and spacing. control: Bar Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/box-whisker.md b/chart-sdk/react/charts/chart-types/box-whisker.md index da2edc821..d15acf8e9 100644 --- a/chart-sdk/react/charts/chart-types/box-whisker.md +++ b/chart-sdk/react/charts/chart-types/box-whisker.md @@ -1,7 +1,7 @@ --- layout: post title: Box and Whisker Chart in React Charts | Syncfusion -description: Learn here all about Box and Whisker in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Box and Whisker series in Syncfusion React Charts to visualize statistical distributions with plot modes and mean indicators. control: Box and Whisker platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/bubble.md b/chart-sdk/react/charts/chart-types/bubble.md index e478a387d..3e8a74e12 100644 --- a/chart-sdk/react/charts/chart-types/bubble.md +++ b/chart-sdk/react/charts/chart-types/bubble.md @@ -1,8 +1,8 @@ --- layout: post title: Bubble Chart in React Charts | Syncfusion -description: Learn here all about Bubble Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Bubble Chart +description: Learn to render, customize, and bind Bubble series in Syncfusion React Charts to plot three-variable data with size mapping, fill, and opacity. +control: Bubble Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/candle.md b/chart-sdk/react/charts/chart-types/candle.md index 149509f29..94be28828 100644 --- a/chart-sdk/react/charts/chart-types/candle.md +++ b/chart-sdk/react/charts/chart-types/candle.md @@ -1,7 +1,7 @@ --- layout: post title: Candle Chart in React Charts | Syncfusion -description: Learn here all about Candle in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Candle series in Syncfusion React Charts to visualize stock price movements with high, low, open, and close values. control: Candle platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/column.md b/chart-sdk/react/charts/chart-types/column.md index 13de6f0cb..d347912ee 100644 --- a/chart-sdk/react/charts/chart-types/column.md +++ b/chart-sdk/react/charts/chart-types/column.md @@ -1,8 +1,8 @@ --- layout: post title: Column Chart in React Charts | Syncfusion -description: Learn here all about Column Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Column Chart +description: Learn to render, customize, and bind Column series in Syncfusion React Charts to compare category data with vertical bars, fill, and border styling. +control: Column Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/error-bar.md b/chart-sdk/react/charts/chart-types/error-bar.md index 0d0682e67..584090c68 100644 --- a/chart-sdk/react/charts/chart-types/error-bar.md +++ b/chart-sdk/react/charts/chart-types/error-bar.md @@ -1,7 +1,7 @@ --- layout: post title: Error Bar Chart in React Charts | Syncfusion -description: Learn here all about Error Bar in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn how to render and customize Error Bar series in Syncfusion React Charts to visualize data variability and uncertainty. control: Error Bar platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/high-low-open-close.md b/chart-sdk/react/charts/chart-types/high-low-open-close.md index 606c8fe33..12f3483b8 100644 --- a/chart-sdk/react/charts/chart-types/high-low-open-close.md +++ b/chart-sdk/react/charts/chart-types/high-low-open-close.md @@ -1,7 +1,7 @@ --- layout: post title: High Low Open Close Chart in React Charts | Syncfusion -description: Learn here all about High Low Open Close Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Hilo Open Close series in Syncfusion React Charts to visualize stock price movements with high, low, open, and close values. control: High Low Open Close platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/high-low.md b/chart-sdk/react/charts/chart-types/high-low.md index 85ef2381e..0e902017c 100644 --- a/chart-sdk/react/charts/chart-types/high-low.md +++ b/chart-sdk/react/charts/chart-types/high-low.md @@ -1,7 +1,7 @@ --- layout: post title: High Low Chart in React Charts | Syncfusion -description: Learn here all about Hilo Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Hilo series in Syncfusion React Charts to display stock price ranges with high and low values, fill, and border styling. control: High Low Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/histogram.md b/chart-sdk/react/charts/chart-types/histogram.md index 7dc3091f6..04bf9c323 100644 --- a/chart-sdk/react/charts/chart-types/histogram.md +++ b/chart-sdk/react/charts/chart-types/histogram.md @@ -1,7 +1,7 @@ --- layout: post title: Histogram Chart in React Charts | Syncfusion -description: Learn here all about Histogram in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render and customize Histogram series in Syncfusion React Charts to display large data distributions with automatic binning and bin intervals. control: Histogram platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/line.md b/chart-sdk/react/charts/chart-types/line.md index 5d93bf8d5..502232fde 100644 --- a/chart-sdk/react/charts/chart-types/line.md +++ b/chart-sdk/react/charts/chart-types/line.md @@ -1,7 +1,7 @@ --- layout: post title: Line Chart in React Charts | Syncfusion -description: Learn here all about Line Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Line series in Syncfusion React Charts to visualize trends over time with width, dash array, fill, and marker styling. control: Line Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/pareto.md b/chart-sdk/react/charts/chart-types/pareto.md index 994c4e39c..6a6fdbea1 100644 --- a/chart-sdk/react/charts/chart-types/pareto.md +++ b/chart-sdk/react/charts/chart-types/pareto.md @@ -1,7 +1,7 @@ --- layout: post title: Pareto Chart in React Charts | Syncfusion -description: Learn here all about Pareto in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Pareto series in Syncfusion React Charts to show cumulative contributions via a combined column and line chart. control: Pareto platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/polar.md b/chart-sdk/react/charts/chart-types/polar.md index 7ecc189a0..a66be9744 100644 --- a/chart-sdk/react/charts/chart-types/polar.md +++ b/chart-sdk/react/charts/chart-types/polar.md @@ -1,8 +1,8 @@ --- layout: post -title: Polar Chart in React Chart | Syncfusion -description: Learn here all about Polar Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Polar Chart +title: Polar Chart in React Charts | Syncfusion +description: Learn to render, customize, and bind Polar series in Syncfusion React Charts to plot data on a circular grid with line, column, area, or spline draw types. +control: Polar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/radar.md b/chart-sdk/react/charts/chart-types/radar.md index a18ec3763..d52583489 100644 --- a/chart-sdk/react/charts/chart-types/radar.md +++ b/chart-sdk/react/charts/chart-types/radar.md @@ -1,8 +1,8 @@ --- layout: post title: Radar Chart in React Charts | Syncfusion -description: Learn here all about Radar Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Radar Chart +description: Learn to render, customize, and bind Radar series in Syncfusion React Charts to plot data on a circular grid with line, column, area, or spline draw types. +control: Radar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/range-area.md b/chart-sdk/react/charts/chart-types/range-area.md index 0023b7109..4594d9242 100644 --- a/chart-sdk/react/charts/chart-types/range-area.md +++ b/chart-sdk/react/charts/chart-types/range-area.md @@ -1,8 +1,8 @@ --- layout: post title: Range Area Chart in React Charts | Syncfusion -description: Learn here all about Range Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Range Area Chart +description: Learn to render, customize, and bind Range Area series in Syncfusion React Charts to visualize value ranges between high and low with smooth filled regions. +control: Range Area Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/range-column.md b/chart-sdk/react/charts/chart-types/range-column.md index 0ac1501ef..3599b5508 100644 --- a/chart-sdk/react/charts/chart-types/range-column.md +++ b/chart-sdk/react/charts/chart-types/range-column.md @@ -1,7 +1,7 @@ --- layout: post title: Range Column Chart in React Charts | Syncfusion -description: Learn here all about Range Column Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Range Column series in Syncfusion React Charts to visualize data ranges with paired high and low columns per category. control: Range Column Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/range-step-area.md b/chart-sdk/react/charts/chart-types/range-step-area.md index fc70e83b1..4b5578bd4 100644 --- a/chart-sdk/react/charts/chart-types/range-step-area.md +++ b/chart-sdk/react/charts/chart-types/range-step-area.md @@ -1,7 +1,7 @@ --- layout: post title: Range Step Area Chart in React Charts | Syncfusion -description: Learn here all about Range Step Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Range Step Area series in Syncfusion React Charts to display data ranges with stepped high-low boundaries. control: Range Step Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/scatter.md b/chart-sdk/react/charts/chart-types/scatter.md index e58ec7a66..729df6967 100644 --- a/chart-sdk/react/charts/chart-types/scatter.md +++ b/chart-sdk/react/charts/chart-types/scatter.md @@ -1,7 +1,7 @@ --- layout: post title: Scatter Chart in React Charts | Syncfusion -description: Learn here all about Scatter Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Scatter series in Syncfusion React Charts to display individual data points with fill, opacity, and marker shape. control: Scatter Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/spline-area.md b/chart-sdk/react/charts/chart-types/spline-area.md index 6ce669338..cd35238bc 100644 --- a/chart-sdk/react/charts/chart-types/spline-area.md +++ b/chart-sdk/react/charts/chart-types/spline-area.md @@ -1,7 +1,7 @@ --- layout: post title: Spline Area Chart in React Charts | Syncfusion -description: Learn here all about Spline Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Spline Area series in Syncfusion React Charts to visualize trends with smooth curved filled regions. control: Spline Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/spline-range-area.md b/chart-sdk/react/charts/chart-types/spline-range-area.md index 33f7a7e66..fd47efd34 100644 --- a/chart-sdk/react/charts/chart-types/spline-range-area.md +++ b/chart-sdk/react/charts/chart-types/spline-range-area.md @@ -1,7 +1,7 @@ --- layout: post title: Spline Range Area Chart in React Charts | Syncfusion -description: Learn here all about Spline Range Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Spline Range Area series in Syncfusion React Charts to display continuous high-low value ranges with smooth curved boundaries. control: Spline Range Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/spline.md b/chart-sdk/react/charts/chart-types/spline.md index a2a0a3f64..2f0dd7c7f 100644 --- a/chart-sdk/react/charts/chart-types/spline.md +++ b/chart-sdk/react/charts/chart-types/spline.md @@ -1,7 +1,7 @@ --- layout: post title: Spline Chart in React Charts | Syncfusion -description: Learn here all about Spline Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render and bind Spline series in Syncfusion React Charts to visualize trends with smooth curves. control: Spline Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stack-area.md b/chart-sdk/react/charts/chart-types/stack-area.md index 360c5d59d..ce319988e 100644 --- a/chart-sdk/react/charts/chart-types/stack-area.md +++ b/chart-sdk/react/charts/chart-types/stack-area.md @@ -1,7 +1,7 @@ --- layout: post title: Stacked Area Chart in React Charts | Syncfusion -description: Learn here all about Stacked Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Stacked Area series in Syncfusion React Charts to show each series contribution to a total over time. control: Stacked Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stack-bar.md b/chart-sdk/react/charts/chart-types/stack-bar.md index 079433f04..3a56d1950 100644 --- a/chart-sdk/react/charts/chart-types/stack-bar.md +++ b/chart-sdk/react/charts/chart-types/stack-bar.md @@ -1,8 +1,8 @@ --- layout: post title: Stacked Bar Chart in React Charts | Syncfusion -description: Learn here all about Stacked Bar Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Stacked Bar Chart +description: Learn to render, customize, and bind Stacked Bar series in Syncfusion React Charts to compare segment contributions across categories using stacked bars. +control: Stacked Bar Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/stack-column.md b/chart-sdk/react/charts/chart-types/stack-column.md index c365bf187..a05e99a12 100644 --- a/chart-sdk/react/charts/chart-types/stack-column.md +++ b/chart-sdk/react/charts/chart-types/stack-column.md @@ -1,8 +1,8 @@ --- layout: post title: Stacked Column Chart in React Charts | Syncfusion -description: Learn here all about Stacked Column Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Stacked Column Chart +description: Learn to render, customize, and bind Stacked Column series in Syncfusion React Charts to compare segment contributions across categories using stacked columns. +control: Stacked Column Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/stack-line.md b/chart-sdk/react/charts/chart-types/stack-line.md index e5a5f9a01..b3243c8db 100644 --- a/chart-sdk/react/charts/chart-types/stack-line.md +++ b/chart-sdk/react/charts/chart-types/stack-line.md @@ -1,8 +1,8 @@ --- layout: post title: Stacked Line Chart in React Charts | Syncfusion -description: Learn here all about Stacked Line Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. -control: Stacked Line Chart +description: Learn to render, customize, and bind Stacked Line series in Syncfusion React Charts to compare each series contribution to a total trend over time. +control: Stacked Line Chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk diff --git a/chart-sdk/react/charts/chart-types/stacked-area.md b/chart-sdk/react/charts/chart-types/stacked-area.md index 92bb9319c..80f33dec3 100644 --- a/chart-sdk/react/charts/chart-types/stacked-area.md +++ b/chart-sdk/react/charts/chart-types/stacked-area.md @@ -1,7 +1,7 @@ --- layout: post title: 100% Stacked Area Chart in React Charts | Syncfusion -description: Learn here all about 100% Stacked Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind 100% Stacked Area series in Syncfusion React Charts to compare proportional contributions as percentages over time. control: 100% Stacked Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stacked-bar.md b/chart-sdk/react/charts/chart-types/stacked-bar.md index 430de7572..b855b90b7 100644 --- a/chart-sdk/react/charts/chart-types/stacked-bar.md +++ b/chart-sdk/react/charts/chart-types/stacked-bar.md @@ -1,7 +1,7 @@ --- layout: post title: 100% Stacked Bar Chart in React Charts | Syncfusion -description: Learn here all about 100% Stacked Bar Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind 100% Stacked Bar series in Syncfusion React Charts to compare proportional segment contributions across categories. control: 100% Stacked Bar chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stacked-column.md b/chart-sdk/react/charts/chart-types/stacked-column.md index cfdfe41dc..b22afa9b9 100644 --- a/chart-sdk/react/charts/chart-types/stacked-column.md +++ b/chart-sdk/react/charts/chart-types/stacked-column.md @@ -1,7 +1,7 @@ --- layout: post title: 100% Stacked Column Chart in React Charts | Syncfusion -description: Learn here all about 100% Stacked Column Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind 100% Stacked Column series in Syncfusion React Charts to compare proportional segment contributions across categories. control: 100% Stacked Column Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stacked-line.md b/chart-sdk/react/charts/chart-types/stacked-line.md index b74989556..7ad89f979 100644 --- a/chart-sdk/react/charts/chart-types/stacked-line.md +++ b/chart-sdk/react/charts/chart-types/stacked-line.md @@ -1,7 +1,7 @@ --- layout: post title: 100% Stacked Line Chart in React Charts | Syncfusion -description: Learn here all about 100% Stacked Line Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind 100% Stacked Line series in Syncfusion React Charts to compare proportional series contributions over time. control: 100% Stacked Line Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/stacked-step-area.md b/chart-sdk/react/charts/chart-types/stacked-step-area.md index 5bb1ada7d..02e28e3f2 100644 --- a/chart-sdk/react/charts/chart-types/stacked-step-area.md +++ b/chart-sdk/react/charts/chart-types/stacked-step-area.md @@ -1,7 +1,7 @@ --- layout: post title: Stacked Step Area Chart in React Charts | Syncfusion -description: Learn here all about Stacked Step Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Stacked Step Area series in Syncfusion React Charts to combine stacked areas with stepped boundaries. control: Stacked Step Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/step-area.md b/chart-sdk/react/charts/chart-types/step-area.md index 03f927638..4d9754238 100644 --- a/chart-sdk/react/charts/chart-types/step-area.md +++ b/chart-sdk/react/charts/chart-types/step-area.md @@ -1,7 +1,7 @@ --- layout: post title: Step Area Chart in React Charts | Syncfusion -description: Learn here all about Step Area Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Step Area series in Syncfusion React Charts to display data with stepped filled regions for discrete value changes. control: Step Area Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/step-line.md b/chart-sdk/react/charts/chart-types/step-line.md index 5838e49c6..131a316fa 100644 --- a/chart-sdk/react/charts/chart-types/step-line.md +++ b/chart-sdk/react/charts/chart-types/step-line.md @@ -1,7 +1,7 @@ --- layout: post title: Step Line Chart in React Charts | Syncfusion -description: Learn here all about Step Line Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Step Line series in Syncfusion React Charts to display data with stepped horizontal and vertical lines. control: Step Line Chart platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/vertical.md b/chart-sdk/react/charts/chart-types/vertical.md index 36b2e1493..b45697e49 100644 --- a/chart-sdk/react/charts/chart-types/vertical.md +++ b/chart-sdk/react/charts/chart-types/vertical.md @@ -1,7 +1,7 @@ --- layout: post title: Vertical Chart in React Charts | Syncfusion -description: Learn here all about Vertical Chart in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render any series in vertical orientation in Syncfusion React Charts by setting the isTransposed property to swap x and y axes. control: Vertical platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/chart-types/waterfall.md b/chart-sdk/react/charts/chart-types/waterfall.md index fcbc4da3c..624b8e03e 100644 --- a/chart-sdk/react/charts/chart-types/waterfall.md +++ b/chart-sdk/react/charts/chart-types/waterfall.md @@ -1,7 +1,7 @@ --- layout: post title: Waterfall Chart in React Charts | Syncfusion -description: Learn here all about Waterfall in Syncfusion React Charts component of Syncfusion Essential JS 2 and more. +description: Learn to render, customize, and bind Waterfall series in Syncfusion React Charts to visualize cumulative effects of positive and negative values. control: Waterfall platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/charts/cross-hair-and-track-ball.md b/chart-sdk/react/charts/cross-hair-and-track-ball.md index 98aed8289..8fd3a648d 100644 --- a/chart-sdk/react/charts/cross-hair-and-track-ball.md +++ b/chart-sdk/react/charts/cross-hair-and-track-ball.md @@ -1,14 +1,14 @@ --- layout: post -title: Cross hair and track ball in React Chart component | Syncfusion -description: Learn here all about Cross hair and track ball in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Crosshair and Trackball in React Charts | Syncfusion +description: Learn how to add crosshair and trackball interactions to Syncfusion React Charts to inspect data points precisely with axis tooltips and highlighting. control: Cross hair and track ball platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Cross hair and track ball in React Chart component +# Crosshair and Trackball in React Charts The crosshair feature displays vertical and horizontal guide lines that intersect at the mouse or touch position, helping to identify the corresponding axis values precisely. diff --git a/chart-sdk/react/charts/data-editing.md b/chart-sdk/react/charts/data-editing.md index d42b459c8..b92d379c3 100644 --- a/chart-sdk/react/charts/data-editing.md +++ b/chart-sdk/react/charts/data-editing.md @@ -1,7 +1,7 @@ --- layout: post -title: Data editing in React Chart component | Syncfusion -description: Learn here all about Data editing in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Data Editing in React Charts | Syncfusion +description: Learn how to enable interactive data editing in Syncfusion React Charts so users can drag and drop chart points to update values within a configured range. control: Data editing platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Data editing in React Chart component +# Data Editing in React Charts ## Enable Data Editing diff --git a/chart-sdk/react/charts/data-labels.md b/chart-sdk/react/charts/data-labels.md index db74e0c9a..06de21b39 100644 --- a/chart-sdk/react/charts/data-labels.md +++ b/chart-sdk/react/charts/data-labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Data labels in React Chart component | Syncfusion -description: Learn here all about Data labels in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Data Labels in React Charts | Syncfusion +description: Learn how to add and format data labels in Syncfusion React Charts with custom positions, templates, margins, rotation, and per-point styling. control: Data labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data labels in React Chart component +# Data Labels in React Charts Data labels display the values of data points directly on the chart, reducing the need to reference axes for exact values. Enable data labels by setting the [`visible`](https://ej2.syncfusion.com/react/documentation/api/chart/dataLabelSettings#visible) option to `true` in the `dataLabel` configuration. Labels automatically adjust to avoid overlapping and maintain readability. diff --git a/chart-sdk/react/charts/data-markers.md b/chart-sdk/react/charts/data-markers.md index c24428748..c9461444c 100644 --- a/chart-sdk/react/charts/data-markers.md +++ b/chart-sdk/react/charts/data-markers.md @@ -1,14 +1,14 @@ --- layout: post -title: Data markers in React Chart component | Syncfusion -description: Learn here all about Data markers in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Data Markers in React Charts | Syncfusion +description: Learn how to add markers to Syncfusion React Charts with custom shapes, images, fill colors, borders, and per-point styling for clear data point visualization. control: Data markers platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data markers in React Chart component +# Data Markers in React Charts Data markers are visual indicators placed at each data point on a series, helping to clearly identify and highlight individual values in your chart. Markers improve readability and accessibility, especially in line and area charts where data points may otherwise be unclear. Customize marker shape, color, size, and appearance to match your design requirements. diff --git a/chart-sdk/react/charts/date-time-axis.md b/chart-sdk/react/charts/date-time-axis.md index 1d077c47d..b56354c4f 100644 --- a/chart-sdk/react/charts/date-time-axis.md +++ b/chart-sdk/react/charts/date-time-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Date time axis in React Chart component | Syncfusion -description: Learn here all about Date time axis in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Date time axis +title: DateTime Axis in React Charts | Syncfusion +description: Learn how to use DateTime and DateTimeCategory axes in Syncfusion React Charts for time-based data with custom range, interval, and label formatting. +control: Date time axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Date time axis in React Chart component +# DateTime Axis in React Charts ## DateTime Axis diff --git a/chart-sdk/react/charts/dynamic-data-update.md b/chart-sdk/react/charts/dynamic-data-update.md index f4345570c..7d1c19adf 100644 --- a/chart-sdk/react/charts/dynamic-data-update.md +++ b/chart-sdk/react/charts/dynamic-data-update.md @@ -1,14 +1,14 @@ --- layout: post -title: Dynamic data update in React Chart component | Syncfusion -description: Learn here all about dynamic data update in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Dynamic Data Update in React Charts | Syncfusion +description: Learn how to dynamically add, remove, or replace data points in Syncfusion React Charts without re-rendering the entire chart. control: Dynamic Data Update platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Dynamic data update in React Chart component +# Dynamic Data Update in React Charts The [React Charts](https://www.syncfusion.com/react-components/react-charts) component provides methods to dynamically modify data without requiring a full chart refresh. This enables real-time data visualization, interactive features, and responsive user experiences. Common scenarios include adding sensor readings, removing outdated data points, replacing entire datasets, and enabling click-based data manipulation. diff --git a/chart-sdk/react/charts/ej1-api-migration.md b/chart-sdk/react/charts/ej1-api-migration.md index 8fccfb231..e004cdbc1 100644 --- a/chart-sdk/react/charts/ej1-api-migration.md +++ b/chart-sdk/react/charts/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Chart component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Ej1 api migration +title: EJ1 API Migration in React Charts | Syncfusion +description: Learn how to migrate Syncfusion React Charts from Essential JS 1 to Essential JS 2, covering property, method, event, and series API changes. +control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Chart component +# EJ1 API Migration in React Charts This article describes the API migration process of the Chart component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/charts/feature-modules.md b/chart-sdk/react/charts/feature-modules.md index 862d5ee3f..c9f8281e4 100644 --- a/chart-sdk/react/charts/feature-modules.md +++ b/chart-sdk/react/charts/feature-modules.md @@ -1,14 +1,14 @@ --- layout: post -title: Module in React Chart component | Syncfusion -description: Learn here all about Module in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Module +title: Feature Modules in React Charts | Syncfusion +description: Learn how to load Syncfusion React Charts feature modules on demand to keep your bundle size small and load only what you need. +control: Module platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Module in React Chart component +# Feature Modules in React Charts The following available modules should be injected to extend the Chart's functionality. diff --git a/chart-sdk/react/charts/financial-types.md b/chart-sdk/react/charts/financial-types.md index 76a763506..4e1ff6820 100644 --- a/chart-sdk/react/charts/financial-types.md +++ b/chart-sdk/react/charts/financial-types.md @@ -1,14 +1,14 @@ --- layout: post -title: Financial types in React Chart component | Syncfusion -description: Learn here all about Financial types in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Financial Types in React Charts | Syncfusion +description: Learn how to render Hilo, candle, and Hilo Open-Close financial chart types in Syncfusion React Charts for market data visualization. control: Financial types platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Financial types in React Chart component +# Financial Types in React Charts Financial charts are used to illustrate the movements in the price of a financial instrument over time. diff --git a/chart-sdk/react/charts/getting-started.md b/chart-sdk/react/charts/getting-started.md index df9a1ed79..63484ec50 100644 --- a/chart-sdk/react/charts/getting-started.md +++ b/chart-sdk/react/charts/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting Started with React Chart Component | Syncfusion -description: Check out and learn about the Getting Started with React Chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Charts | Syncfusion +description: Learn how to add Syncfusion React Charts to a React app using the Syncfusion CLI or Vite, install the package, inject modules, bind data, and render your first chart. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with the React Chart Component +# Getting Started with React Charts This section explains how to create a simple Chart component. diff --git a/chart-sdk/react/charts/gradient.md b/chart-sdk/react/charts/gradient.md index 30a3b0d06..fbb63ed1d 100644 --- a/chart-sdk/react/charts/gradient.md +++ b/chart-sdk/react/charts/gradient.md @@ -1,7 +1,7 @@ --- layout: post -title: Gradient in React Chart component | Syncfusion -description: Learn here all about Gradient in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Gradient in React Charts | Syncfusion +description: Learn how to apply linear and radial gradient fills to Syncfusion React Charts series for richer visual styling. control: Gradient platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gradient in React Chart control +# Gradient in React Charts diff --git a/chart-sdk/react/charts/how-to/add-series.md b/chart-sdk/react/charts/how-to/add-series.md index 6969f3dad..3f30badfa 100644 --- a/chart-sdk/react/charts/how-to/add-series.md +++ b/chart-sdk/react/charts/how-to/add-series.md @@ -1,14 +1,14 @@ --- layout: post -title: Add series in React Chart component | Syncfusion -description: Learn here all about Add series in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to add or remove series in React Charts | Syncfusion +description: Learn how to add or remove series dynamically in Syncfusion React Charts at runtime without re-rendering the chart. control: Add series platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Add series in React Chart component +# How to add or remove series in React Charts You can add or remove the chart series dynamically by using the `addSeries` or `removeSeries` method. diff --git a/chart-sdk/react/charts/how-to/click-data.md b/chart-sdk/react/charts/how-to/click-data.md index 2c90f7b6a..df9d28089 100644 --- a/chart-sdk/react/charts/how-to/click-data.md +++ b/chart-sdk/react/charts/how-to/click-data.md @@ -1,14 +1,14 @@ --- layout: post -title: Click data in React Chart component | Syncfusion -description: Learn here all about Click data in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to handle point click in React Charts | Syncfusion +description: Learn how to handle point-click events on Syncfusion React Charts and read the clicked data point values in your app. control: Click data platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Click data in React Chart component +# How to handle point click in React Charts By using the [`pointClick`](https://ej2.syncfusion.com/react/documentation/api/chart#pointclick) event, you can get the chart data of clicked area. diff --git a/chart-sdk/react/charts/how-to/data-label-template.md b/chart-sdk/react/charts/how-to/data-label-template.md index 3d37753b2..0a6b4660a 100644 --- a/chart-sdk/react/charts/how-to/data-label-template.md +++ b/chart-sdk/react/charts/how-to/data-label-template.md @@ -1,14 +1,14 @@ --- layout: post -title: Data label template in React Chart component | Syncfusion -description: Learn here all about Data label template in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Data label template +title: How to use a data label template in React Charts | Syncfusion +description: Learn how to render a custom HTML template for data labels in Syncfusion React Charts with field-driven content. +control: Data label template platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data label template in React Chart component +# How to use a data label template in React Charts You can bind text and interior information for a point from dataSource other than x and y value. To change color for the background in the datalabel template, you can use `${point.text}`. To use point.text, you have to bind the property from dataSource to name in the datalabel options. diff --git a/chart-sdk/react/charts/how-to/footer.md b/chart-sdk/react/charts/how-to/footer.md index 33a9a3837..a5772fcff 100644 --- a/chart-sdk/react/charts/how-to/footer.md +++ b/chart-sdk/react/charts/how-to/footer.md @@ -1,14 +1,14 @@ --- layout: post -title: Footer in React Chart component | Syncfusion -description: Learn here all about Footer in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to add a footer in React Charts | Syncfusion +description: Learn how to add a footer to Syncfusion React Charts using custom HTML annotations on the chart area. control: Footer platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Footer in React Chart component +# How to add a footer in React Charts By using `annotation`, you can place any html elements to chart in a desired view. diff --git a/chart-sdk/react/charts/how-to/grid-data-chart.md b/chart-sdk/react/charts/how-to/grid-data-chart.md index 2ea95ef8a..b7ffb56e5 100644 --- a/chart-sdk/react/charts/how-to/grid-data-chart.md +++ b/chart-sdk/react/charts/how-to/grid-data-chart.md @@ -1,14 +1,14 @@ --- layout: post -title: Grid data chart in React Chart component | Syncfusion -description: Learn here all about Grid data chart in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to visualize Grid data in React Charts | Syncfusion +description: Learn how to visualize data from a Syncfusion React Grid in Syncfusion React Charts by using the Grid's actionComplete and dataBound events. control: Grid data chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Grid data chart in React Chart component +# How to visualize Grid data in React Charts You can visualize the data that returned by grid in chart. diff --git a/chart-sdk/react/charts/how-to/initial-scrollbar.md b/chart-sdk/react/charts/how-to/initial-scrollbar.md index 56fbc901b..7a6fac855 100644 --- a/chart-sdk/react/charts/how-to/initial-scrollbar.md +++ b/chart-sdk/react/charts/how-to/initial-scrollbar.md @@ -1,14 +1,14 @@ --- layout: post -title: Initial scrollbar in React Chart component | Syncfusion -description: Learn here all about Initial scrollbar in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to set initial scrollbar in React Charts | Syncfusion +description: Learn how to make the scrollbar visible on initial render of Syncfusion React Charts for zoomed chart views. control: Initial scrollbar platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Initial scrollbar in React Chart component +# How to set initial scrollbar in React Charts By setting `zoomFactor` in primaryXAxis and `isZoomed` value as `true` in [`load`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#load) event and `enableScrollbar` value as `true` in`zoomSettings`, you can make the scrollbar visible in initial rendering of chart. diff --git a/chart-sdk/react/charts/how-to/legend-customization.md b/chart-sdk/react/charts/how-to/legend-customization.md index 0bec626e9..4e50a8a57 100644 --- a/chart-sdk/react/charts/how-to/legend-customization.md +++ b/chart-sdk/react/charts/how-to/legend-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend customization in React Chart component | Syncfusion -description: Learn here all about Legend customization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to customize legend in React Charts | Syncfusion +description: Learn how to customize legend per series in Syncfusion React Charts for a more meaningful legend display. control: Legend customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend customization in React Chart component +# How to customize legend in React Charts By using the [`legendRender`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#legendrender), you can customize the legend shape. diff --git a/chart-sdk/react/charts/how-to/live-chart.md b/chart-sdk/react/charts/how-to/live-chart.md index 7a9363827..5e7e84dfd 100644 --- a/chart-sdk/react/charts/how-to/live-chart.md +++ b/chart-sdk/react/charts/how-to/live-chart.md @@ -1,14 +1,14 @@ --- layout: post -title: Live chart in React Chart component | Syncfusion -description: Learn here all about Live chart in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Live chart +title: How to create a live chart in React Charts | Syncfusion +description: Learn how to create a live Syncfusion React Charts that updates with new data in real time for dynamic dashboards and monitoring. +control: Live chart platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Live chart in React Chart component +# How to create a live chart in React Charts You can update a chart with live data by using the set interval. diff --git a/chart-sdk/react/charts/how-to/marker-customization.md b/chart-sdk/react/charts/how-to/marker-customization.md index 70d1d98ec..49e9d076e 100644 --- a/chart-sdk/react/charts/how-to/marker-customization.md +++ b/chart-sdk/react/charts/how-to/marker-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Marker customization in React Chart component | Syncfusion -description: Learn here all about Marker customization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to customize marker shape in React Charts | Syncfusion +description: Learn how to customize marker shape per data point in Syncfusion React Charts series for richer visual cues. control: Marker customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Marker customization in React Chart component +# How to customize marker shape in React Charts By using the [`pointRender`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#pointrender), you can customize the marker shape. diff --git a/chart-sdk/react/charts/how-to/percentage-tool-tip.md b/chart-sdk/react/charts/how-to/percentage-tool-tip.md index e7afc681b..3768c8b32 100644 --- a/chart-sdk/react/charts/how-to/percentage-tool-tip.md +++ b/chart-sdk/react/charts/how-to/percentage-tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Percentage tool tip in React Chart component | Syncfusion -description: Learn here all about Percentage tool tip in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to show percentage in pie tooltip in React Charts | Syncfusion +description: Learn how to show each point's percentage share in the Syncfusion React Charts pie tooltip for clearer comparison. control: Percentage tool tip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Percentage tool tip in React Chart component +# How to show percentage in pie tooltip in React Charts By using the [`tooltipRender`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#tooltiprender) event, you can show the percentage value for each point of pie series in tooltip. diff --git a/chart-sdk/react/charts/how-to/points-customization.md b/chart-sdk/react/charts/how-to/points-customization.md index 607eae042..76d71c7c4 100644 --- a/chart-sdk/react/charts/how-to/points-customization.md +++ b/chart-sdk/react/charts/how-to/points-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Points customization in React Chart component | Syncfusion -description: Learn here all about Points customization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to customize point colors in React Charts | Syncfusion +description: Learn how to customize individual point colors in Syncfusion React Charts series for clearer category highlighting. control: Points customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Points customization in React Chart component +# How to customize point colors in React Charts You can customize the series points by using the `pointColorMapping` property. diff --git a/chart-sdk/react/charts/how-to/prevent-data-label.md b/chart-sdk/react/charts/how-to/prevent-data-label.md index 5e72b8110..5c890860e 100644 --- a/chart-sdk/react/charts/how-to/prevent-data-label.md +++ b/chart-sdk/react/charts/how-to/prevent-data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Prevent data label in React Chart component | Syncfusion -description: Learn here all about Prevent data label in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to prevent data labels in React Charts | Syncfusion +description: Learn how to prevent Syncfusion React Charts data labels from showing zero values for cleaner numeric visualizations. control: Prevent data label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Prevent data label in React Chart component +# How to prevent data labels in React Charts To prevent the chart data label when the data value is 0, follow the given steps: diff --git a/chart-sdk/react/charts/how-to/selected-data-grid.md b/chart-sdk/react/charts/how-to/selected-data-grid.md index fd43cb4ad..e16973e36 100644 --- a/chart-sdk/react/charts/how-to/selected-data-grid.md +++ b/chart-sdk/react/charts/how-to/selected-data-grid.md @@ -1,14 +1,14 @@ --- layout: post -title: Selected data grid in React Chart component | Syncfusion -description: Learn here all about Selected data grid in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to display selected data in a grid in React Charts | Syncfusion +description: Learn how to display Syncfusion React Charts range-selected data values inside a Syncfusion Grid using drag events. control: Selected data grid platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Selected data grid in React Chart component +# How to display selected data in a grid in React Charts By using the [`dragComplete`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#dragcomplete), you can get the selected data values for range selection. diff --git a/chart-sdk/react/charts/how-to/stacking-total.md b/chart-sdk/react/charts/how-to/stacking-total.md index 3482d1333..a2bde31ed 100644 --- a/chart-sdk/react/charts/how-to/stacking-total.md +++ b/chart-sdk/react/charts/how-to/stacking-total.md @@ -1,14 +1,14 @@ --- layout: post -title: Stacking total in React Chart component | Syncfusion -description: Learn here all about Stacking total in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +ttitle: How to show stacking series total in React Charts | Syncfusion +description: Learn how to show the total value on top of stacked Syncfusion React Charts series using annotations at each x point. control: Stacking total platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Stacking total in React Chart component +# How to show stacking series total in React Charts By using the `annotation`, you can show any element in desired view. diff --git a/chart-sdk/react/charts/how-to/threshold.md b/chart-sdk/react/charts/how-to/threshold.md index 28191b095..70d334ef8 100644 --- a/chart-sdk/react/charts/how-to/threshold.md +++ b/chart-sdk/react/charts/how-to/threshold.md @@ -1,14 +1,14 @@ --- layout: post -title: Threshold in React Chart component | Syncfusion -description: Learn here all about Threshold in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to add a threshold line in React Charts | Syncfusion +description: Learn how to mark a y-axis threshold line on Syncfusion React Charts using striplines to highlight reference values. control: Threshold platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Threshold in React Chart component +# How to add a threshold line in React Charts You can mark a threshold in chart by using the `stripline`. diff --git a/chart-sdk/react/charts/how-to/tool-tip-format.md b/chart-sdk/react/charts/how-to/tool-tip-format.md index 858133a79..c7a352aca 100644 --- a/chart-sdk/react/charts/how-to/tool-tip-format.md +++ b/chart-sdk/react/charts/how-to/tool-tip-format.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip format in React Chart component | Syncfusion -description: Learn here all about Tool tip format in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to format date tooltips in React Charts | Syncfusion +description: Learn how to format date and time values in Syncfusion React Charts tooltips for clearer, locale-friendly data display. control: Tool tip format platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip format in React Chart component +# How to format date tooltips in React Charts Using [`tooltipRender`](https://ej2.syncfusion.com/react/documentation/api/chart/chartModel#tooltiprender) event, you can able to format the datetime value instead of rendered value. diff --git a/chart-sdk/react/charts/how-to/tool-tip-table.md b/chart-sdk/react/charts/how-to/tool-tip-table.md index f0dea5f62..caa56df89 100644 --- a/chart-sdk/react/charts/how-to/tool-tip-table.md +++ b/chart-sdk/react/charts/how-to/tool-tip-table.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip table in React Chart component | Syncfusion -description: Learn here all about Tool tip table in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: How to add a table in the tooltip in React Charts | Syncfusion +description: Learn how to show a custom HTML table inside Syncfusion React Charts tooltips using the template property. control: Tool tip table platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip table in React Chart component +# How to add a table in the tooltip in React Charts You can show the tooltip as table by using template property in tooltip. diff --git a/chart-sdk/react/charts/internationalization.md b/chart-sdk/react/charts/internationalization.md index a73944999..e3a7f0039 100644 --- a/chart-sdk/react/charts/internationalization.md +++ b/chart-sdk/react/charts/internationalization.md @@ -1,14 +1,14 @@ --- layout: post -title: Internationalization in React Chart component | Syncfusion -description: Learn here all about Internationalization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Internationalization in React Charts | Syncfusion +description: Learn how to localize Syncfusion React Charts for global users with right-to-left layouts, locale-specific number formats, and culture data. control: Internationalization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Internationalization in React Chart component +# Internationalization in React Charts Chart provides support for internationalization for the following elements: diff --git a/chart-sdk/react/charts/legend.md b/chart-sdk/react/charts/legend.md index 318671d3f..91049ca96 100644 --- a/chart-sdk/react/charts/legend.md +++ b/chart-sdk/react/charts/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Chart component | Syncfusion -description: Learn here all about Legend in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Legend in React Charts | Syncfusion +description: Learn how to add and customize the legend in Syncfusion React Charts to identify series, control position, and toggle series visibility. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Chart component +# Legend in React Charts The legend provides information about the series rendered in the chart and helps users identify each series by its color, shape, or style. diff --git a/chart-sdk/react/charts/localization.md b/chart-sdk/react/charts/localization.md index 97198f5a7..1205ecad2 100644 --- a/chart-sdk/react/charts/localization.md +++ b/chart-sdk/react/charts/localization.md @@ -1,14 +1,14 @@ --- layout: post -title: Localization in React Chart component | Syncfusion -description: Learn here all about Localization in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Localization in React Charts | Syncfusion +description: Learn how to localize Syncfusion React Charts by translating axis labels, tooltips, and legends into different languages for global audiences. control: Localization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Localization in React Chart component +# Localization in React Charts The localization library localizes the Chart's default text content. Static text used by chart features (for example, zoom toolbar labels) can be translated by providing a locale value and a translation object. diff --git a/chart-sdk/react/charts/logarithmic-axis.md b/chart-sdk/react/charts/logarithmic-axis.md index c720678a4..509806b27 100644 --- a/chart-sdk/react/charts/logarithmic-axis.md +++ b/chart-sdk/react/charts/logarithmic-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Logarithmic axis in React Chart component | Syncfusion -description: Learn here all about Logarithmic axis in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Logarithmic Axis in React Charts | Syncfusion +description: Learn how to use a logarithmic axis in Syncfusion React Charts to plot data that spans several orders of magnitude on a compressed scale. control: Logarithmic axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Logarithmic axis in React Chart component +# Logarithmic Axis in React Charts diff --git a/chart-sdk/react/charts/multiple-panes.md b/chart-sdk/react/charts/multiple-panes.md index fd537b69b..e9fdc01a6 100644 --- a/chart-sdk/react/charts/multiple-panes.md +++ b/chart-sdk/react/charts/multiple-panes.md @@ -1,14 +1,14 @@ --- layout: post -title: Multiple panes in React Chart component | Syncfusion -description: Learn here all about Multiple panes in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Multiple Panes in React Charts | Syncfusion +description: Learn how to split Syncfusion React Charts into multiple panes to compare related series like price and volume in a single, aligned view. control: Multiple panes platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Multiple panes in React Chart component +# Multiple Panes in React Charts The chart area can be divided into multiple panes by defining rows and columns using the [`rows`](https://ej2.syncfusion.com/react/documentation/api/chart/row) and [`columns`](https://ej2.syncfusion.com/react/documentation/api/chart/column) collections. This feature is useful for displaying multiple related datasets within the same chart container while maintaining clear visual separation. diff --git a/chart-sdk/react/charts/nextjs-getting-started.md b/chart-sdk/react/charts/nextjs-getting-started.md index c2fb5d69e..24a13c901 100644 --- a/chart-sdk/react/charts/nextjs-getting-started.md +++ b/chart-sdk/react/charts/nextjs-getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: React Chart getting started with Next.js | Syncfusion -description: Check out and learn here all about how to use the Syncfusion React UI components in the Next.js project. +title: Getting Started with React Charts in Next.js | Syncfusion +description: Learn how to set up Syncfusion React Charts in a Next.js 14 or 15 project, install the package, and add the Chart component to a server-rendered page. control: Next.js platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Chart in Next.js +# Getting Started with React Charts in Next.js This section provides a step-by-step guide for setting up a Next.js application and integrating the [React Charts](https://www.syncfusion.com/react-components/react-charts) component. diff --git a/chart-sdk/react/charts/numeric-axis.md b/chart-sdk/react/charts/numeric-axis.md index e66719470..a001ef916 100644 --- a/chart-sdk/react/charts/numeric-axis.md +++ b/chart-sdk/react/charts/numeric-axis.md @@ -1,7 +1,7 @@ --- layout: post -title: Numeric axis in React Chart component | Syncfusion -description: Learn here all about Numeric axis in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Numeric axis in React Charts | Syncfusion +description: Learn how to configure a numeric axis in Syncfusion React Charts to plot continuous numeric values with a defined range and interval. control: Numeric axis platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Numeric axis in React Chart component +# Numeric axis in React Charts The numeric axis is used to represent numeric values in a chart. By default, the `valueType` of an axis is set to `Double`, which is suitable for displaying continuous numerical data. diff --git a/chart-sdk/react/charts/preact.md b/chart-sdk/react/charts/preact.md index a0408e652..3b03f3a6d 100644 --- a/chart-sdk/react/charts/preact.md +++ b/chart-sdk/react/charts/preact.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting Started with React Chart Component for Preact | Syncfusion -description: Check out and learn about getting started with the Preact Framework and React Chart Component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Charts in Preact | Syncfusion +description: Learn how to set up Syncfusion React Charts in a Preact project, install the package, and render your first chart in this lightweight React alternative. control: Preact platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Chart Component in the Preact Framework +# Getting Started with React Charts in Preact This article provides a step-by-step guide for setting up a [Preact](https://preactjs.com) project and integrating the [React Charts](https://www.syncfusion.com/react-components/react-charts) component. diff --git a/chart-sdk/react/charts/render-methods.md b/chart-sdk/react/charts/render-methods.md index 07e0b0837..26fa88972 100644 --- a/chart-sdk/react/charts/render-methods.md +++ b/chart-sdk/react/charts/render-methods.md @@ -1,7 +1,7 @@ --- layout: post -title: Render methods in React Chart component | Syncfusion -description: Learn here all about Render methods in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Render methods in React Charts | Syncfusion +description: Learn how to use the render and refresh methods on Syncfusion React Charts to re-render the chart manually after data or option changes. control: Render methods platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Render methods in React Chart component +# Render methods in React Charts Chart uses following two rendering methods. diff --git a/chart-sdk/react/charts/selection.md b/chart-sdk/react/charts/selection.md index ce7a0a468..2fc9a5e87 100644 --- a/chart-sdk/react/charts/selection.md +++ b/chart-sdk/react/charts/selection.md @@ -1,15 +1,15 @@ --- layout: post -title: Selection in React Chart component | Syncfusion -description: Learn here all about Selection in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Selection +title: Selection in React Charts | Syncfusion +description: Learn how to select points, series, or rectangular and lasso regions in Syncfusion React Charts using Point, Series, Cluster, Drag, and Lasso selection modes. +control: Selection platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Selection in React Chart component +# Selection in React Charts The chart provides selection support for both series and individual data points when users interact with the chart using mouse clicks. diff --git a/chart-sdk/react/charts/series-label.md b/chart-sdk/react/charts/series-label.md index ef6ffe7c5..2a912c06b 100644 --- a/chart-sdk/react/charts/series-label.md +++ b/chart-sdk/react/charts/series-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Series label in React Chart component | Syncfusion -description: Learn here all about Series label in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Series label in React Charts | Syncfusion +description: Learn how to add labels to the series in Syncfusion React Charts to make every series self-describing without relying on the legend. control: Series label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Series label in React Chart component +# Series label in React Charts The series label displays the name of each series inline, positioned near the end of the series path or the last visible data point. This helps identify each series without referring to the legend. diff --git a/chart-sdk/react/charts/strip-line.md b/chart-sdk/react/charts/strip-line.md index 2ac91e27a..1ad473dee 100644 --- a/chart-sdk/react/charts/strip-line.md +++ b/chart-sdk/react/charts/strip-line.md @@ -1,8 +1,8 @@ --- layout: post -title: Strip line in React Chart component | Syncfusion -description: Learn here all about Strip line in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Strip line +title: Strip line in React Charts | Syncfusion +description: Learn how to add horizontal, vertical, or segmented strip lines in Syncfusion React Charts to mark thresholds, ranges, or reference values. +control: Strip line platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Strip line in React Chart component +# Strip line in React Charts The [React Charts](https://www.syncfusion.com/react-components/react-charts) component supports horizontal and vertical strip lines, providing visual guides to highlight specific ranges in the chart area. Strip lines can be added to both axes and fully customized based on visual and functional requirements. To use strip line features, inject the `StripLine` module into the `services`. diff --git a/chart-sdk/react/charts/synchronized-chart.md b/chart-sdk/react/charts/synchronized-chart.md index 60f107a4a..504e92f45 100644 --- a/chart-sdk/react/charts/synchronized-chart.md +++ b/chart-sdk/react/charts/synchronized-chart.md @@ -1,14 +1,14 @@ --- layout: post -title: Synchronized Charts in React Chart component | Syncfusion -description: Learn here all about Synchronized Charts in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Synchronized Charts in React Charts | Syncfusion +description: Learn how to synchronize Syncfusion React Charts across multiple panels so tooltip, crosshair, and selection events move together for linked views. control: Synchronized charts platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Synchronized Charts in React Chart component +# Synchronized Charts in React Charts Synchronized charts allow multiple chart instances to share common interactions so that actions performed on one chart are reflected across the others. This approach is useful for comparing related datasets and analyzing trends consistently across multiple visualizations. diff --git a/chart-sdk/react/charts/technical-indicators.md b/chart-sdk/react/charts/technical-indicators.md index 49dfd364a..f07e90ea3 100644 --- a/chart-sdk/react/charts/technical-indicators.md +++ b/chart-sdk/react/charts/technical-indicators.md @@ -1,15 +1,15 @@ --- layout: post -title: Technical indicators in React Chart component | Syncfusion -description: Learn here all about Technical indicators in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Technical indicators +title: Technical indicators in React Charts | Syncfusion +description: Learn how to overlay technical indicators on Syncfusion React Charts for financial analysis. +control: Technical indicators platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Technical indicators in React Chart component +# Technical indicators in React Charts A technical indicator is a mathematical calculation based on historical price, volume, or open‑interest information that aims to forecast financial market direction. diff --git a/chart-sdk/react/charts/title-subtitle.md b/chart-sdk/react/charts/title-subtitle.md index 83bfd4626..0cf6c2d84 100644 --- a/chart-sdk/react/charts/title-subtitle.md +++ b/chart-sdk/react/charts/title-subtitle.md @@ -1,14 +1,14 @@ --- layout: post -title: Title and subtitle in React Chart component | Syncfusion -description: Learn here all about Title and subtitle in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Title and subtitle in React Charts | Syncfusion +description: Learn how to add a title, subtitle, and custom text to Syncfusion React Charts with options for alignment, font, and background styling. control: Title and subtitle platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title and Subtitle in React Chart Component +# Title and subtitle in React Charts Chart titles and subtitles help provide context for the visualized data. The title typically indicates the main subject or metric represented in the chart, while the subtitle adds supporting details such as data sources, time ranges, or explanatory notes. Both elements can be customized in terms of position, alignment, and style to align with application design requirements. diff --git a/chart-sdk/react/charts/tool-tip.md b/chart-sdk/react/charts/tool-tip.md index c0dcfdf01..214fc96e8 100644 --- a/chart-sdk/react/charts/tool-tip.md +++ b/chart-sdk/react/charts/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React Chart component | Syncfusion -description: Learn here all about Tooltip in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Tooltip +title: Tooltip in React Charts | Syncfusion +description: Learn how to enable tooltips in Syncfusion React Charts with custom formats, HTML templates, highlighting, fixed position, and follow-pointer behavior. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React Chart component +# Tooltip in React Charts The chart displays detailed information about a data point through a tooltip when the mouse pointer moves over the point. diff --git a/chart-sdk/react/charts/trend-lines.md b/chart-sdk/react/charts/trend-lines.md index 0368af495..a0867ab43 100644 --- a/chart-sdk/react/charts/trend-lines.md +++ b/chart-sdk/react/charts/trend-lines.md @@ -1,7 +1,7 @@ --- layout: post -title: Trend lines in React Chart component | Syncfusion -description: Learn here all about Trend lines in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Trend lines in React Charts | Syncfusion +description: Learn how to add linear, exponential, logarithmic, power, moving average and polynomial trend lines to Syncfusion React Charts to highlight data direction. control: Trend lines platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Trend lines in React Chart component +# Trend lines in React Charts Trendlines help identify patterns, direction, and overall trends in numerical data. They project the general movement of data values and are widely used in analytics, forecasting, and financial charts. Trendlines can be added to Cartesian series types such as Line, Column, Scatter, Area, Candle, and Hilo (excluding bar series). Multiple trendlines can be added to a single series based on the analysis needs. diff --git a/chart-sdk/react/charts/understanding-chart.md b/chart-sdk/react/charts/understanding-chart.md index f218b8de7..c1909378a 100644 --- a/chart-sdk/react/charts/understanding-chart.md +++ b/chart-sdk/react/charts/understanding-chart.md @@ -1,14 +1,14 @@ --- layout: post -title: Understanding React Chart component | Syncfusion -description: Explore and understand the Syncfusion React Chart component in Essential JS 2 and discover its powerful features. +title: Understanding React Charts | Syncfusion +description: Learn the core building blocks of Syncfusion React Charts, including series, axes, legends, tooltips, and how they fit into a chart layout. platform: chart-sdk control: Understanding documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Understanding of React Chart +# Understanding React Charts The [React Charts](https://www.syncfusion.com/react-components/react-charts) component is a versatile visualization tool that presents data using a wide range of graphical formats. Each chart is composed of essential elements—such as the title, series, tooltip, legend, and axes—that work together to provide clear, interactive, and meaningful insights. Understanding these elements helps in configuring and customizing charts for various analytical needs. diff --git a/chart-sdk/react/charts/user-interaction.md b/chart-sdk/react/charts/user-interaction.md index d78ec7ff3..7b9440225 100644 --- a/chart-sdk/react/charts/user-interaction.md +++ b/chart-sdk/react/charts/user-interaction.md @@ -1,7 +1,7 @@ --- layout: post -title: User interaction in React Chart component | Syncfusion -description: Learn here all about User interaction in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: User interaction in React Charts | Syncfusion +description: Learn how Syncfusion React Charts respond to user interactions including tooltips, zooming, panning, crosshair, trackball, selection, and data editing. control: User interaction platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# User interaction in React Chart component +# User interaction in React Charts ## Tooltip diff --git a/chart-sdk/react/charts/working-with-data.md b/chart-sdk/react/charts/working-with-data.md index 11e66cb4e..7c745b144 100644 --- a/chart-sdk/react/charts/working-with-data.md +++ b/chart-sdk/react/charts/working-with-data.md @@ -1,7 +1,7 @@ --- layout: post -title: Working with data in React Chart component | Syncfusion -description: Learn here all about Working with data in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. +title: Working with data in React Charts | Syncfusion +description: Learn how to bind local, remote, and observable data sources to Syncfusion React Charts and map fields to series and axes. control: Working with data platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Working with data in React Chart component +# Working with data in React Charts The [React Charts](https://www.syncfusion.com/react-components/react-charts) component supports multiple data binding approaches to suit different application scenarios. Data can be bound from local JSON arrays, dynamically loaded on demand with lazy loading, or fetched from remote services using various adaptor patterns. This guide covers all available data binding methods, helping you choose the right approach for your use case based on data size, performance requirements, and backend architecture. diff --git a/chart-sdk/react/charts/zooming.md b/chart-sdk/react/charts/zooming.md index 8f89285a9..3d318d458 100644 --- a/chart-sdk/react/charts/zooming.md +++ b/chart-sdk/react/charts/zooming.md @@ -1,14 +1,14 @@ --- layout: post -title: Zooming in React Chart component | Syncfusion -description: Learn here all about Zooming in Syncfusion React Chart component of Syncfusion Essential JS 2 and more. -control: Zooming +title: Zooming in React Charts | Syncfusion +description: Learn how to enable mouse-wheel, pinch, selection, and toolbar zooming in Syncfusion React Charts, with options for pan and reset. +control: Zooming platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Zooming in React Chart component +# Zooming in React Charts To get start quickly with React Chart Zooming and Panning, you can check on this video: diff --git a/chart-sdk/react/circular-gauge/accessibility.md b/chart-sdk/react/circular-gauge/accessibility.md index 44866af5d..f76adfcd9 100644 --- a/chart-sdk/react/circular-gauge/accessibility.md +++ b/chart-sdk/react/circular-gauge/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Circular Gauge component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Circular Gauge component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Circular Gauge | Syncfusion +description: Learn how the React Circular Gauge meets WCAG 2.2, Section 508, ARIA, and screen reader support, with WAI-ARIA attribute details and compliance validation. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Circular Gauge component +# Accessibility in React Circular Gauge The Circular Gauge component follows commonly used accessibility guidelines and standards, such as [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles). diff --git a/chart-sdk/react/circular-gauge/ej1-api-migration.md b/chart-sdk/react/circular-gauge/ej1-api-migration.md index 571c5306d..41f120661 100644 --- a/chart-sdk/react/circular-gauge/ej1-api-migration.md +++ b/chart-sdk/react/circular-gauge/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Circular gauge component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. -control: Ej1 api migration +title: Migration from Essential JS 1 in React Circular Gauge | Syncfusion +description: Migrate the React Circular Gauge from Essential JS 1 to JS 2 with side-by-side property mapping for axes, ticks, labels, ranges, pointers, and other settings. +control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Circular gauge component +# Migration from Essential JS 1 in React Circular Gauge This article describes the API migration process of Accordion component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/circular-gauge/gauge-animation.md b/chart-sdk/react/circular-gauge/gauge-animation.md index 297e43768..0a8f1ee3a 100644 --- a/chart-sdk/react/circular-gauge/gauge-animation.md +++ b/chart-sdk/react/circular-gauge/gauge-animation.md @@ -1,14 +1,14 @@ --- layout: post -title: Animation in React Circular Gauge component | Syncfusion -description: Learn here all about animation in the Syncfusion React Circular Gauge component of Syncfusion Essential JS 2 and more. +title: Animation in React Circular Gauge | Syncfusion +description: Animate React Circular Gauge elements sequentially using the animationDuration property to render axis lines, ticks, labels, ranges, pointers, and annotations. control: Circular Gauge platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Animation in React Circular Gauge component +# Animation in React Circular Gauge All of the elements in the Circular Gauge, such as the axis lines, ticks, labels, ranges, pointers, and annotations, can be animated sequentially by using the [animationDuration](https://ej2.syncfusion.com/react/documentation/api/circular-gauge#animationduration) property. The animation for the Circular Gauge is enabled when the `animationDuration` property is set to an appropriate value in milliseconds, providing a smooth rendering effect for the component. If the `animationDuration` property is set to **0**, which is the default value, the animation effect is disabled. If the animation is enabled, the component will behave in the following order. diff --git a/chart-sdk/react/circular-gauge/gauge-annotations.md b/chart-sdk/react/circular-gauge/gauge-annotations.md index b4305593e..052e77d2d 100644 --- a/chart-sdk/react/circular-gauge/gauge-annotations.md +++ b/chart-sdk/react/circular-gauge/gauge-annotations.md @@ -1,14 +1,14 @@ --- layout: post -title: Gauge annotations in React Circular gauge component | Syncfusion -description: Learn here all about Gauge annotations in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Annotations in React Circular Gauge | Syncfusion +description: Mark specific areas in the React Circular Gauge with custom text, shapes, or images by adding the Annotations module and configuring annotation content. control: Gauge annotations platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge annotations in React Circular gauge component +# Annotations in React Circular Gauge Annotations are used to mark a specific area of interest in the gauge with texts, shapes or images. diff --git a/chart-sdk/react/circular-gauge/gauge-appearance.md b/chart-sdk/react/circular-gauge/gauge-appearance.md index e5c1ec850..38504dd8a 100644 --- a/chart-sdk/react/circular-gauge/gauge-appearance.md +++ b/chart-sdk/react/circular-gauge/gauge-appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Gauge appearance in React Circular gauge component | Syncfusion -description: Learn here all about Gauge appearance in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. -control: Gauge appearance +title: Appearance in React Circular Gauge | Syncfusion +description: Customize React Circular Gauge appearance with title text, position, background, margins, and other style properties to match your application design. +control: Gauge appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge appearance in React Circular gauge component +# Appearance in React Circular Gauge ## Gauge Title diff --git a/chart-sdk/react/circular-gauge/gauge-axes.md b/chart-sdk/react/circular-gauge/gauge-axes.md index 57edfcec0..819060944 100644 --- a/chart-sdk/react/circular-gauge/gauge-axes.md +++ b/chart-sdk/react/circular-gauge/gauge-axes.md @@ -1,14 +1,14 @@ --- layout: post -title: Gauge axes in React Circular gauge component | Syncfusion -description: Learn here all about Gauge axes in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Axes in React Circular Gauge | Syncfusion +description: Configure axes in the React Circular Gauge with lineStyle, background, major and minor ticks, labels, and multiple-axis support for richer visualizations. control: Gauge axes platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge axes in React Circular Gauge component +# Axes in React Circular Gauge By default, gauge will be displayed with an axis. Each axis contains its own ranges, pointers and annotation. diff --git a/chart-sdk/react/circular-gauge/gauge-dimensions.md b/chart-sdk/react/circular-gauge/gauge-dimensions.md index 1869dd4b2..b45b44589 100644 --- a/chart-sdk/react/circular-gauge/gauge-dimensions.md +++ b/chart-sdk/react/circular-gauge/gauge-dimensions.md @@ -1,7 +1,7 @@ --- layout: post -title: Gauge dimensions in React Circular gauge component | Syncfusion -description: Learn here all about Gauge dimensions in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Dimensions in React Circular Gauge | Syncfusion +description: Set the React Circular Gauge size via inline width and height, CSS, or container-based sizing for responsive layouts in pixels or percentages. control: Gauge dimensions platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge dimensions in React Circular gauge component +# Dimensions in React Circular Gauge ## Size for Container diff --git a/chart-sdk/react/circular-gauge/gauge-legend.md b/chart-sdk/react/circular-gauge/gauge-legend.md index 8cd43d04e..c5b5eee72 100644 --- a/chart-sdk/react/circular-gauge/gauge-legend.md +++ b/chart-sdk/react/circular-gauge/gauge-legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Gauge legend in React Circular gauge component | Syncfusion -description: Learn here all about Gauge legend in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Legend in React Circular Gauge | Syncfusion +description: Add and customize legends in the React Circular Gauge to identify range categories using position, alignment, shape, and other style options. control: Gauge legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge legend in React Circular gauge component +# Legend in React Circular Gauge Legend provides valuable information for interpreting what the circular gauge axis range displays, and they can be represented in various colors, shapes, and other identifiers based on the data. It gives a breakdown of what each symbol represents in the axis range of circular gauge. diff --git a/chart-sdk/react/circular-gauge/gauge-pointers.md b/chart-sdk/react/circular-gauge/gauge-pointers.md index 8067d5108..845404b7f 100644 --- a/chart-sdk/react/circular-gauge/gauge-pointers.md +++ b/chart-sdk/react/circular-gauge/gauge-pointers.md @@ -1,7 +1,7 @@ --- layout: post -title: Gauge pointers in React Circular gauge component | Syncfusion -description: Learn here all about Gauge pointers in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Pointers in React Circular Gauge | Syncfusion +description: Use Needle, RangeBar, and Marker pointers in the React Circular Gauge to indicate axis values, with multiple pointers, animation, and pointer drag support. control: Gauge pointers platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge pointers in React Circular gauge component +# Pointers in React Circular Gauge Pointers are used to indicate values on the axis. Value of the pointer can be modified using the [`value`](https://ej2.syncfusion.com/react/documentation/api/circular-gauge/pointer#value-number) property. diff --git a/chart-sdk/react/circular-gauge/gauge-print-and-export.md b/chart-sdk/react/circular-gauge/gauge-print-and-export.md index 25bc55add..ee71a2024 100644 --- a/chart-sdk/react/circular-gauge/gauge-print-and-export.md +++ b/chart-sdk/react/circular-gauge/gauge-print-and-export.md @@ -1,14 +1,14 @@ --- layout: post -title: Gauge print and export in React Circular gauge component | Syncfusion -description: Learn here all about Gauge print and export in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. -control: Gauge print and export +title: Print and Export in React Circular Gauge | Syncfusion +description: Print the React Circular Gauge or export it as image or PDF files using the Print and Export modules with allowPrint, allowImageExport, and allowPdfExport. +control: Gauge print and export platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge print and export in React Circular gauge component +# Print and Export in React Circular Gauge ## Print diff --git a/chart-sdk/react/circular-gauge/gauge-ranges.md b/chart-sdk/react/circular-gauge/gauge-ranges.md index 18332a029..29b621a04 100644 --- a/chart-sdk/react/circular-gauge/gauge-ranges.md +++ b/chart-sdk/react/circular-gauge/gauge-ranges.md @@ -1,7 +1,7 @@ --- layout: post -title: Gauge ranges in React Circular gauge component | Syncfusion -description: Learn here all about Gauge ranges in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: Ranges in React Circular Gauge | Syncfusion +description: Highlight value intervals on the React Circular Gauge axis using ranges with start, end, color, and other style properties for clearer data visualization. control: Gauge ranges platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge ranges in React Circular gauge component +# Ranges in React Circular Gauge You can categories certain interval on gauge axis using [`ranges`](https://ej2.syncfusion.com/react/documentation/api/circular-gauge/range#properties) property. diff --git a/chart-sdk/react/circular-gauge/gauge-user-interaction.md b/chart-sdk/react/circular-gauge/gauge-user-interaction.md index 22553ceeb..c3541d41e 100644 --- a/chart-sdk/react/circular-gauge/gauge-user-interaction.md +++ b/chart-sdk/react/circular-gauge/gauge-user-interaction.md @@ -1,7 +1,7 @@ --- layout: post -title: Gauge user interaction in React Circular gauge component | Syncfusion -description: Learn here all about Gauge user interaction in Syncfusion React Circular gauge component of Syncfusion Essential JS 2 and more. +title: User Interaction in React Circular Gauge | Syncfusion +description: Enable user interaction in the React Circular Gauge with tooltips for pointers and ranges, pointer drag support, and customizable tooltip templates and styles. control: Gauge user interaction platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Gauge user interaction in React Circular gauge component +# User Interaction in React Circular Gauge ## Tooltip for pointers diff --git a/chart-sdk/react/circular-gauge/getting-started.md b/chart-sdk/react/circular-gauge/getting-started.md index e4af1562d..4c1e8702d 100644 --- a/chart-sdk/react/circular-gauge/getting-started.md +++ b/chart-sdk/react/circular-gauge/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting Started with React Circular Gauge component | Syncfusion -description: Check out and learn about getting started with the React Circular Gauge component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Circular Gauge | Syncfusion +description: Learn how to get started with the Syncfusion React Circular Gauge control, including setup, dependencies, module registration, and a quick start sample. control: Getting Started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Circular Gauge component +# Getting Started with React Circular Gauge This section explains the steps required to create a simple React Circular Gauge component and demonstrate its basic usage in a React environment. diff --git a/chart-sdk/react/circular-gauge/internationalization.md b/chart-sdk/react/circular-gauge/internationalization.md index ee9873704..34a2f539e 100644 --- a/chart-sdk/react/circular-gauge/internationalization.md +++ b/chart-sdk/react/circular-gauge/internationalization.md @@ -1,14 +1,14 @@ --- layout: post -title: Internationalization in React Circular Gauge component | Syncfusion -description: Learn here all about Internationalization in Syncfusion React Circular Gauge component of Syncfusion Essential JS 2 and more. +title: Internationalization in React Circular Gauge | Syncfusion +description: Globalize the React Circular Gauge by localizing axis labels and tooltips with format strings, numeric and culture formatting, and per-locale number formats. control: Internationalization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Internationalization in React Circular Gauge component +# Internationalization in React Circular Gauge Circular Gauge provides internationalization support for below elements. diff --git a/chart-sdk/react/circular-gauge/nextjs-getting-started.md b/chart-sdk/react/circular-gauge/nextjs-getting-started.md index 6c7780bb8..d157c18f0 100644 --- a/chart-sdk/react/circular-gauge/nextjs-getting-started.md +++ b/chart-sdk/react/circular-gauge/nextjs-getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: React Circular gauge getting started with Next.js | Syncfusion -description: Check out and learn here all about about how to use the Syncfusion React UI components in the Next.js project. +title: Getting Started with Next.js and React Circular Gauge | Syncfusion +description: Set up a Next.js app and integrate the Syncfusion React Circular Gauge with a step-by-step guide on prerequisites, package install, and configuration. control: Next.js platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Creating a Next.js Application Using Syncfusion® React Components +# Getting Started with Next.js and React Circular Gauge This section provides a step-by-step guide for setting up a Next.js application and integrating the Syncfusion® React Circular Gauge component. diff --git a/chart-sdk/react/heatmap-charts/accessibility.md b/chart-sdk/react/heatmap-chart/accessibility.md similarity index 94% rename from chart-sdk/react/heatmap-charts/accessibility.md rename to chart-sdk/react/heatmap-chart/accessibility.md index 1913a5ea8..ca655a185 100644 --- a/chart-sdk/react/heatmap-charts/accessibility.md +++ b/chart-sdk/react/heatmap-chart/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React HeatMap component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React HeatMap component of Syncfusion Essential JS 2 and more. +title: Accessibility in React HeatMap Chart | Syncfusion +description: Use the React HeatMap Chart with WAI-ARIA roles, keyboard navigation, screen reader support, and WCAG 2.2, Section 508, and ADA compliance. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React HeatMap component +# Accessibility in React HeatMap Chart The HeatMap component follows commonly used accessibility guidelines and standards, such as [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles). diff --git a/chart-sdk/react/heatmap-charts/appearance.md b/chart-sdk/react/heatmap-chart/appearance.md similarity index 97% rename from chart-sdk/react/heatmap-charts/appearance.md rename to chart-sdk/react/heatmap-chart/appearance.md index ef1c10268..e27e172c1 100644 --- a/chart-sdk/react/heatmap-charts/appearance.md +++ b/chart-sdk/react/heatmap-chart/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React Heatmap chart component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Appearance in React HeatMap Chart | Syncfusion +description: Style React HeatMap Chart cells with cellSettings including border, radius, hover highlighting, and Table/Row/Column color gradient modes. control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Heatmap chart component +# Appearance in React HeatMap Chart ## Cell customization diff --git a/chart-sdk/react/heatmap-charts/axis.md b/chart-sdk/react/heatmap-chart/axis.md similarity index 98% rename from chart-sdk/react/heatmap-charts/axis.md rename to chart-sdk/react/heatmap-chart/axis.md index eeee88602..8314e6ebd 100644 --- a/chart-sdk/react/heatmap-charts/axis.md +++ b/chart-sdk/react/heatmap-chart/axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis in React HeatMap chart component | Syncfusion -description: Learn here all about axis in Syncfusion React HeatMap chart component of Syncfusion Essential JS 2 and more. -control: Axis +title: Axis in React HeatMap Chart | Syncfusion +description: Configure X and Y axes on the React HeatMap Chart as Category, Numeric, or DateTime, and invert or oppose them with valueType and label options. +control: Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis in React HeatMap chart component +# Axis in React HeatMap Chart HeatMap consists of two axes namely, X-axis and Y-axis that displays the row headers and column headers to plot the data points respectively. You can define the type, format, and other customizing options for both axes in the HeatMap. diff --git a/chart-sdk/react/heatmap-charts/bubble-heatmap.md b/chart-sdk/react/heatmap-chart/bubble-heatmap.md similarity index 97% rename from chart-sdk/react/heatmap-charts/bubble-heatmap.md rename to chart-sdk/react/heatmap-chart/bubble-heatmap.md index a5c3de8e2..106146f57 100644 --- a/chart-sdk/react/heatmap-charts/bubble-heatmap.md +++ b/chart-sdk/react/heatmap-chart/bubble-heatmap.md @@ -1,14 +1,14 @@ --- layout: post -title: Bubble heatmap in React Heatmap chart component | Syncfusion -description: Learn here all about Bubble heatmap in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Bubble HeatMap in React HeatMap Chart | Syncfusion +description: Render data points in the React HeatMap Chart as bubbles whose size, color, or sector encodes the value, by setting tileType to Bubble. control: Bubble heatmap platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bubble heatmap in React Heatmap chart component +# Bubble HeatMap in React HeatMap Chart Data points represent the data source values with **gradient** or **fixed** colors in the HeatMap. You can customize the appearance of these data points by changing the `color` and `size` attributes. diff --git a/chart-sdk/react/heatmap-charts/dimensions.md b/chart-sdk/react/heatmap-chart/dimensions.md similarity index 79% rename from chart-sdk/react/heatmap-charts/dimensions.md rename to chart-sdk/react/heatmap-chart/dimensions.md index be696683c..eb207b5c2 100644 --- a/chart-sdk/react/heatmap-charts/dimensions.md +++ b/chart-sdk/react/heatmap-chart/dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Dimensions in React Heatmap chart component | Syncfusion -description: Learn here all about Dimensions in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Dimensions in React HeatMap Chart | Syncfusion +description: Set the React HeatMap Chart size in pixels or as a percentage of its container using the width and height properties, or by sizing the container. control: Dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Dimensions in React Heatmap chart component +# Dimensions in React HeatMap Chart ## Size for container @@ -22,7 +22,7 @@ Heat map can be rendered to its container size. You can set the size through inl ## Size for heat map -You can set the size of heat map directly by using the [width](https://ej2.syncfusion.com/react/documentation/api/heatmap/#width) and [height](https://ej2.syncfusion.com/react/documentation/api/heatmap/#height) properties. +You can set the size of heat map directly by using the [width](https://ej2.syncfusion.com/react/documentation/api/heatmap#width) and [height](https://ej2.syncfusion.com/react/documentation/api/heatmap#height) properties. ## In pixel diff --git a/chart-sdk/react/heatmap-charts/ej1-api-migration.md b/chart-sdk/react/heatmap-chart/ej1-api-migration.md similarity index 97% rename from chart-sdk/react/heatmap-charts/ej1-api-migration.md rename to chart-sdk/react/heatmap-chart/ej1-api-migration.md index 981bcd530..64331495e 100644 --- a/chart-sdk/react/heatmap-charts/ej1-api-migration.md +++ b/chart-sdk/react/heatmap-chart/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Heatmap chart component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: EJ1 API Migration in React HeatMap Chart | Syncfusion +description: Migrate Syncfusion React HeatMap Chart properties and events from Essential JS 1 to Essential JS 2, including data, palette, and legend APIs. control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Heatmap chart component +# EJ1 API Migration in React HeatMap Chart This article describes the API migration process of heat map component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/heatmap-charts/events.md b/chart-sdk/react/heatmap-chart/events.md similarity index 96% rename from chart-sdk/react/heatmap-charts/events.md rename to chart-sdk/react/heatmap-chart/events.md index 4a1e01862..23688ffde 100644 --- a/chart-sdk/react/heatmap-charts/events.md +++ b/chart-sdk/react/heatmap-chart/events.md @@ -1,14 +1,14 @@ --- layout: post -title: Events in React HeatMap chart component | Syncfusion -description: Learn here all about Events in Syncfusion React HeatMap chart component of Syncfusion Essential JS 2 and more. +title: Events in React HeatMap Chart | Syncfusion +description: Handle React HeatMap Chart events such as cellClick, cellRender, cellSelected, and created to react to user interaction and cell lifecycle. control: Events platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Events in React HeatMap chart component +# Events in React HeatMap Chart This section describes the HeatMap chart event, which occurs when the required actions are performed. diff --git a/chart-sdk/react/heatmap-charts/getting-started.md b/chart-sdk/react/heatmap-chart/getting-started.md similarity index 96% rename from chart-sdk/react/heatmap-charts/getting-started.md rename to chart-sdk/react/heatmap-chart/getting-started.md index c818fd7cd..25caa4a06 100644 --- a/chart-sdk/react/heatmap-charts/getting-started.md +++ b/chart-sdk/react/heatmap-chart/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React HeatMap chart component | Syncfusion -description: Check out and learn about getting started with the React HeatMap chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React HeatMap Chart | Syncfusion +description: Learn how to get started with the Syncfusion React HeatMap Chart control. Explore setup, features, examples, and customization options. control: HeatMap platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React HeatMap chart component +# Getting Started with React HeatMap Chart This section explains the steps required to create a HeatMap and demonstrates the basic usage of the HeatMap component. diff --git a/chart-sdk/react/heatmap-charts/how-to/legend-customization.md b/chart-sdk/react/heatmap-chart/how-to/legend-customization.md similarity index 72% rename from chart-sdk/react/heatmap-charts/how-to/legend-customization.md rename to chart-sdk/react/heatmap-chart/how-to/legend-customization.md index d0d384854..da0c593f7 100644 --- a/chart-sdk/react/heatmap-charts/how-to/legend-customization.md +++ b/chart-sdk/react/heatmap-chart/how-to/legend-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend customization in React Heatmap chart component | Syncfusion -description: Learn here all about Legend customization in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Customize legend labels in React HeatMap Chart | Syncfusion +description: Customize or hide React HeatMap Chart legend labels at runtime by handling the legendRender client-side event with custom text and styles. control: Legend customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend customization in React Heatmap chart component +# How to customize legend labels in React HeatMap Chart You can change the legend label using the `legendRender` client-side event. You can also hide the legend label using this client-side event. diff --git a/chart-sdk/react/heatmap-charts/how-to/tool-tip-table.md b/chart-sdk/react/heatmap-chart/how-to/tool-tip-table.md similarity index 82% rename from chart-sdk/react/heatmap-charts/how-to/tool-tip-table.md rename to chart-sdk/react/heatmap-chart/how-to/tool-tip-table.md index 1ed9771e7..cb1a440dd 100644 --- a/chart-sdk/react/heatmap-charts/how-to/tool-tip-table.md +++ b/chart-sdk/react/heatmap-chart/how-to/tool-tip-table.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip table in React Heatmap chart component | Syncfusion -description: Learn here all about Tool tip table in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Create a table in tooltip in React HeatMap Chart | Syncfusion +description: Render the React HeatMap Chart tooltip as an HTML table by setting the template id in tooltipSettings to show multi-column cell data. control: Tool tip table platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip table in React Heatmap chart component +# How to create a table in tooltip in React HeatMap Chart You can show a tooltip as a table using the `template` property in `tooltipSettings`. diff --git a/chart-sdk/react/heatmap-charts/legend.md b/chart-sdk/react/heatmap-chart/legend.md similarity index 83% rename from chart-sdk/react/heatmap-charts/legend.md rename to chart-sdk/react/heatmap-chart/legend.md index 79f9251e4..ae03160b4 100644 --- a/chart-sdk/react/heatmap-charts/legend.md +++ b/chart-sdk/react/heatmap-chart/legend.md @@ -1,16 +1,16 @@ --- layout: post -title: Legend in React Heatmap chart component | Syncfusion -description: Learn here all about Legend in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Legend in React HeatMap Chart | Syncfusion +description: Show a gradient or list legend on the React HeatMap Chart to map colors to cell values, and configure position, alignment, and dimensions. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Heatmap chart component +# Legend in React HeatMap Chart -The legend is used to provide the information about the heat map cell. You can enable the legend by setting the [visible](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#visible) property to **true** and injecting the `Legend` module into the `services`. +The legend is used to provide the information about the heat map cell. You can enable the legend by setting the [visible](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#visible) property to **true** and injecting the `Legend` module into the `services`. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -30,7 +30,7 @@ Heat map supports two legend types: Gradient and list type. * Gradient - This is a continuous color legend with smooth color transition between palette color values. * List - List is a fixed color legend. Each palette color information is shown separately in the list item. -You can change the legend type by using the [type](https://ej2.syncfusion.com/react/documentation/api/heatmap/paletteSettings/#type) property in the `paletteSettings` property. +You can change the legend type by using the [type](https://ej2.syncfusion.com/react/documentation/api/heatmap/paletteSettings#type) property in the `paletteSettings` property. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -45,7 +45,7 @@ You can change the legend type by using the [type](https://ej2.syncfusion.com/re ## Placement -You can place the legend at left, right, top, or bottom to the heat map layout by using the [position](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#position) property. The legend is positioned at the right to the heat map by default. +You can place the legend at left, right, top, or bottom to the heat map layout by using the [position](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#position) property. The legend is positioned at the right to the heat map by default. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -60,7 +60,7 @@ You can place the legend at left, right, top, or bottom to the heat map layout b ## Alignment -You can align the legend as center, far, or near to the heat map using the [alignment](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#alignment) property. +You can align the legend as center, far, or near to the heat map using the [alignment](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#alignment) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -75,7 +75,7 @@ You can align the legend as center, far, or near to the heat map using the [alig ## Legend dimensions -You can change the legend dimensions with values in pixels or percentage by using the[width](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#width) and [height](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#height) properties. +You can change the legend dimensions with values in pixels or percentage by using the[width](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#width) and [height](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#height) properties. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -105,9 +105,9 @@ Paging is available only for the list type legend in the heat map, and it can be ## Smart Legend -Smart legend is another way of showing list type legend with responsiveness and readability, when the palette has more number of items. You can enable this smart legend by using the [enableSmartLegend](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#enablesmartlegend) property when the palette type is set to **Fixed**. +Smart legend is another way of showing list type legend with responsiveness and readability, when the palette has more number of items. You can enable this smart legend by using the [enableSmartLegend](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#enablesmartlegend) property when the palette type is set to **Fixed**. -In smart legend, you can change the display type of legend labels by using the [labelDisplayType](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#labeldisplaytype) property. +In smart legend, you can change the display type of legend labels by using the [labelDisplayType](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#labeldisplaytype) property. The following are the legend label display types: * All: Displays all labels in the legend. @@ -127,7 +127,7 @@ The following are the legend label display types: ## Legend Selection -In the HeatMap, the legend selection is used to toggle the visibility of cell for viewing the specific range value. You can enable the legend selection using the [toggleVisibility](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#togglevisibility) property. +In the HeatMap, the legend selection is used to toggle the visibility of cell for viewing the specific range value. You can enable the legend selection using the [toggleVisibility](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#togglevisibility) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -142,7 +142,7 @@ In the HeatMap, the legend selection is used to toggle the visibility of cell fo ## Legend Title -The legend title displays a specific information about the legend. You can enable the legend title by setting the [title](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/#title) property by providing the text and customizing the legend title text style using the [textStyle](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/titleModel/#textStyle) property. +The legend title displays a specific information about the legend. You can enable the legend title by setting the [title](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings#title) property by providing the text and customizing the legend title text style using the [textStyle](https://ej2.syncfusion.com/react/documentation/api/heatmap/legendSettings/titleModel#textStyle) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/heatmap-charts/palette.md b/chart-sdk/react/heatmap-chart/palette.md similarity index 95% rename from chart-sdk/react/heatmap-charts/palette.md rename to chart-sdk/react/heatmap-chart/palette.md index 27c2da1af..0b71d54d5 100644 --- a/chart-sdk/react/heatmap-charts/palette.md +++ b/chart-sdk/react/heatmap-chart/palette.md @@ -1,14 +1,14 @@ --- layout: post -title: Palette in React Heatmap chart component | Syncfusion -description: Learn here all about Palette in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Palette in React HeatMap Chart | Syncfusion +description: Define gradient or fixed color palettes for React HeatMap Chart cells using paletteSettings, with color stops, value ranges, and colorValuePath mapping. control: Palette platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Palette in React Heatmap chart component +# Palette in React HeatMap Chart In heat map, each data point is displayed as a cell with applied color based on the data value. The palette in the heat map is used to define the color range for cells and gradient type for colors. You can define the colors either in RGB or hex codes using the [color](https://ej2.syncfusion.com/react/documentation/api/heatmap/paletteCollection#color) property in the `palette`. The defined colors are applied to the cell background based on the palette type and cell value. diff --git a/chart-sdk/react/heatmap-charts/rendering-mode.md b/chart-sdk/react/heatmap-chart/rendering-mode.md similarity index 76% rename from chart-sdk/react/heatmap-charts/rendering-mode.md rename to chart-sdk/react/heatmap-chart/rendering-mode.md index f9a17d4a1..f049d71b3 100644 --- a/chart-sdk/react/heatmap-charts/rendering-mode.md +++ b/chart-sdk/react/heatmap-chart/rendering-mode.md @@ -1,16 +1,16 @@ --- layout: post -title: Rendering mode in React Heatmap chart component | Syncfusion -description: Learn here all about Rendering mode in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Rendering Mode in React HeatMap Chart | Syncfusion +description: Switch the React HeatMap Chart between SVG and Canvas rendering, or set renderingMode to Auto to pick based on data point count for performance. control: Rendering mode platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Rendering mode in React Heatmap chart component +# Rendering Mode in React HeatMap Chart -Heat map can be displayed using **Canvas** or **Scalable Vector Graphics (SVG)** rendering logic to improve the initial load performance and scalability. Heat map can also be automatically switched between **Canvas** and **SVG** modes based on dataset size. You can enable this mode by setting the [renderingMode](https://ej2.syncfusion.com/react/documentation/api/heatmap/#renderingmode) property to **Auto**. +Heat map can be displayed using **Canvas** or **Scalable Vector Graphics (SVG)** rendering logic to improve the initial load performance and scalability. Heat map can also be automatically switched between **Canvas** and **SVG** modes based on dataset size. You can enable this mode by setting the [renderingMode](https://ej2.syncfusion.com/react/documentation/api/heatmap#renderingmode) property to **Auto**. > If the **Auto** mode is enabled in the heat map and there are more than 10,000 data points, then the heat map will be rendered in a **Canvas** mode; Otherwise, the heat map will be rendered in a **SVG** mode. diff --git a/chart-sdk/react/heatmap-charts/selection.md b/chart-sdk/react/heatmap-chart/selection.md similarity index 93% rename from chart-sdk/react/heatmap-charts/selection.md rename to chart-sdk/react/heatmap-chart/selection.md index b871c8250..1c39ce1a5 100644 --- a/chart-sdk/react/heatmap-charts/selection.md +++ b/chart-sdk/react/heatmap-chart/selection.md @@ -1,14 +1,14 @@ --- layout: post -title: Selection in React HeatMap chart component | Syncfusion -description: Learn here all about Selection in Syncfusion React HeatMap chart component of Syncfusion Essential JS 2 and more. +title: Selection in React HeatMap Chart | Syncfusion +description: Select one or more cells in the React HeatMap Chart with mouse, touch, or Ctrl+click, and toggle single or multi selection using enableMultiSelect. control: Selection platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Selection in React HeatMap chart component +# Selection in React HeatMap Chart In the HeatMap, the cell selection is used to select single or multiple HeatMap cells at runtime and get the selected cell details using the [cellSelected](https://ej2.syncfusion.com/react/documentation/api/heatmap#cellselected) event. You can enable the cell selection using the [allowSelection](https://ej2.syncfusion.com/react/documentation/api/heatmap#allowselection) property. diff --git a/chart-sdk/react/heatmap-charts/title.md b/chart-sdk/react/heatmap-chart/title.md similarity index 79% rename from chart-sdk/react/heatmap-charts/title.md rename to chart-sdk/react/heatmap-chart/title.md index a59dbe561..b3bdaba35 100644 --- a/chart-sdk/react/heatmap-charts/title.md +++ b/chart-sdk/react/heatmap-chart/title.md @@ -1,14 +1,14 @@ --- layout: post -title: Title in React Heatmap chart component | Syncfusion -description: Learn here all about Title in Syncfusion Angular Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Title in React HeatMap Chart | Syncfusion +description: Add a title to the React HeatMap Chart via titleSettings to give quick context about the plotted data and style text with textStyle. control: Title platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title in React Heatmap chart component +# Title in React HeatMap Chart ## Add Heatmap title diff --git a/chart-sdk/react/heatmap-charts/tooltip.md b/chart-sdk/react/heatmap-chart/tooltip.md similarity index 91% rename from chart-sdk/react/heatmap-charts/tooltip.md rename to chart-sdk/react/heatmap-chart/tooltip.md index 60da1a301..847548569 100644 --- a/chart-sdk/react/heatmap-charts/tooltip.md +++ b/chart-sdk/react/heatmap-chart/tooltip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React Heatmap chart component | Syncfusion -description: Learn here all about Tooltip in Syncfusion React Heatmap chart component of Syncfusion Essential JS 2 and more. +title: Tooltip in React HeatMap Chart | Syncfusion +description: Show tooltips on the React HeatMap Chart by enabling showTooltip, customize content with tooltipRender, and style via fill, border, and textStyle. control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React Heatmap chart component +# Tooltip in React HeatMap Chart Tooltip is used to provide the details of the heatmap cell, and this can be displayed, while hovering the cursor over the cell or performing tap action in touch devices. diff --git a/chart-sdk/react/heatmap-charts/working-with-data.md b/chart-sdk/react/heatmap-chart/working-with-data.md similarity index 96% rename from chart-sdk/react/heatmap-charts/working-with-data.md rename to chart-sdk/react/heatmap-chart/working-with-data.md index 7d6f49d72..f908b3708 100644 --- a/chart-sdk/react/heatmap-charts/working-with-data.md +++ b/chart-sdk/react/heatmap-chart/working-with-data.md @@ -1,14 +1,14 @@ --- layout: post -title: Working with data in React HeatMap chart component | Syncfusion -description: Learn here all about Working with data in Syncfusion React HeatMap chart component of Syncfusion Essential JS 2 and more. +title: Working With Data in React HeatMap Chart | Syncfusion +description: Bind data to the React HeatMap Chart from JSON objects or two-dimensional arrays using Table or Cell adaptor types, and handle empty points. control: Working with data platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Working with data in React HeatMap chart component +# Working With Data in React HeatMap Chart Heat map visualizes the JSON data and two-dimensional array data. Using the data adaptor support, data can be bound to the heat map. diff --git a/chart-sdk/react/linear-gauge/accessibility.md b/chart-sdk/react/linear-gauge/accessibility.md index b6d1b14e0..e71fb676a 100644 --- a/chart-sdk/react/linear-gauge/accessibility.md +++ b/chart-sdk/react/linear-gauge/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Linear Gauge component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Linear Gauge component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Linear Gauge | Syncfusion +description: Build accessible React Linear Gauge apps using WAI-ARIA attributes, screen reader support, and WCAG 2.2 compliance with axe-core validation. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Linear Gauge component +# Accessibility in React Linear Gauge The Linear Gauge component follows commonly used accessibility guidelines and standards, such as [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles). diff --git a/chart-sdk/react/linear-gauge/animation.md b/chart-sdk/react/linear-gauge/animation.md index 46f9bfdfb..adf537b5f 100644 --- a/chart-sdk/react/linear-gauge/animation.md +++ b/chart-sdk/react/linear-gauge/animation.md @@ -1,14 +1,14 @@ --- layout: post -title: Animation in React Linear Gauge component | Syncfusion -description: Learn here all about animation in the Syncfusion React Linear Gauge component of Syncfusion Essential JS 2 and more. -control: Linear Gauge +title: Animation in React Linear Gauge | Syncfusion +description: Animate the React Linear Gauge elements sequentially, including axis, ticks, labels, ranges, pointers, and annotations, using animationDuration. +control: Linear Gauge platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Animation in React Linear Gauge component +# Animation in React Linear Gauge All of the elements in the Linear Gauge, such as the axis lines, ticks, labels, ranges, pointers, and annotations, can be animated sequentially by using the [animationDuration](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#animationduration) property. The animation for the Linear Gauge is enabled when the `animationDuration` property is set to an appropriate value in milliseconds, providing a smooth rendering effect for the component. If the `animationDuration` property is set to **0**, which is the default value, the animation effect is disabled. If the animation is enabled, the component will behave in the following order. diff --git a/chart-sdk/react/linear-gauge/annotations.md b/chart-sdk/react/linear-gauge/annotations.md index f7f9a1c94..1cfac3006 100644 --- a/chart-sdk/react/linear-gauge/annotations.md +++ b/chart-sdk/react/linear-gauge/annotations.md @@ -1,14 +1,14 @@ --- layout: post -title: Annotations in React Linear gauge component | Syncfusion -description: Learn here all about Annotations in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Annotations in React Linear Gauge | Syncfusion +description: Add text, image, or custom HTML annotations to mark areas of interest on the React Linear Gauge with precise pixel or axis-based positioning. control: Annotations platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Annotations in React Linear gauge component +# Annotations in React Linear Gauge @@ -16,7 +16,7 @@ Annotations are used to mark the specific area of interest in the Linear Gauge w ## Adding annotation -To render the custom HTML elements in the Linear Gauge component, use the [`content`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#content) property in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation). The annotation can be rendered either by specifying the id of the element or specifying the code to create a new element that needs to be displayed in the gauge area. +To render the custom HTML elements in the Linear Gauge component, use the [`content`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#content) property in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gaugeannotation). The annotation can be rendered either by specifying the id of the element or specifying the code to create a new element that needs to be displayed in the gauge area. @@ -54,16 +54,16 @@ root.render(); The following properties are used to customize the annotation. -* [`zIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#zindex) - Bring the annotation to the front or back, when annotation overlaps with another element. -* [`axisValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#axisvalue) - To place the annotation in the specified axis value with respect to the provided axis index. -* [`axisIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#axisindex) - To place the annotation in the specified axis with respect to the provided axis value. -* [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#horizontalalignment) - To place the annotation horizontally. -* [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#verticalalignment) - To place the annotation vertically. -* [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#x-number), [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#y-number) - To place the annotation in the specified location. +* [`zIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#zindex) - Bring the annotation to the front or back, when annotation overlaps with another element. +* [`axisValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#axisvalue) - To place the annotation in the specified axis value with respect to the provided axis index. +* [`axisIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#axisindex) - To place the annotation in the specified axis with respect to the provided axis value. +* [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#horizontalalignment) - To place the annotation horizontally. +* [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#verticalalignment) - To place the annotation vertically. +* [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#x-number), [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#y-number) - To place the annotation in the specified location. ### Changing the z-index -To change the stack order of an annotation element, the [`zIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#zindex) property of the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/) can be used. +To change the stack order of an annotation element, the [`zIndex`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#zindex) property of the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation) can be used. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -78,7 +78,7 @@ To change the stack order of an annotation element, the [`zIndex`](https://ej2. ### Positioning an annotation -The annotation can be placed anywhere in the Linear Gauge by setting the pixel value to the [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#x) and [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#y) properties in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/). +The annotation can be placed anywhere in the Linear Gauge by setting the pixel value to the [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#x) and [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#y) properties in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -95,7 +95,7 @@ The annotation can be placed anywhere in the Linear Gauge by setting the pixel v ### Alignment of annotation -The annotation can be aligned horizontally and vertically by using the [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#horizontalalignment) and [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#verticalalignment) properties respectively. The possible values can be **Center**, **Far**, **Near**, and **None**. The [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#horizontalalignment) and [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#verticalalignment) properties are not applicable when the [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#x) and [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/#y) properties are set in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/). +The annotation can be aligned horizontally and vertically by using the [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#horizontalalignment) and [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#verticalalignment) properties respectively. The possible values can be **Center**, **Far**, **Near**, and **None**. The [`horizontalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#horizontalalignment) and [`verticalAlignment`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#verticalalignment) properties are not applicable when the [`x`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#x) and [`y`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation#y) properties are set in the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -110,7 +110,7 @@ The annotation can be aligned horizontally and vertically by using the [`horizon ## Multiple annotations -Multiple annotations can be added to the Linear Gauge component by adding the multiple [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/) in the [`AnnotationsDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#annotations) and customization for the annotation can be done with the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation/). +Multiple annotations can be added to the Linear Gauge component by adding the multiple [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation) in the [`AnnotationsDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#annotations) and customization for the annotation can be done with the [`AnnotationDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/annotation). {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/linear-gauge/appearance.md b/chart-sdk/react/linear-gauge/appearance.md index e22a0908d..6f869ab70 100644 --- a/chart-sdk/react/linear-gauge/appearance.md +++ b/chart-sdk/react/linear-gauge/appearance.md @@ -1,24 +1,24 @@ --- layout: post -title: Appearance in React Linear gauge component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Appearance in React Linear Gauge | Syncfusion +description: Style the React Linear Gauge area, title, and container with Normal, Rounded Rectangle, or Thermometer shapes, plus background, border, and margin options. control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Linear gauge component +# Appearance in React Linear Gauge ## Customizing the Linear Gauge area -The following properties are available in the [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/) to customize the Linear Gauge area. +The following properties are available in the [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge) to customize the Linear Gauge area. -* [`background`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#background) - Applies the background color for the Linear Gauge. -* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#border) - To customize the color and width of the border in Linear Gauge. -* [`margin`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#margin) - To customize the margins of the Linear Gauge. +* [`background`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#background) - Applies the background color for the Linear Gauge. +* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#border) - To customize the color and width of the border in Linear Gauge. +* [`margin`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#margin) - To customize the margins of the Linear Gauge. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -33,14 +33,14 @@ The following properties are available in the [`LinearGaugeComponent`](https://e ## Setting up the Linear Gauge title -The title for the Linear Gauge can be set using [`title`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#title) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/). Its appearance can be customized using the [`titleStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#titlestyle) with the below properties. +The title for the Linear Gauge can be set using [`title`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#title) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge). Its appearance can be customized using the [`titleStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#titlestyle) with the below properties. -* [`color`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#color) - Specifies the text color of the title. -* [`fontStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#fontStyle) - Specifies the font style of the title. -* [`fontWeight`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#fontweight) - Specifies the font weight of the title. -* [`size`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#size) - Specifies the font size of the title. -* [`opacity`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#opacity) - Specifies the opacity of the title. -* [`fontFamily`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel/#fontfamily) - Specifies the font family of the title. +* [`color`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#color) - Specifies the text color of the title. +* [`fontStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#fontStyle) - Specifies the font style of the title. +* [`fontWeight`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#fontweight) - Specifies the font weight of the title. +* [`size`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#size) - Specifies the font size of the title. +* [`opacity`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#opacity) - Specifies the opacity of the title. +* [`fontFamily`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/fontModel#fontfamily) - Specifies the font family of the title. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -61,13 +61,13 @@ The area used to render the ranges and pointers at the center position of the ga * Rounded Rectangle * Thermometer - The type of the container can be modified by using the [`type`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/#type) property in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/). The container can be customized by using the following properties in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/). + The type of the container can be modified by using the [`type`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel#type) property in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel). The container can be customized by using the following properties in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel). -* [`offset`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/#offset) - To place the container with the specified distance from the axis of the Linear Gauge. -* [`width`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/#width) - To set the thickness of the container. -* [`height`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/#height) - To set the length of the container. -* [`backgroundColor`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/#backgroundcolor) - To set the background color of the container. -* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/container/#border) - To set the color and width for the border of the container. +* [`offset`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel#offset) - To place the container with the specified distance from the axis of the Linear Gauge. +* [`width`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel#width) - To set the thickness of the container. +* [`height`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel#height) - To set the length of the container. +* [`backgroundColor`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel#backgroundcolor) - To set the background color of the container. +* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/container#border) - To set the color and width for the border of the container. ### Normal @@ -86,7 +86,7 @@ The **Normal** type will render the container as a rectangle and this is the def ### Rounded Rectangle -The **RoundedRectangle** type will render the container as a rectangle with rounded corner radius. The rounded corner radius of the container can be customized using the [`roundedCornerRadius`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/container/#roundedcornerradius) property in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel/). +The **RoundedRectangle** type will render the container as a rectangle with rounded corner radius. The rounded corner radius of the container can be customized using the [`roundedCornerRadius`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/container#roundedcornerradius) property in [`container`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/containerModel). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -116,7 +116,7 @@ The **Thermometer** type will render the container similar to the appearance of ## Fitting the Linear Gauge to the control -The Linear Gauge component is rendered with margin by default. To remove the margin around the Linear Gauge, the [`allowMargin`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#allowmargin) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/) is set as **false**. +The Linear Gauge component is rendered with margin by default. To remove the margin around the Linear Gauge, the [`allowMargin`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#allowmargin) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge) is set as **false**. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/linear-gauge/axis.md b/chart-sdk/react/linear-gauge/axis.md index fceba1eba..3468230d4 100644 --- a/chart-sdk/react/linear-gauge/axis.md +++ b/chart-sdk/react/linear-gauge/axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis in React Linear gauge component | Syncfusion -description: Learn here all about Axis in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Axis in React Linear Gauge | Syncfusion +description: Customize the React Linear Gauge axis with formatted labels, major and minor ticks, range start and end values, and label positioning. control: Axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis in React Linear gauge component +# Axis in React Linear Gauge diff --git a/chart-sdk/react/linear-gauge/dimensions.md b/chart-sdk/react/linear-gauge/dimensions.md index 5517d30aa..0d038c5c2 100644 --- a/chart-sdk/react/linear-gauge/dimensions.md +++ b/chart-sdk/react/linear-gauge/dimensions.md @@ -1,20 +1,20 @@ --- layout: post -title: Dimensions in React Linear gauge component | Syncfusion -description: Learn here all about Dimensions in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Dimensions in React Linear Gauge | Syncfusion +description: Set the React Linear Gauge width and height in pixels or as a percentage of its parent container to create a responsive, fluid layout. control: Dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Dimensions in React Linear gauge component +# Dimensions in React Linear Gauge ## Size for Linear Gauge -The height and width of the Linear Gauge can be set using the [`width`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#width) and [`height`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#height) properties in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/). +The height and width of the Linear Gauge can be set using the [`width`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#width) and [`height`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#height) properties in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge). diff --git a/chart-sdk/react/linear-gauge/ej1-api-migration.md b/chart-sdk/react/linear-gauge/ej1-api-migration.md index c400264eb..0a81a5394 100644 --- a/chart-sdk/react/linear-gauge/ej1-api-migration.md +++ b/chart-sdk/react/linear-gauge/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Linear gauge component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Migration from Essential JS 1 in React Linear Gauge | Syncfusion +description: Migrate your React Linear Gauge code from the legacy v1 API to v2 with a side-by-side mapping of dimensions, axis, ranges, pointers, and more. control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Linear gauge component +# Migration from Essential JS 1 in React Linear Gauge This article describes the API migration process of Accordion component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/linear-gauge/events.md b/chart-sdk/react/linear-gauge/events.md index d017d3132..87730ec93 100644 --- a/chart-sdk/react/linear-gauge/events.md +++ b/chart-sdk/react/linear-gauge/events.md @@ -1,20 +1,20 @@ --- layout: post -title: Events in React Linear gauge component | Syncfusion -description: Learn here all about Events in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Events in React Linear Gauge | Syncfusion +description: Handle React Linear Gauge events for pointer animation, annotation rendering, axis labels, drag actions, mouse interactions, and component load lifecycle. control: Events platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Events in React Linear gauge component +# Events in React Linear Gauge This section describes the Linear Gauge component's event that gets triggered when corresponding operations are performed. ## animationComplete -When the pointer animation is completed, the [`animationComplete`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#animationcomplete) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAnimationCompleteEventArgs/). +When the pointer animation is completed, the [`animationComplete`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#animationcomplete) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAnimationCompleteEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -29,7 +29,7 @@ When the pointer animation is completed, the [`animationComplete`](https://ej2.s ## annotationRender -Before the annotation is rendered in the Linear Gauge, the [`annotationRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#annotationrender) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAnnotationRenderEventArgs/). +Before the annotation is rendered in the Linear Gauge, the [`annotationRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#annotationrender) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAnnotationRenderEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -44,7 +44,7 @@ Before the annotation is rendered in the Linear Gauge, the [`annotationRender`]( ## axisLabelRender -Before each axis label is rendered in the Linear Gauge, the [`axisLabelRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#axislabelrender) event is fired. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAxisLabelRenderEventArgs/). +Before each axis label is rendered in the Linear Gauge, the [`axisLabelRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#axislabelrender) event is fired. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iAxisLabelRenderEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -59,7 +59,7 @@ Before each axis label is rendered in the Linear Gauge, the [`axisLabelRender`]( ## beforePrint -The [`beforePrint`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#beforeprint) event is fired before the print begins. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPrintEventArgs/). +The [`beforePrint`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#beforeprint) event is fired before the print begins. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPrintEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -74,7 +74,7 @@ The [`beforePrint`](https://ej2.syncfusion.com/react/documentation/api/linear-ga ## dragEnd -The [`dragEnd`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#dragend) event will be fired before the pointer drag is completed. To know more about the argument of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs/). +The [`dragEnd`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#dragend) event will be fired before the pointer drag is completed. To know more about the argument of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -89,7 +89,7 @@ The [`dragEnd`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/ ## dragMove -The [`dragMove`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#dragmove) event will be fired when the pointer is dragged. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs/). +The [`dragMove`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#dragmove) event will be fired when the pointer is dragged. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -104,7 +104,7 @@ The [`dragMove`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge ## dragStart -When the pointer drag begins, the [`dragStart`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#dragstart) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs/). +When the pointer drag begins, the [`dragStart`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#dragstart) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iPointerDragEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -119,7 +119,7 @@ When the pointer drag begins, the [`dragStart`](https://ej2.syncfusion.com/react ## gaugeMouseDown -When mouse is pressed down on the gauge, the [`gaugeMouseDown`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#gaugemousedown) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs/). +When mouse is pressed down on the gauge, the [`gaugeMouseDown`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#gaugemousedown) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -134,7 +134,7 @@ When mouse is pressed down on the gauge, the [`gaugeMouseDown`](https://ej2.sync ## gaugeMouseLeave -When mouse pointer moves over the gauge, the [`gaugemouseleave`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#gaugemouseleave) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs/). +When mouse pointer moves over the gauge, the [`gaugemouseleave`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#gaugemouseleave) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -149,7 +149,7 @@ When mouse pointer moves over the gauge, the [`gaugemouseleave`](https://ej2.syn ## gaugeMouseMove -When mouse pointer leaves the gauge, the [`gaugeMouseMove`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#gaugemousemove) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs/). +When mouse pointer leaves the gauge, the [`gaugeMouseMove`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#gaugemousemove) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -164,7 +164,7 @@ When mouse pointer leaves the gauge, the [`gaugeMouseMove`](https://ej2.syncfusi ## gaugeMouseUp -When the mouse pointer is released over the Linear Gauge, the [`gaugeMouseUp`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#gaugemouseup) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs/). +When the mouse pointer is released over the Linear Gauge, the [`gaugeMouseUp`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#gaugemouseup) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iMouseEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -179,7 +179,7 @@ When the mouse pointer is released over the Linear Gauge, the [`gaugeMouseUp`](h ## load -Before the Linear Gauge is loaded, the [`load`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#load) event is fired. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iLoadEventArgs/). +Before the Linear Gauge is loaded, the [`load`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#load) event is fired. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iLoadEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -194,7 +194,7 @@ Before the Linear Gauge is loaded, the [`load`](https://ej2.syncfusion.com/react ## loaded -After the Linear Gauge has been loaded, the [`loaded`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#loaded) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iLoadedEventArgs/). +After the Linear Gauge has been loaded, the [`loaded`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#loaded) event will be triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iLoadedEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -209,7 +209,7 @@ After the Linear Gauge has been loaded, the [`loaded`](https://ej2.syncfusion.co ## resized -After the window resizing, the [`resized`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#resized) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iResizeEventArgs/). +After the window resizing, the [`resized`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#resized) event is triggered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iResizeEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -224,7 +224,7 @@ After the window resizing, the [`resized`](https://ej2.syncfusion.com/react/docu ## tooltipRender -The [`tooltipRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#tooltiprender) event is fired before the tooltip is rendered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iTooltipRenderEventArgs/). +The [`tooltipRender`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#tooltiprender) event is fired before the tooltip is rendered. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iTooltipRenderEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -239,7 +239,7 @@ The [`tooltipRender`](https://ej2.syncfusion.com/react/documentation/api/linear- ## valueChange -The [`valueChange`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#valuechange) event is triggered when the pointer is dragged from one value to another. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iValueChangeEventArgs/). +The [`valueChange`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#valuechange) event is triggered when the pointer is dragged from one value to another. To know more about the arguments of this event, refer [here](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/iValueChangeEventArgs). {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/linear-gauge/getting-started.md b/chart-sdk/react/linear-gauge/getting-started.md index b5ce4a168..ed156760b 100644 --- a/chart-sdk/react/linear-gauge/getting-started.md +++ b/chart-sdk/react/linear-gauge/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting started with React Linear Gauge component | Syncfusion -description: Check out and learn about Getting started with React Linear Gauge component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Linear Gauge | Syncfusion +description: Learn how to get started with the Syncfusion React Linear Gauge control. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug diff --git a/chart-sdk/react/linear-gauge/internationalization.md b/chart-sdk/react/linear-gauge/internationalization.md index fec992487..0c681c837 100644 --- a/chart-sdk/react/linear-gauge/internationalization.md +++ b/chart-sdk/react/linear-gauge/internationalization.md @@ -1,21 +1,21 @@ --- layout: post -title: Internationalization in React Linear gauge component | Syncfusion -description: Learn here all about Internationalization in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Internationalization in React Linear Gauge | Syncfusion +description: Format React Linear Gauge axis labels and tooltips for any culture using currency, percentage, or other numeric formats via the format property. control: Internationalization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Internationalization in React Linear gauge component +# Internationalization in React Linear Gauge -Globalization is the process of designing and developing a component that works in different cultures. Internationalization is used to globalize the number content in Linear Gauge component using [`format`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/label/#format) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/linearGaugeModel/). It has static text on some features such as +Globalization is the process of designing and developing a component that works in different cultures. Internationalization is used to globalize the number content in Linear Gauge component using [`format`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/label#format) property in [`LinearGaugeComponent`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/linearGaugeModel). It has static text on some features such as * Axis label * Tooltip -The static text on above features can be changed to any culture such as Arabic, Deutsch and French. To know more about the globalization in React components, refer [here](https://ej2.syncfusion.com/react/documentation/common/internationalization/). +The static text on above features can be changed to any culture such as Arabic, Deutsch and French. To know more about the globalization in React components, refer [here](https://ej2.syncfusion.com/react/documentation/common/globalization/internationalization). ## Numeric Format diff --git a/chart-sdk/react/linear-gauge/methods.md b/chart-sdk/react/linear-gauge/methods.md index 99a6efae3..3e2a2381e 100644 --- a/chart-sdk/react/linear-gauge/methods.md +++ b/chart-sdk/react/linear-gauge/methods.md @@ -1,19 +1,19 @@ --- layout: post -title: Methods in React Linear gauge component | Syncfusion -description: Learn here all about Methods in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Methods in React Linear Gauge | Syncfusion +description: Update the React Linear Gauge dynamically using setPointerValue, setAnnotationValue, and refresh methods to change state and re-render the component. control: Methods platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Methods in React Linear gauge component +# Methods in React Linear Gauge The following methods are available in the Linear Gauge component. ## setPointerValue -To change the pointer value dynamically, use the [`setPointerValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#setpointervalue) method in the Linear Gauge component. The following are the arguments for this method. +To change the pointer value dynamically, use the [`setPointerValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#setpointervalue) method in the Linear Gauge component. The following are the arguments for this method. | Argument name | Description | |----------------------| -----------------------------------------| @@ -34,7 +34,7 @@ To change the pointer value dynamically, use the [`setPointerValue`](https://ej2 ## setAnnotationValue -To change the annotation content dynamically, use the [`setAnnotationValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#setannotationvalue) method in the Linear Gauge component. The following are the arguments for this method. +To change the annotation content dynamically, use the [`setAnnotationValue`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#setannotationvalue) method in the Linear Gauge component. The following are the arguments for this method. | Argument name | Description | |----------------------| -----------------------------------------| diff --git a/chart-sdk/react/linear-gauge/pointers.md b/chart-sdk/react/linear-gauge/pointers.md index 003aaf39a..cb8b0b5cf 100644 --- a/chart-sdk/react/linear-gauge/pointers.md +++ b/chart-sdk/react/linear-gauge/pointers.md @@ -1,14 +1,14 @@ --- layout: post -title: Pointers in React Linear Gauge Component | Syncfusion -description: Learn here all about pointers in Syncfusion Essential React Linear Gauge component, its elements and more. +title: Pointers in React Linear Gauge | Syncfusion +description: Add marker or bar pointers to the React Linear Gauge to track axis values, with multiple pointers, animation, and gradient support. control: Pointers platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Pointers in React Linear Gauge Component +# Pointers in React Linear Gauge ## Setting the Pointer Value diff --git a/chart-sdk/react/linear-gauge/print-and-export.md b/chart-sdk/react/linear-gauge/print-and-export.md index 3fd12b4f0..7d07f01c3 100644 --- a/chart-sdk/react/linear-gauge/print-and-export.md +++ b/chart-sdk/react/linear-gauge/print-and-export.md @@ -1,18 +1,18 @@ --- layout: post -title: Print and export in React Linear gauge component | Syncfusion -description: Learn here all about Print and export in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Print and Export in React Linear Gauge | Syncfusion +description: Print the React Linear Gauge directly or export it as JPEG, PNG, SVG, or PDF images, including base64 string output for image and PDF formats. control: Print and export platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and export in React Linear gauge component +# Print and Export in React Linear Gauge ## Print -The rendered Linear Gauge can be printed directly from the browser by calling the [`print`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#print) method. To use the print functionality, set the [`allowPrint`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#allowprint) property as **true** and inject the **Print** module into **services**. +The rendered Linear Gauge can be printed directly from the browser by calling the [`print`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#print) method. To use the print functionality, set the [`allowPrint`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#allowprint) property as **true** and inject the **Print** module into **services**. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -29,7 +29,7 @@ The rendered Linear Gauge can be printed directly from the browser by calling th ### Image Export -To use the image export functionality, set the [`allowImageExport`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#allowimageexport) property as **true** and inject the **ImageExport** module into **services**. The rendered Linear Gauge can be exported as an image using the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#export) method. This method requires two parameters: export type and file name. The Linear Gauge can be exported as an image with the following formats. +To use the image export functionality, set the [`allowImageExport`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#allowimageexport) property as **true** and inject the **ImageExport** module into **services**. The rendered Linear Gauge can be exported as an image using the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#export) method. This method requires two parameters: export type and file name. The Linear Gauge can be exported as an image with the following formats. * JPEG * PNG @@ -48,7 +48,7 @@ To use the image export functionality, set the [`allowImageExport`](https://ej2. ### PDF Export -To use the PDF export functionality, set the [`allowPdfExport`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#allowpdfexport) property as **true** and inject the **PdfExport** module into **services**. The rendered Linear Gauge can be exported as PDF using the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#export) method. The [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#export) method requires three parameters: file type, file name, and orientation of the PDF document. The orientation of the PDF document can be set as **Portrait** or **Landscape**. +To use the PDF export functionality, set the [`allowPdfExport`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#allowpdfexport) property as **true** and inject the **PdfExport** module into **services**. The rendered Linear Gauge can be exported as PDF using the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#export) method. The [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#export) method requires three parameters: file type, file name, and orientation of the PDF document. The orientation of the PDF document can be set as **Portrait** or **Landscape**. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -63,7 +63,7 @@ To use the PDF export functionality, set the [`allowPdfExport`](https://ej2.sync ### Exporting Linear Gauge as base64 string of the file -The Linear Gauge can be exported as base64 string for the JPEG, PNG and PDF formats. The rendered Linear Gauge can be exported as base64 string of the exported image or PDF document used in the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/#export) method. The arguments that are required for this method is export type, file name, orientation of the exported PDF document and **allowDownload** boolean value that is set as **false** to return base64 string. The value for the orientation of the exported PDF document is set as **null** for image export and **Portrait** or **Landscape** for the PDF document. +The Linear Gauge can be exported as base64 string for the JPEG, PNG and PDF formats. The rendered Linear Gauge can be exported as base64 string of the exported image or PDF document used in the [`export`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge#export) method. The arguments that are required for this method is export type, file name, orientation of the exported PDF document and **allowDownload** boolean value that is set as **false** to return base64 string. The value for the orientation of the exported PDF document is set as **null** for image export and **Portrait** or **Landscape** for the PDF document. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/linear-gauge/ranges.md b/chart-sdk/react/linear-gauge/ranges.md index 518a372de..97ec53a39 100644 --- a/chart-sdk/react/linear-gauge/ranges.md +++ b/chart-sdk/react/linear-gauge/ranges.md @@ -1,14 +1,14 @@ --- layout: post -title: Ranges in React Linear gauge component | Syncfusion -description: Learn here all about Ranges in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: Ranges in React Linear Gauge | Syncfusion +description: Define value ranges on the React Linear Gauge axis with custom width, color, position, and linear or radial gradient fills. control: Ranges platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ranges in React Linear gauge component +# Ranges in React Linear Gauge Range is the set of values in the axis. The range can be defined using the [`start`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/rangeModel#start) and [`end`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/rangeModel#end) properties in the [`RangeDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/rangeModel). Any number of ranges can be added to the Linear Gauge using the [`RangesDirective`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/axisModel#ranges). diff --git a/chart-sdk/react/linear-gauge/user-interaction.md b/chart-sdk/react/linear-gauge/user-interaction.md index 69a2def79..6fae77854 100644 --- a/chart-sdk/react/linear-gauge/user-interaction.md +++ b/chart-sdk/react/linear-gauge/user-interaction.md @@ -1,14 +1,14 @@ --- layout: post -title: User interaction in React Linear gauge component | Syncfusion -description: Learn here all about User interaction in Syncfusion React Linear gauge component of Syncfusion Essential JS 2 and more. +title: User Interaction in React Linear Gauge | Syncfusion +description: Enable interactive features in the React Linear Gauge, including hover tooltips with custom templates and draggable marker or bar pointers. control: User interaction platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# User interaction in React Linear gauge component +# User Interaction in React Linear Gauge @@ -16,7 +16,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -Linear Gauge displays the details about a pointer value through [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/), when the mouse hovers over the pointer. To enable the tooltip, set [`enable`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#enable) property as **true** and inject **GaugeTooltip** into **services**. +Linear Gauge displays the details about a pointer value through [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings), when the mouse hovers over the pointer. To enable the tooltip, set [`enable`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#enable) property as **true** and inject **GaugeTooltip** into **services**. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -34,7 +34,7 @@ Linear Gauge displays the details about a pointer value through [`tooltip`](http ### Tooltip format -Tooltip in the Linear Gauge control can be formatted using the [`format`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#format) property in [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/). It is used to render the tooltip in certain format or to add a user-defined unit in the tooltip. By default, the tooltip shows the pointer value only. In addition to that, more information can be added in the tooltip. For example, the format **{value}km** shows pointer value with kilometer unit in the tooltip. +Tooltip in the Linear Gauge control can be formatted using the [`format`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#format) property in [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings). It is used to render the tooltip in certain format or to add a user-defined unit in the tooltip. By default, the tooltip shows the pointer value only. In addition to that, more information can be added in the tooltip. For example, the format **{value}km** shows pointer value with kilometer unit in the tooltip. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -49,7 +49,7 @@ Tooltip in the Linear Gauge control can be formatted using the [`format`](https: ### Tooltip Template -The HTML elements rendered in the tooltip of the Linear Gauge using the [`template`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#template) property of the [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/). The **${value}** can be used as placeholders in the HTML element to display the pointer values of the corresponding axis. +The HTML elements rendered in the tooltip of the Linear Gauge using the [`template`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#template) property of the [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings). The **${value}** can be used as placeholders in the HTML element to display the pointer values of the corresponding axis. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -64,13 +64,13 @@ The HTML elements rendered in the tooltip of the Linear Gauge using the [`templa ### Customize the appearance of the tooltip -The tooltip can be customized using the following properties in [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/). +The tooltip can be customized using the following properties in [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings). -* [`fill`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#fill) - To fill the color for tooltip. -* [`enableAnimation`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#enableanimation) - To enable or disable the tooltip animation. -* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#border) - To set the border color and width of the tooltip. -* [`textStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#textstyle) - To customize the style of the text in tooltip. -* [`showAtMousePosition`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#showatmouseposition) - To show the tooltip at the mouse position. +* [`fill`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#fill) - To fill the color for tooltip. +* [`enableAnimation`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#enableanimation) - To enable or disable the tooltip animation. +* [`border`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#border) - To set the border color and width of the tooltip. +* [`textStyle`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#textstyle) - To customize the style of the text in tooltip. +* [`showAtMousePosition`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#showatmouseposition) - To show the tooltip at the mouse position. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -85,7 +85,7 @@ The tooltip can be customized using the following properties in [`tooltip`](http ### Positioning the tooltip -The tooltip is positioned at the **End** of the pointer. To change the position of the tooltip at the start, or center of the pointer, set the [`position`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings/#position) property to **Start** or **Center**. +The tooltip is positioned at the **End** of the pointer. To change the position of the tooltip at the start, or center of the pointer, set the [`position`](https://ej2.syncfusion.com/react/documentation/api/linear-gauge/tooltipSettings#position) property to **Start** or **Center**. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/maps/accessibility.md b/chart-sdk/react/maps/accessibility.md index a386d9836..9c974c227 100644 --- a/chart-sdk/react/maps/accessibility.md +++ b/chart-sdk/react/maps/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Maps component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Accessibility +ttitle: Accessibility in React Maps | Syncfusion +description: Learn about React Maps accessibility compliance with WCAG 2.2, Section 508, and ADA, including screen reader and keyboard navigation support. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Maps component +# Accessibility in React Maps Accessibility enables users with disabilities to interact with the Maps component through assistive technologies such as screen readers and keyboard navigation. The Maps component is designed to comply with [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria#roles). diff --git a/chart-sdk/react/maps/annotations.md b/chart-sdk/react/maps/annotations.md index dc6562c29..0c2262972 100644 --- a/chart-sdk/react/maps/annotations.md +++ b/chart-sdk/react/maps/annotations.md @@ -1,14 +1,14 @@ --- layout: post -title: Annotations in React Maps component | Syncfusion -description: Learn here all about Annotations in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Annotations in React Maps | Syncfusion +description: Learn how to overlay custom text, images, or HTML elements as annotations on React Maps to mark areas of interest beyond markers and data labels. control: Annotations platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Annotations in React Maps component +# Annotations in React Maps diff --git a/chart-sdk/react/maps/bubble.md b/chart-sdk/react/maps/bubble.md index 35d64ac60..e1199b63d 100644 --- a/chart-sdk/react/maps/bubble.md +++ b/chart-sdk/react/maps/bubble.md @@ -1,14 +1,14 @@ --- layout: post -title: Bubble in React Maps component | Syncfusion -description: Learn here all about Bubble in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Bubble in React Maps | Syncfusion +description: Learn how to render and size data bubbles in React Maps to visualize numerical values across geographic regions with circular or square shapes. control: Bubble platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bubble in React Maps component +# Bubble in React Maps This section shows how to customize the appearance of the bubbles in the Maps component. The below video demonstrates the same. diff --git a/chart-sdk/react/maps/color-mapping.md b/chart-sdk/react/maps/color-mapping.md index d7162b371..c7ab01748 100644 --- a/chart-sdk/react/maps/color-mapping.md +++ b/chart-sdk/react/maps/color-mapping.md @@ -1,14 +1,14 @@ --- layout: post -title: Color mapping in React Maps component | Syncfusion -description: Learn here all about Color mapping in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Color Mapping in React Maps | Syncfusion +description: Learn how to apply range, equal, and desaturation color mapping in React Maps to visualize shape data based on numeric values and field-driven palettes. control: Color mapping platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Color mapping in React Maps component +# Color Mapping in React Maps Color mapping customizes shape colors based on data values. It supports three primary types: range, equal, and desaturation. To apply color mapping, bind data to the [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/maps/layerSettingsModel#datasource) property of [`layerSettings`](https://ej2.syncfusion.com/react/documentation/api/maps/layerSettingsModel) and set the [`colorValuePath`](https://ej2.syncfusion.com/react/documentation/api/maps/shapeSettingsModel#colorvaluepath) property in [`shapeSettings`](https://ej2.syncfusion.com/react/documentation/api/maps/shapeSettingsModel) to specify which field controls the color value. diff --git a/chart-sdk/react/maps/customization.md b/chart-sdk/react/maps/customization.md index 9f7a3a863..d5adb2b90 100644 --- a/chart-sdk/react/maps/customization.md +++ b/chart-sdk/react/maps/customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Customization in React Maps component | Syncfusion -description: Learn here all about Customization in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Customization +title: Customization in React Maps | Syncfusion +description: Learn how to customize React Maps appearance, including size, title, theme, container styling, shape properties, and projection type for any layout. +control: Customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Customization in React Maps component +# Customization in React Maps The Maps component provides various options to customize its appearance, including size, title, theme, container styling, shape properties, and projection type. This section explains how to configure these customization options. diff --git a/chart-sdk/react/maps/data-label.md b/chart-sdk/react/maps/data-label.md index 318b42d11..50807351e 100644 --- a/chart-sdk/react/maps/data-label.md +++ b/chart-sdk/react/maps/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data label in React Maps component | Syncfusion -description: Learn here all about Data label in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Data Labels in React Maps | Syncfusion +description: Learn how to display React Maps data labels for shape data or a bound data source, including labelPath configuration and visibility settings. control: Data label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data label in React Maps component +# Data Labels in React Maps Data labels display information about map shapes. Enable data labels by setting the [visible](https://ej2.syncfusion.com/react/documentation/api/maps/dataLabelSettingsModel#visible) property of the [dataLabelSettings](https://ej2.syncfusion.com/react/documentation/api/maps/dataLabelSettingsModel) to **true**. diff --git a/chart-sdk/react/maps/ej1-api-migration.md b/chart-sdk/react/maps/ej1-api-migration.md index 693355746..427a527f3 100644 --- a/chart-sdk/react/maps/ej1-api-migration.md +++ b/chart-sdk/react/maps/ej1-api-migration.md @@ -1,8 +1,8 @@ --- layout: post -title: Ej1 api migration in React Maps component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Ej1 api migration +title: Ej1 Api Migration in React Maps | Syncfusion +description: Learn how to migrate the Maps API from Essential JS 1 to Essential JS 2 in React, including updated properties, modules, and event patterns. +control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk {% raw %} -# Ej1 api migration in React Maps component +# Ej1 Api Migration in React Maps This article describes the API migration process of Maps component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/maps/getting-started.md b/chart-sdk/react/maps/getting-started.md index e5334b58e..e9cf37db4 100644 --- a/chart-sdk/react/maps/getting-started.md +++ b/chart-sdk/react/maps/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React Maps component | Syncfusion -description: Check out and learn about Getting started with React Maps component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Maps | Syncfusion +description: Learn how to get started with the Syncfusion React Maps control. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Maps component +# Getting Started with React Maps This section explains the steps required to create a basic Maps component. diff --git a/chart-sdk/react/maps/how-to/creating-routes-between-the-markers.md b/chart-sdk/react/maps/how-to/creating-routes-between-the-markers.md index 6ce193a67..e111e2b58 100644 --- a/chart-sdk/react/maps/how-to/creating-routes-between-the-markers.md +++ b/chart-sdk/react/maps/how-to/creating-routes-between-the-markers.md @@ -1,14 +1,14 @@ --- layout: post -title: How to create routes between markers in Maps component | Syncfusion -description: Learn here all about creating routes between markers in the Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Maps +title: How to create routes between markers in React Maps | Syncfusion +description: Learn how to plot routes between source and destination markers in React Maps using navigation lines and coordinates from the Google Maps Directions API. +control: Maps platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Creating Routes Between Markers in the React Maps component +# How to create routes between markers in React Maps The Syncfusion® Maps component supports plotting routes between two locations (source and destination) using the navigation line feature. Markers can be placed at these locations to visually indicate the source and destination, making it easier to view the path between them on the map. diff --git a/chart-sdk/react/maps/how-to/custom-path.md b/chart-sdk/react/maps/how-to/custom-path.md index 898428f92..9fc17ca6e 100644 --- a/chart-sdk/react/maps/how-to/custom-path.md +++ b/chart-sdk/react/maps/how-to/custom-path.md @@ -1,14 +1,14 @@ --- layout: post -title: Custom path in React Maps component | Syncfusion -description: Learn here all about Custom path in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Custom path +title: How to add a custom path in React Maps | Syncfusion +description: Learn how to build custom-path layouts in React Maps using normal geometry shapes, demonstrated with a bus seat selection example. +control: Custom path platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Custom path in React Maps component +# How to add a custom path in React Maps Maps component can be customized as the desired layout using the custom path map feature. Here, the Maps component has been showcased with normal geometry type shapes to represent the bus seat selection layout. diff --git a/chart-sdk/react/maps/how-to/drilldown.md b/chart-sdk/react/maps/how-to/drilldown.md index 66996083f..d005de7da 100644 --- a/chart-sdk/react/maps/how-to/drilldown.md +++ b/chart-sdk/react/maps/how-to/drilldown.md @@ -1,16 +1,16 @@ --- layout: post -title: Drilldown in React Maps component | Syncfusion -description: Learn here all about Drilldown in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Drilldown +title: How to drilldown in React Maps | Syncfusion +description: Learn how to enable drilldown in React Maps by clicking a continent shape to reveal all countries within it via the shapeSelected event. +control: Drilldown platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Drilldown in React Maps component +# How to drilldown in React Maps -By clicking a continent, all the countries available in that continent can be viewed using the drill-down feature. For example, the countries in the `Africa` continent have been showcased here. To showcase all the countries in `Africa` continent by clicking the [`shapeSelected`](https://ej2.syncfusion.com/react/documentation/api/maps/#shapeselected) event as mentioned in the following example. +By clicking a continent, all the countries available in that continent can be viewed using the drill-down feature. For example, the countries in the `Africa` continent have been showcased here. To showcase all the countries in `Africa` continent by clicking the [`shapeSelected`](https://ej2.syncfusion.com/react/documentation/api/maps#shapeselected) event as mentioned in the following example. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/maps/internationalization.md b/chart-sdk/react/maps/internationalization.md index 3f2505492..ccab68d53 100644 --- a/chart-sdk/react/maps/internationalization.md +++ b/chart-sdk/react/maps/internationalization.md @@ -1,14 +1,14 @@ --- layout: post -title: Internationalization in React Maps component | Syncfusion -description: Learn here all about Internationalization in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Internationalization +title: Internationalization in React Maps | Syncfusion +description: Learn how to globalize React Maps data labels and tooltips using number and date formatters for different cultures and locales worldwide. +control: Internationalization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Internationalization in React Maps component +# Internationalization in React Maps Internationalization enables the Maps component to display content in different cultures and locales, making it accessible to users worldwide. The Maps component supports internationalization for the following elements: diff --git a/chart-sdk/react/maps/layers.md b/chart-sdk/react/maps/layers.md index 8cad6401d..594ab2d5b 100644 --- a/chart-sdk/react/maps/layers.md +++ b/chart-sdk/react/maps/layers.md @@ -1,14 +1,14 @@ --- layout: post -title: Layers in React Maps component | Syncfusion -description: Learn here all about Layers in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Layers +title: Layers in React Maps | Syncfusion +description: Learn how to add and combine multiple layers in React Maps, including main shape layers, map providers, and overlay sublayers for richer visualizations. +control: Layers platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Layers in React Maps component +# Layers in React Maps Layers are the fundamental building blocks of the Maps component. Each layer can display shape data from GeoJSON files or map providers. The Maps component renders content through the [`layers`](https://ej2.syncfusion.com/react/documentation/api/maps#layers) property, and multiple layers can be added to create rich, layered map visualizations. diff --git a/chart-sdk/react/maps/legend.md b/chart-sdk/react/maps/legend.md index 5dd6a2350..8556ba2a6 100644 --- a/chart-sdk/react/maps/legend.md +++ b/chart-sdk/react/maps/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Maps component | Syncfusion -description: Learn here all about Legend in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Legend +title: Legend in React Maps | Syncfusion +description: Learn how to add and position legends in React Maps to explain the colors, shapes, and symbols used to represent data on the map. +control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Maps component +# Legend in React Maps This section shows how to add legends in the Maps component. The below video demonstrates the same. diff --git a/chart-sdk/react/maps/localization.md b/chart-sdk/react/maps/localization.md index 5f1032ecc..d778a4dfa 100644 --- a/chart-sdk/react/maps/localization.md +++ b/chart-sdk/react/maps/localization.md @@ -1,14 +1,14 @@ --- layout: post -title: Localization in React Maps component | Syncfusion -description: Learn here all about Localization in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Localization in React Maps | Syncfusion +description: Learn how to localize static text such as zoom toolbar tooltips in React Maps by defining locale values and translation objects for any culture. control: Localization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Localization in React Maps component +# Localization in React Maps The localization library allows localizing the default text content of the Maps component. The Maps component has the static text of some features such as tooltip of zoom toolbar, and that can be changed to any other culture(Arabic, Deutsch, French, etc) by defining the locale value and translation object. diff --git a/chart-sdk/react/maps/markers.md b/chart-sdk/react/maps/markers.md index 1df3bf263..ba6ff1f8b 100644 --- a/chart-sdk/react/maps/markers.md +++ b/chart-sdk/react/maps/markers.md @@ -1,14 +1,14 @@ --- layout: post -title: Markers in React Maps component | Syncfusion -description: Learn here all about Markers in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Markers +title: Markers in React Maps | Syncfusion +description: Learn how to add and customize markers in React Maps to pinpoint specific locations, highlight points of interest, and display custom symbols. +control: Markers platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Markers in React Maps component +# Markers in React Maps This section shows how to add and customize the markers in the Maps component. The below video demonstrates the same. diff --git a/chart-sdk/react/maps/methods.md b/chart-sdk/react/maps/methods.md index ffcca4e7a..b563fc0d0 100644 --- a/chart-sdk/react/maps/methods.md +++ b/chart-sdk/react/maps/methods.md @@ -1,14 +1,14 @@ --- layout: post -title: Methods in React Maps component | Syncfusion -description: Learn here all about methods in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Methods in React Maps | Syncfusion +description: Learn the React Maps public methods for retrieving coordinates, manipulating layers, refreshing content, and exporting visualizations programmatically. control: Methods platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Methods in React Maps component +# Methods in React Maps The Maps control provides several public methods that enable programmatic control and interaction with map controls. These methods allow developers to perform operations such as retrieving geographic coordinates, manipulating layers, refreshing content, and exporting map visualizations. This section documents the available methods and their usage. diff --git a/chart-sdk/react/maps/navigation-line.md b/chart-sdk/react/maps/navigation-line.md index ed13155ad..0514c5d37 100644 --- a/chart-sdk/react/maps/navigation-line.md +++ b/chart-sdk/react/maps/navigation-line.md @@ -1,14 +1,14 @@ --- layout: post -title: Navigation line in React Maps component | Syncfusion -description: Learn here all about Navigation line in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Navigation Lines in React Maps | Syncfusion +description: Learn how to draw curved navigation lines in React Maps to visualize flight routes, sea routes, and other paths between geographic locations. control: Navigation line platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Navigation line in React Maps component +# Navigation Lines in React Maps Navigation lines are curved paths used to denote the route between two locations on the Maps. This feature is commonly used to draw flight routes, sea routes, or any path connecting two geographic points. Navigation lines are enabled by setting the [`visible`](https://ej2.syncfusion.com/react/documentation/api/maps/navigationLineSettingsModel#visible) property of the [`navigationLineSettings`](https://ej2.syncfusion.com/react/documentation/api/maps/navigationLineSettingsModel) to **true**. diff --git a/chart-sdk/react/maps/nextjs-getting-started.md b/chart-sdk/react/maps/nextjs-getting-started.md index 95f5bb5d9..ce8f9a7a2 100644 --- a/chart-sdk/react/maps/nextjs-getting-started.md +++ b/chart-sdk/react/maps/nextjs-getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: React getting started with Next.js | Syncfusion -description: Check out and learn here all about how to use the Syncfusion React UI components in the Next.js project. +title: Getting Started with Next.js in React Maps | Syncfusion +description: Learn how to set up a Next.js application and integrate the Syncfusion React Maps component using a step-by-step walkthrough and npm package install. control: Next.js platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Creating a Next.js Application Using Syncfusion® React Components +# Getting Started with Next.js in React Maps This section provides a step-by-step guide for setting up a Next.js application and integrating the Syncfusion® React Maps component. diff --git a/chart-sdk/react/maps/polygon.md b/chart-sdk/react/maps/polygon.md index 5a42419f0..4703c5825 100644 --- a/chart-sdk/react/maps/polygon.md +++ b/chart-sdk/react/maps/polygon.md @@ -1,14 +1,14 @@ --- layout: post -title: Polygon in React Maps component | Syncfusion -description: Learn here all about Polygon in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Polygon +title: Polygon in React Maps | Syncfusion +description: Learn how to add and customize polygon overlays in React Maps using latitude/longitude coordinates for zones, boundaries, regions, and coverage areas. +control: Polygon platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Polygon shape in React Maps component +# Polygon in React Maps The Maps component supports rendering custom polygon shapes as overlays on both geometry-based maps and online tile maps. Polygons are useful for highlighting specific geographic regions, marking zones of interest, drawing custom boundaries, or visualizing areas such as coverage zones, territorial boundaries, or restricted areas. This feature is configured using the [polygons](https://ej2.syncfusion.com/react/documentation/api/maps/polygonSettingsModel#polygons) property, which allows multiple polygon shapes to be added and customized independently. diff --git a/chart-sdk/react/maps/populate-data.md b/chart-sdk/react/maps/populate-data.md index db5ef8e78..b480a8339 100644 --- a/chart-sdk/react/maps/populate-data.md +++ b/chart-sdk/react/maps/populate-data.md @@ -1,14 +1,14 @@ --- layout: post -title: Populate data in React Maps component | Syncfusion -description: Learn here all about Populate data in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Populate Data in React Maps | Syncfusion +description: Learn how to populate React Maps with GeoJSON shape data, including supported geometry types like Polygon, LineString, and MultiPolygon for custom layouts. control: Populate data platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Populate data in React Maps component +# Populate Data in React Maps ## Geometry types diff --git a/chart-sdk/react/maps/print.md b/chart-sdk/react/maps/print.md index 74bcd2570..94f9aaabd 100644 --- a/chart-sdk/react/maps/print.md +++ b/chart-sdk/react/maps/print.md @@ -1,14 +1,14 @@ --- layout: post -title: Print in React Maps component | Syncfusion -description: Learn here all about Print in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Print +title: Print and Export in React Maps | Syncfusion +description: Learn how to print and export React Maps directly from the browser by injecting the Print module and enabling the allowPrint property. +control: Print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print in React Maps component +# Print and Export in React Maps ## Print diff --git a/chart-sdk/react/maps/providers/azure-maps.md b/chart-sdk/react/maps/providers/azure-maps.md index ebc3fe9f5..5bd8a222c 100644 --- a/chart-sdk/react/maps/providers/azure-maps.md +++ b/chart-sdk/react/maps/providers/azure-maps.md @@ -1,14 +1,14 @@ --- layout: post -title: Azure maps in React Maps component | Syncfusion -description: Learn here all about Azure maps in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Azure maps +title: Azure Maps in React Maps | Syncfusion +description: Learn how to integrate Microsoft Azure Maps in React Maps with satellite, road, and terrain styles using an Azure Maps subscription. +control: Azure maps platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Azure maps integration in React Maps component +# Azure Maps in React Maps Azure Maps is an online map service provider from Microsoft. Similar to OSM and Bing Maps, it provides map tile images based on requests and combines them to display the map area. Azure Maps offers various map styles including satellite imagery, road maps, and terrain views with global coverage. diff --git a/chart-sdk/react/maps/providers/bing-maps.md b/chart-sdk/react/maps/providers/bing-maps.md index 398da10d4..efc3b025b 100644 --- a/chart-sdk/react/maps/providers/bing-maps.md +++ b/chart-sdk/react/maps/providers/bing-maps.md @@ -1,14 +1,14 @@ --- layout: post -title: Bing maps in React Maps component | Syncfusion -description: Learn here all about Bing maps in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: Bing Maps in React Maps | Syncfusion +description: Learn how to integrate Microsoft Bing Maps in React Maps using a valid Bing Maps API key to render tile-based geographic visualizations. control: Bing maps platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bing maps integration in React Maps component +# Bing Maps in React Maps Bing Maps is a online Maps provider, owned by Microsoft. As like OSM, it provide Maps tile images based on our requests and combines those images into a single one to display Maps area. diff --git a/chart-sdk/react/maps/providers/openstreetmap.md b/chart-sdk/react/maps/providers/openstreetmap.md index 42c83c6b1..a1688351f 100644 --- a/chart-sdk/react/maps/providers/openstreetmap.md +++ b/chart-sdk/react/maps/providers/openstreetmap.md @@ -1,14 +1,14 @@ --- layout: post -title: Openstreetmap in React Maps component | Syncfusion -description: Learn here all about Openstreetmap in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: OpenStreetMap in React Maps | Syncfusion +description: Learn how to integrate OpenStreetMap as a tile-based map provider in React Maps using free, community-built geographic tile images. control: Openstreetmap platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Openstreetmap integration in React Maps component +# OpenStreetMap in React Maps Map providers are online services that supply map tile images for rendering geographic visualizations. The Maps component supports integration with various tile-based map providers to display real-world geographic data. diff --git a/chart-sdk/react/maps/providers/other-maps.md b/chart-sdk/react/maps/providers/other-maps.md index 762d06315..afcb9e10b 100644 --- a/chart-sdk/react/maps/providers/other-maps.md +++ b/chart-sdk/react/maps/providers/other-maps.md @@ -1,14 +1,14 @@ --- layout: post -title: Other maps in React Maps component | Syncfusion -description: Learn here all about Other maps in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. -control: Other maps +title: Other Maps in React Maps | Syncfusion +description: Learn how to integrate any tile-based map provider in React Maps by specifying a custom URL template via the urlTemplate property. +control: Other maps platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Other maps in React Maps component +# Other Maps in React Maps In addition to OpenStreetMap, Bing Maps, and Azure Maps, the Maps component supports integration with other third-party online map service providers. Custom map providers can be rendered by specifying their tile server URL in the [urlTemplate](https://ej2.syncfusion.com/react/documentation/api/maps/layerSettingsModel#urltemplate) property. The Maps component supports any tile-based map provider that uses standard URL template formats for tile requests. diff --git a/chart-sdk/react/maps/state-persistence.md b/chart-sdk/react/maps/state-persistence.md index fc556ac27..58ee291c4 100644 --- a/chart-sdk/react/maps/state-persistence.md +++ b/chart-sdk/react/maps/state-persistence.md @@ -1,14 +1,14 @@ --- layout: post -title: State persistence in React Maps component | Syncfusion -description: Learn here all about State persistence in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: State Persistence in React Maps | Syncfusion +description: Learn how to enable state persistence in React Maps to retain model values in browser cookies across page refreshes using enablePersistence. control: State persistence platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# State persistence in React Maps component +# State Persistence in React Maps ## State Persistence diff --git a/chart-sdk/react/maps/user-interactions.md b/chart-sdk/react/maps/user-interactions.md index dec0bf3b4..71a8d13b6 100644 --- a/chart-sdk/react/maps/user-interactions.md +++ b/chart-sdk/react/maps/user-interactions.md @@ -1,14 +1,14 @@ --- layout: post -title: User interactions in React Maps component | Syncfusion -description: Learn here all about User interactions in Syncfusion React Maps component of Syncfusion Essential JS 2 and more. +title: User Interactions in React Maps | Syncfusion +description: Learn how to enable zooming, panning, and other user interactions in React Maps using zoomSettings for in-depth map exploration. control: User interactions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# User interactions in React Maps component +# User Interactions in React Maps ## Zooming diff --git a/chart-sdk/react/range-navigator/accessibility.md b/chart-sdk/react/range-navigator/accessibility.md index 7ad766a48..a5351d664 100644 --- a/chart-sdk/react/range-navigator/accessibility.md +++ b/chart-sdk/react/range-navigator/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Range navigator component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Accessibility +title: Accessibility in React Range Navigator | Syncfusion +description: Learn how the Syncfusion React Range Navigator Component supports accessibility with WAI-ARIA roles, attributes, and keyboard navigation. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Range navigator component +# Accessibility in React Range Navigator The Range navigator component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/range-navigator/customization.md b/chart-sdk/react/range-navigator/customization.md index 81d8c245c..d0eb7f352 100644 --- a/chart-sdk/react/range-navigator/customization.md +++ b/chart-sdk/react/range-navigator/customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Customization in React Range navigator component | Syncfusion -description: Learn here all about Customization in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Customization +title: Customization in React Range Navigator | Syncfusion +description: Learn how to customize the Syncfusion React Range Navigator Component using navigator style, thumb shape, border, snapping, and animation. +control: Customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Customization in React Range navigator component +# Customization in React Range Navigator ## Navigator appearance diff --git a/chart-sdk/react/range-navigator/data.md b/chart-sdk/react/range-navigator/data.md index 1a57d53d8..2fdedb07b 100644 --- a/chart-sdk/react/range-navigator/data.md +++ b/chart-sdk/react/range-navigator/data.md @@ -1,7 +1,7 @@ --- layout: post -title: Data in React Range navigator component | Syncfusion -description: Learn here all about Data in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Data in React Range Navigator | Syncfusion +description: Learn how to bind numeric, date-time, and logarithmic data to the Syncfusion React Range Navigator Component using valueType properties. control: Data platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Data in React Range navigator component +# Data in React Range Navigator ## Numeric diff --git a/chart-sdk/react/range-navigator/ej1-api-migration.md b/chart-sdk/react/range-navigator/ej1-api-migration.md index 8da6b8c24..8dfb332d7 100644 --- a/chart-sdk/react/range-navigator/ej1-api-migration.md +++ b/chart-sdk/react/range-navigator/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Range navigator component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Ej1 api migration +title: EJ1 API Migration in React Range Navigator | Syncfusion +description: Learn how to migrate the Syncfusion React Range Navigator Component from Essential JS 1 to EJ2 with API mapping and code rewrite guidance. +control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Range navigator component +# EJ1 API Migration in React Range Navigator This article describes the API migration process of Chart component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/range-navigator/export-print.md b/chart-sdk/react/range-navigator/export-print.md index a21762162..1d07274f3 100644 --- a/chart-sdk/react/range-navigator/export-print.md +++ b/chart-sdk/react/range-navigator/export-print.md @@ -1,14 +1,14 @@ --- layout: post -title: Export print in React Range navigator component | Syncfusion -description: Learn here all about Export print in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Export and Print in React Range Navigator | Syncfusion +description: Learn how to export and print the Syncfusion React Range Navigator Component to PDF, image, or SVG using the export and print methods. control: Export print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Export print in React Range navigator component +# Export and Print in React Range Navigator ## Export diff --git a/chart-sdk/react/range-navigator/getting-started.md b/chart-sdk/react/range-navigator/getting-started.md index c04bc9872..f1eaae30f 100644 --- a/chart-sdk/react/range-navigator/getting-started.md +++ b/chart-sdk/react/range-navigator/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React Range Navigator component | Syncfusion -description: Check out and learn about getting started with the React Range Navigator component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Range Navigator | Syncfusion +description: Learn how to get started with the Syncfusion React Range Navigator Component. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting started with React Range Navigator component +# Getting Started with React Range Navigator This section describes the steps to create a simple Range Navigator and demonstrates the basic usage of the Range Navigator component. diff --git a/chart-sdk/react/range-navigator/grid-tick.md b/chart-sdk/react/range-navigator/grid-tick.md index dfc995272..2b9444b86 100644 --- a/chart-sdk/react/range-navigator/grid-tick.md +++ b/chart-sdk/react/range-navigator/grid-tick.md @@ -1,14 +1,14 @@ --- layout: post -title: Grid tick in React Range navigator component | Syncfusion -description: Learn here all about Grid tick in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Grid and Tick Lines in React Range Navigator | Syncfusion +description: Learn how to show and customize grid and tick lines on the Syncfusion React Range Navigator Component using major tick settings. control: Grid tick platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Grid tick in React Range navigator component +# Grid and Tick Lines in React Range Navigator ## Grid line customization diff --git a/chart-sdk/react/range-navigator/labels.md b/chart-sdk/react/range-navigator/labels.md index 4fdc959bb..afaad36d7 100644 --- a/chart-sdk/react/range-navigator/labels.md +++ b/chart-sdk/react/range-navigator/labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Labels in React Range navigator component | Syncfusion -description: Learn here all about Labels in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Labels +title: Labels in React Range Navigator | Syncfusion +description: Learn how to configure and customize labels in the Syncfusion React Range Navigator Component using labelFormat, labelStyle, and labelIntersectAction. +control: Labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Labels in React Range navigator component +# Labels in React Range Navigator ## Multilevel labels diff --git a/chart-sdk/react/range-navigator/lightweight.md b/chart-sdk/react/range-navigator/lightweight.md index 4590d3622..58e30f566 100644 --- a/chart-sdk/react/range-navigator/lightweight.md +++ b/chart-sdk/react/range-navigator/lightweight.md @@ -1,14 +1,14 @@ --- layout: post -title: Lightweight in React Range navigator component | Syncfusion -description: Learn here all about Lightweight in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Lightweight +title: Lightweight in React Range Navigator | Syncfusion +description: Learn how to render the lightweight Syncfusion React Range Navigator Component for simpler styling and faster performance. +control: Lightweight platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Lightweight in React Range navigator component +# Lightweight in React Range Navigator By default, when the [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/range-navigator#datasource) for [`series`](https://ej2.syncfusion.com/react/documentation/api/range-navigator#series) is empty, a lightweight Range Selector will be shown without Chart. diff --git a/chart-sdk/react/range-navigator/period-selector.md b/chart-sdk/react/range-navigator/period-selector.md index e85992280..680b7f8c5 100644 --- a/chart-sdk/react/range-navigator/period-selector.md +++ b/chart-sdk/react/range-navigator/period-selector.md @@ -1,14 +1,14 @@ --- layout: post -title: Period selector in React Range navigator component | Syncfusion -description: Learn here all about Period selector in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Period Selector in React Range Navigator | Syncfusion +description: Learn how to add a period selector to the Syncfusion React Range Navigator Component for quick presets. control: Period selector platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Period selector in React Range navigator component +# Period Selector in React Range Navigator The period selector allows to select a range with specified periods. diff --git a/chart-sdk/react/range-navigator/r-t-l.md b/chart-sdk/react/range-navigator/r-t-l.md index 2bcedbaaa..47366fc9f 100644 --- a/chart-sdk/react/range-navigator/r-t-l.md +++ b/chart-sdk/react/range-navigator/r-t-l.md @@ -1,14 +1,14 @@ --- layout: post -title: R t l in React Range navigator component | Syncfusion -description: Learn here all about R t l in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: R t l +title: RTL in React Range Navigator | Syncfusion +description: Learn how to enable right-to-left rendering on the Syncfusion React Range Navigator Component for languages like Arabic. +control: RTL platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# R t l in React Range navigator component +# RTL in React Range Navigator The Range Selector supports right-to-left (RTL), which can be enabled with the [`enableRtl`](https://ej2.syncfusion.com/react/documentation/api/range-navigator#enablertl) property. diff --git a/chart-sdk/react/range-navigator/selecting-range.md b/chart-sdk/react/range-navigator/selecting-range.md index e9a8a2157..9e6f76be5 100644 --- a/chart-sdk/react/range-navigator/selecting-range.md +++ b/chart-sdk/react/range-navigator/selecting-range.md @@ -1,14 +1,14 @@ --- layout: post -title: Selecting range in React Range navigator component | Syncfusion -description: Learn here all about Selecting range in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Range in React Range Navigator | Syncfusion +description: Learn how to select a range in the Syncfusion React Range Navigator Component by dragging the thumbs, tapping the labels, or setting the value. control: Selecting range platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Selecting range in React Range navigator component +# Range in React Range Navigator The Range Selector's left and right thumbs are used to indicate the selected range in the large collection of data. A range can be selected in the following ways: diff --git a/chart-sdk/react/range-navigator/series-types.md b/chart-sdk/react/range-navigator/series-types.md index 12c20c3f6..e8c43cfe4 100644 --- a/chart-sdk/react/range-navigator/series-types.md +++ b/chart-sdk/react/range-navigator/series-types.md @@ -1,14 +1,14 @@ --- layout: post -title: Series types in React Range navigator component | Syncfusion -description: Learn here all about Series types in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. +title: Series Types in React Range Navigator | Syncfusion +description: Learn how to render line, area, column, step line, spline and spline area series in the Syncfusion React Range Navigator Component for visual time-range data. control: Series types platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Series types in React Range navigator component +# Series Types in React Range Navigator To render the data, the Range Selector supports six types of series. diff --git a/chart-sdk/react/range-navigator/tool-tip.md b/chart-sdk/react/range-navigator/tool-tip.md index 40488b03f..aed712ca1 100644 --- a/chart-sdk/react/range-navigator/tool-tip.md +++ b/chart-sdk/react/range-navigator/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip in React Range navigator component | Syncfusion -description: Learn here all about Tool tip in Syncfusion React Range navigator component of Syncfusion Essential JS 2 and more. -control: Tool tip +title: Tooltip in React Range Navigator | Syncfusion +description: Learn how to enable and customize tooltips on the Syncfusion React Range Navigator Component with format, display mode, and template options. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip in React Range navigator component +# Tooltip in React Range Navigator diff --git a/chart-sdk/react/sankey-diagram/accessibility.md b/chart-sdk/react/sankey-diagram/accessibility.md index 6b58561c1..5f57cd2fd 100644 --- a/chart-sdk/react/sankey-diagram/accessibility.md +++ b/chart-sdk/react/sankey-diagram/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Sankey Chart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Sankey Diagram | Syncfusion +description: Learn how the Syncfusion React Sankey Diagram Component supports accessibility with WAI-ARIA, Section 508, WCAG 2.2, and keyboard navigation. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Sankey Chart component +# Accessibility in React Sankey Diagram The Sankey Chart component follows the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22), and relevant [WAI-ARIA](https://www.w3.org/TR/wai-aria#roles) roles. diff --git a/chart-sdk/react/sankey-diagram/appearance.md b/chart-sdk/react/sankey-diagram/appearance.md index c7180bd87..746462216 100644 --- a/chart-sdk/react/sankey-diagram/appearance.md +++ b/chart-sdk/react/sankey-diagram/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React Sankey Chart component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Appearance in React Sankey Diagram | Syncfusion +description: Learn how to customize the appearance of the Syncfusion React Sankey Diagram Component with dimensions, background, border, margin, and theme. control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Sankey Chart component +# Appearance in React Sankey Diagram The Sankey Chart provides comprehensive customization options to control visual appearance, dimensions, responsiveness, colors, borders, and themes. These appearance settings enable you to create diagrams that match your application's design system and user experience requirements. diff --git a/chart-sdk/react/sankey-diagram/customization.md b/chart-sdk/react/sankey-diagram/customization.md index 971337ae0..84470c2af 100644 --- a/chart-sdk/react/sankey-diagram/customization.md +++ b/chart-sdk/react/sankey-diagram/customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Customization in React Sankey Chart component | Syncfusion -description: Learn here all about Customization in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Customization in React Sankey Diagram | Syncfusion +description: Learn how to customize the Syncfusion React Sankey Diagram Component with node and link styling, color mapping, theme, and conditional rendering patterns. control: Customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Customization in React Sankey Chart component +# Customization in React Sankey Diagram The Sankey Chart provides extensive customization options to create visualizations that match your specific design requirements and data presentation needs. From styling and theming to advanced visual techniques, the component enables complete control over appearance and behavior. diff --git a/chart-sdk/react/sankey-diagram/events.md b/chart-sdk/react/sankey-diagram/events.md index aaa70af49..7871398e0 100644 --- a/chart-sdk/react/sankey-diagram/events.md +++ b/chart-sdk/react/sankey-diagram/events.md @@ -1,14 +1,14 @@ --- layout: post -title: Events in React Sankey Chart component | Syncfusion -description: Learn here all about Events in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Events in React Sankey Diagram | Syncfusion +description: Learn how to use events in the Syncfusion React Sankey Diagram Component, including nodeClick, linkClick, load, and loaded event handlers. control: Events platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Events in React Sankey Chart component +# Events in React Sankey Diagram The Sankey Chart provides comprehensive events that allow you to customize behavior, respond to user interactions, and hook into the chart lifecycle. These events enable advanced customization scenarios including data transformation, analytics tracking, and dynamic UI updates. diff --git a/chart-sdk/react/sankey-diagram/getting-started.md b/chart-sdk/react/sankey-diagram/getting-started.md index 379f6a9d8..b6b64e28a 100644 --- a/chart-sdk/react/sankey-diagram/getting-started.md +++ b/chart-sdk/react/sankey-diagram/getting-started.md @@ -1,8 +1,8 @@ --- layout: post -title: Getting started with React Sankey Chart component | Syncfusion -description: Check out and learn about getting started with the React Sankey Chart component of Syncfusion Essential JS 2 and more details. -control: Getting Started +title: Getting Started with React Sankey Diagram | Syncfusion +description: Learn how to get started with the Syncfusion React Sankey Diagram Component. Explore setup, features, examples, and customization options. +control: Getting Started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Getting started with React Sankey Chart component +# Getting Started with React Sankey Diagram This section describes how to integrate the Syncfusion React Sankey Chart component into a new React application. You'll learn about dependencies, installation steps, and how to create your first Sankey Chart visualization. diff --git a/chart-sdk/react/sankey-diagram/labels.md b/chart-sdk/react/sankey-diagram/labels.md index 1896b7f4b..eac4c6eb6 100644 --- a/chart-sdk/react/sankey-diagram/labels.md +++ b/chart-sdk/react/sankey-diagram/labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Labels in React Sankey Chart component | Syncfusion -description: Learn here all about Labels in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Labels in React Sankey Diagram | Syncfusion +description: Learn how to configure and customize labels on nodes and links in the Syncfusion React Sankey Diagram Component using labelSettings. control: Labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Labels in React Sankey Chart component +# Labels in React Sankey Diagram Labels display descriptive text associated with nodes in the Sankey Chart, making the diagram more understandable and interpretable. The Sankey Chart provides comprehensive label customization options including visibility control, font styling, individual label configuration, and dynamic rendering events. diff --git a/chart-sdk/react/sankey-diagram/legend.md b/chart-sdk/react/sankey-diagram/legend.md index 18169733a..a1727f36a 100644 --- a/chart-sdk/react/sankey-diagram/legend.md +++ b/chart-sdk/react/sankey-diagram/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Sankey Chart component | Syncfusion -description: Learn here all about Legend in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Legend in React Sankey Diagram | Syncfusion +description: Learn how to enable and customize the legend in the Syncfusion React Sankey Diagram Component to identify nodes. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Sankey Chart component +# Legend in React Sankey Diagram A legend provides a visual key that helps users understand the categories and meanings represented by nodes in the Sankey Chart. The Sankey Chart provides comprehensive legend configuration options including positioning, styling, customization, and interactive behaviors. You can enable and customize legend using the `legend` property and by injecting the `SankeyLegend` module. diff --git a/chart-sdk/react/sankey-diagram/links.md b/chart-sdk/react/sankey-diagram/links.md index e7bde8274..8df9637bb 100644 --- a/chart-sdk/react/sankey-diagram/links.md +++ b/chart-sdk/react/sankey-diagram/links.md @@ -1,14 +1,14 @@ --- layout: post -title: Links in React Sankey Chart component | Syncfusion -description: Learn here all about Links in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Links in React Sankey Diagram | Syncfusion +description: Learn how to add and customize links in the Syncfusion React Sankey Diagram Component to show flow between nodes with custom color, width, and opacity. control: Links platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Links in React Sankey Chart component +# Links in React Sankey Diagram Links are the connecting paths that visualize flow between nodes in a Sankey Chart. Each link connects a source node to a target node and carries a quantitative value that determines its visual thickness. The Sankey Chart provides comprehensive customization options for link styling, colors, curvature, and interactions. diff --git a/chart-sdk/react/sankey-diagram/nodes.md b/chart-sdk/react/sankey-diagram/nodes.md index 144d39a5e..381bdf621 100644 --- a/chart-sdk/react/sankey-diagram/nodes.md +++ b/chart-sdk/react/sankey-diagram/nodes.md @@ -1,14 +1,14 @@ --- layout: post -title: Nodes in React Sankey Chart component | Syncfusion -description: Learn here all about Nodes in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Nodes in React Sankey Diagram | Syncfusion +description: Learn how to add and customize nodes in the Syncfusion React Sankey Diagram Component with custom color, width, and opacity. control: Nodes platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Nodes in React Sankey Chart component +# Nodes in React Sankey Diagram Nodes are the fundamental building blocks of a Sankey Chart, representing sources, targets, and intermediate entities in flow diagrams. The Sankey Chart provides extensive customization options for node appearance, enabling you to create visually meaningful and interactive flow diagrams. diff --git a/chart-sdk/react/sankey-diagram/orientation-rtl.md b/chart-sdk/react/sankey-diagram/orientation-rtl.md index 1007aa464..e1874a89d 100644 --- a/chart-sdk/react/sankey-diagram/orientation-rtl.md +++ b/chart-sdk/react/sankey-diagram/orientation-rtl.md @@ -1,14 +1,14 @@ --- layout: post -title: Orientation and RTL in React Sankey Chart component | Syncfusion -description: Learn here all about Orientation and RTL in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Orientation and RTL in React Sankey Diagram | Syncfusion +description: Learn how to set the orientation and enable right-to-left rendering on the Syncfusion React Sankey Diagram Component for languages like Arabic and Hebrew. control: Orientation and RTL platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Orientation and RTL in React Sankey Chart component +# Orientation and RTL in React Sankey Diagram The Sankey Chart supports flexible layout options including horizontal and vertical orientations, as well as right-to-left (RTL) rendering for international applications. These features enable you to create localized and directionally appropriate visualizations. diff --git a/chart-sdk/react/sankey-diagram/print-and-export.md b/chart-sdk/react/sankey-diagram/print-and-export.md index 518a9d743..2a40740d5 100644 --- a/chart-sdk/react/sankey-diagram/print-and-export.md +++ b/chart-sdk/react/sankey-diagram/print-and-export.md @@ -1,14 +1,14 @@ --- layout: post -title: Print and Export in React Sankey Chart component | Syncfusion -description: Learn here all about Print and Export in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. +title: Print and Export in React Sankey Diagram | Syncfusion +description: Learn how to print or export the Syncfusion React Sankey Diagram Component to PDF, image, or SVG using the public print and export methods. control: Print and Export platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and Export in React Sankey Chart component +# Print and Export in React Sankey Diagram The Sankey Chart provides comprehensive print and export functionality, enabling users to generate static files in multiple formats (PNG, JPEG, SVG, PDF) or print the diagram directly. This is useful for reports, documentation, sharing, and offline access. diff --git a/chart-sdk/react/sankey-diagram/title-and-sub-title.md b/chart-sdk/react/sankey-diagram/title-and-sub-title.md index c486d41d6..2aabde59f 100644 --- a/chart-sdk/react/sankey-diagram/title-and-sub-title.md +++ b/chart-sdk/react/sankey-diagram/title-and-sub-title.md @@ -1,14 +1,14 @@ --- layout: post -title: Title and Subtitle in React Sankey Chart component | Syncfusion -description: Learn here all about Title and Subtitle in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. -control: Title and Subtitle +title: Title and Subtitle in React Sankey Diagram | Syncfusion +description: Learn how to add and customize a title and subtitle for the Syncfusion React Sankey Diagram Component. +control: Title and subtitle platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title and Subtitle in React Sankey Chart component +# Title and Subtitle in React Sankey Diagram The Sankey Chart supports adding descriptive titles and subtitles to provide context and information about your data visualization. These text elements help users quickly understand the purpose and content of the diagram. You can fully customize the text, styling, alignment, and appearance using dedicated properties. diff --git a/chart-sdk/react/sankey-diagram/tool-tip.md b/chart-sdk/react/sankey-diagram/tool-tip.md index c444cfbae..3f5fe27f3 100644 --- a/chart-sdk/react/sankey-diagram/tool-tip.md +++ b/chart-sdk/react/sankey-diagram/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: ToolTip in React Sankey Chart component | Syncfusion -description: Learn here all about ToolTip in Syncfusion React Sankey Chart component of Syncfusion Essential JS 2 and more. -control: ToolTip +title: Tooltip in React Sankey Diagram | Syncfusion +description: Learn how to enable and customize tooltips in the Syncfusion React Sankey Diagram Component with template and format options. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# ToolTip in React Sankey Chart component +# Tooltip in React Sankey Diagram The Sankey Chart provides tooltips that surface contextual details for hovered elements without cluttering the diagram. Tooltips display additional information when users hover over nodes or links in the Sankey Chart. You can enable and customize tooltips using the `tooltip` property and by injecting the `SankeyTooltip` module. diff --git a/chart-sdk/react/smith-charts/accessibility.md b/chart-sdk/react/smith-chart/accessibility.md similarity index 95% rename from chart-sdk/react/smith-charts/accessibility.md rename to chart-sdk/react/smith-chart/accessibility.md index b621958b9..d74fc9beb 100644 --- a/chart-sdk/react/smith-charts/accessibility.md +++ b/chart-sdk/react/smith-chart/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Smithchart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Smith Chart component | Syncfusion +description: Learn here all about Accessibility in Syncfusion React Smith Chart component of Syncfusion Essential JS 2 and more. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Smithchart component +# Accessibility in React Smith Chart The Smith chart component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/smith-charts/getting-started.md b/chart-sdk/react/smith-chart/getting-started.md similarity index 97% rename from chart-sdk/react/smith-charts/getting-started.md rename to chart-sdk/react/smith-chart/getting-started.md index deb67c70d..e1a4f7f46 100644 --- a/chart-sdk/react/smith-charts/getting-started.md +++ b/chart-sdk/react/smith-chart/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React Smith Chart component | Syncfusion -description: Check out and learn about Getting started with React Smith Chart component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Smith Chart | Syncfusion +description: Learn how to set up a React Smith Chart with Vite, install the Syncfusion Charts package, register modules, and render your first chart. control: Getting Started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting started with React Smith Chart component +# Getting Started with React Smith Chart This section describes the steps to create a simple Smith Chart and demonstrates the basic usage of the Smith Chart component. diff --git a/chart-sdk/react/smith-charts/images/Initial-setup.jpg b/chart-sdk/react/smith-chart/images/Initial-setup.jpg similarity index 100% rename from chart-sdk/react/smith-charts/images/Initial-setup.jpg rename to chart-sdk/react/smith-chart/images/Initial-setup.jpg diff --git a/chart-sdk/react/smith-charts/smithchart-axis.md b/chart-sdk/react/smith-chart/smithchart-axis.md similarity index 93% rename from chart-sdk/react/smith-charts/smithchart-axis.md rename to chart-sdk/react/smith-chart/smithchart-axis.md index 7a2f3c4fa..9378ab8a8 100644 --- a/chart-sdk/react/smith-charts/smithchart-axis.md +++ b/chart-sdk/react/smith-chart/smithchart-axis.md @@ -1,14 +1,14 @@ --- layout: post -title: Smithchart axis in React Smithchart component | Syncfusion -description: Learn here all about Smithchart axis in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Axis in React Smith Chart | Syncfusion +description: Configure horizontal and radial axes in the React Smith Chart, including label position, label intersection handling, gridlines, and axis line styling. control: Smithchart axis platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Smithchart axis in React Smithchart component +# Axis in React Smith Chart Like chart, Smith chart also has support for two types of axis: diff --git a/chart-sdk/react/smith-charts/smithchart-dimensions.md b/chart-sdk/react/smith-chart/smithchart-dimensions.md similarity index 89% rename from chart-sdk/react/smith-charts/smithchart-dimensions.md rename to chart-sdk/react/smith-chart/smithchart-dimensions.md index e7eb462e4..47fd9199f 100644 --- a/chart-sdk/react/smith-charts/smithchart-dimensions.md +++ b/chart-sdk/react/smith-chart/smithchart-dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Smithchart dimensions in React Smithchart component | Syncfusion -description: Learn here all about Smithchart dimensions in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. -control: Smithchart dimensions +title: Dimensions in React Smith Chart | Syncfusion +description: Set the React Smith Chart size to its container, or specify width and height in pixels or percentages for responsive layout control. +control: Smithchart dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Smithchart dimensions in React Smithchart component +# Dimensions in React Smith Chart You can render the Smith chart corresponding to its container size. To set the size for the Smith chart, use the width and height properties. diff --git a/chart-sdk/react/smith-charts/smithchart-legend.md b/chart-sdk/react/smith-chart/smithchart-legend.md similarity index 95% rename from chart-sdk/react/smith-charts/smithchart-legend.md rename to chart-sdk/react/smith-chart/smithchart-legend.md index 988f7def4..766d52a0f 100644 --- a/chart-sdk/react/smith-charts/smithchart-legend.md +++ b/chart-sdk/react/smith-chart/smithchart-legend.md @@ -1,8 +1,8 @@ --- layout: post -title: Smithchart legend in React Smithchart component | Syncfusion -description: Learn here all about Smithchart legend in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. -control: Smithchart legend +title: Legend in React Smith Chart | Syncfusion +description: Add and customize legends in the React Smith Chart with position, alignment, custom coordinates, shape, size, padding, and toggle visibility. +control: Smithchart legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Smithchart legend in React Smithchart component +# Legend in React Smith Chart Legend is a key used in smithchart; it contains symbols and descriptions. The legends provide a valuable information for interpreting what the Smith chart displays. They can be represented in various colors, shapes, or other identifiers based on the data. The legends are used to denote the series rendered in the Smith chart. diff --git a/chart-sdk/react/smith-charts/smithchart-marker.md b/chart-sdk/react/smith-chart/smithchart-marker.md similarity index 94% rename from chart-sdk/react/smith-charts/smithchart-marker.md rename to chart-sdk/react/smith-chart/smithchart-marker.md index 74a272dd7..18c523d3b 100644 --- a/chart-sdk/react/smith-charts/smithchart-marker.md +++ b/chart-sdk/react/smith-chart/smithchart-marker.md @@ -1,7 +1,7 @@ --- layout: post -title: Smithchart marker in React Smithchart component | Syncfusion -description: Learn here all about Smithchart marker in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Marker in React Smith Chart | Syncfusion +description: Enable markers and data labels in the React Smith Chart to highlight data points, with per-series customization of shape, fill, border, and label style. control: Smithchart marker platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Smithchart marker in React Smithchart component +# Marker in React Smith Chart The markers and data labels are used to provide information about the data points in the series. You can add a shape to adorn each data point. By default, both the marker and data label are disabled in Smith chart. You can enable them by setting the visible property to true in marker and data label settings. diff --git a/chart-sdk/react/smith-charts/smithchart-print.md b/chart-sdk/react/smith-chart/smithchart-print.md similarity index 85% rename from chart-sdk/react/smith-charts/smithchart-print.md rename to chart-sdk/react/smith-chart/smithchart-print.md index 78b2ced10..41ab6b649 100644 --- a/chart-sdk/react/smith-charts/smithchart-print.md +++ b/chart-sdk/react/smith-chart/smithchart-print.md @@ -1,14 +1,14 @@ --- layout: post -title: Smithchart print in React Smithchart component | Syncfusion -description: Learn here all about Smithchart print in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Print and Export in React Smith Chart | Syncfusion +description: Print the React Smith Chart from the browser or export it to JPEG, PNG, SVG, or PDF using built-in print and export methods. control: Smithchart print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Smithchart print in React Smithchart component +# Print and Export in React Smith Chart ## Print diff --git a/chart-sdk/react/smith-charts/smithchart-series.md b/chart-sdk/react/smith-chart/smithchart-series.md similarity index 89% rename from chart-sdk/react/smith-charts/smithchart-series.md rename to chart-sdk/react/smith-chart/smithchart-series.md index 7b700288e..ae2eca934 100644 --- a/chart-sdk/react/smith-charts/smithchart-series.md +++ b/chart-sdk/react/smith-chart/smithchart-series.md @@ -1,14 +1,14 @@ --- layout: post -title: Smithchart series in React Smithchart component | Syncfusion -description: Learn here all about Smithchart series in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Series in React Smith Chart | Syncfusion +description: Add one or more series to the React Smith Chart using points or a data source, and customize fill, opacity, width, and smart label placement. control: Smithchart series platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Smithchart series in React Smithchart component +# Series in React Smith Chart You can add any number of series to Smith chart as needed. By using the series setting, you can add or customize the data. For the points and data source added in the series, line can be drawn. You can customize the each series with marker, data label, animation, opacity, and so on. diff --git a/chart-sdk/react/smith-charts/smithchart-tooltip.md b/chart-sdk/react/smith-chart/smithchart-tooltip.md similarity index 78% rename from chart-sdk/react/smith-charts/smithchart-tooltip.md rename to chart-sdk/react/smith-chart/smithchart-tooltip.md index 94ba0a3b8..44fbc46ea 100644 --- a/chart-sdk/react/smith-charts/smithchart-tooltip.md +++ b/chart-sdk/react/smith-chart/smithchart-tooltip.md @@ -1,14 +1,14 @@ --- layout: post -title: Smithchart tooltip in React Smithchart component | Syncfusion -description: Learn here all about Smithchart tooltip in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. -control: Smithchart tooltip +title: Tooltip in React Smith Chart | Syncfusion +description: Enable tooltips on the React Smith Chart by setting tooltip visible to true and injecting the TooltipRender module into services. +control: Smithchart tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Smithchart tooltip in React Smithchart component +# Tooltip in React Smith Chart The tooltip is useful when you cannot display information by using the data labels due to space constraints. You can enable tooltip by setting the [`visible`](https://ej2.syncfusion.com/react/documentation/api/smithchart/seriestooltipmodel#visible) property as `true` in [`tooltip`](https://ej2.syncfusion.com/react/documentation/api/smithchart/smithchartseriesmodel#tooltip) object and by injecting the `TooltipRender` module into the `services`. diff --git a/chart-sdk/react/smith-charts/title-subtitle.md b/chart-sdk/react/smith-chart/title-subtitle.md similarity index 86% rename from chart-sdk/react/smith-charts/title-subtitle.md rename to chart-sdk/react/smith-chart/title-subtitle.md index 2b1c7465e..f470c0228 100644 --- a/chart-sdk/react/smith-charts/title-subtitle.md +++ b/chart-sdk/react/smith-chart/title-subtitle.md @@ -1,14 +1,14 @@ --- layout: post -title: Title subtitle in React Smithchart component | Syncfusion -description: Learn here all about Title subtitle in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. -control: Title subtitle +title: Title and Subtitle in React Smith Chart | Syncfusion +description: Add a title and subtitle to the React Smith Chart, trim overflow with maximum width, and customize font, alignment, and visibility. +control: Title subtitle platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Title subtitle in React Smithchart component +# Title and Subtitle in React Smith Chart ## Enable title diff --git a/chart-sdk/react/smith-charts/working-with-data.md b/chart-sdk/react/smith-chart/working-with-data.md similarity index 82% rename from chart-sdk/react/smith-charts/working-with-data.md rename to chart-sdk/react/smith-chart/working-with-data.md index d7f618139..d996e701a 100644 --- a/chart-sdk/react/smith-charts/working-with-data.md +++ b/chart-sdk/react/smith-chart/working-with-data.md @@ -1,14 +1,14 @@ --- layout: post -title: Working with data in React Smithchart component | Syncfusion -description: Learn here all about Working with data in Syncfusion React Smithchart component of Syncfusion Essential JS 2 and more. +title: Working With Data in React Smith Chart | Syncfusion +description: Bind resistance and reactance data to the React Smith Chart using local JSON arrays as points or as a series data source. control: Working with data platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Working with data in React Smithchart component +# Working With Data in React Smith Chart The Smith chart can visualize the data bound from local data. The data bound for the Smith chart should be an array of object and should contain the field resistance and rectangle. This data should be bound to points or data source in the Smith chart. diff --git a/chart-sdk/react/sparkline/accessibility.md b/chart-sdk/react/sparkline-charts/accessibility.md similarity index 93% rename from chart-sdk/react/sparkline/accessibility.md rename to chart-sdk/react/sparkline-charts/accessibility.md index 12b7f5c77..b14d693a8 100644 --- a/chart-sdk/react/sparkline/accessibility.md +++ b/chart-sdk/react/sparkline-charts/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Sparkline component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Accessibility in React Sparkline Charts | Syncfusion +description: Learn how the Syncfusion React Sparkline Charts meet WCAG 2.2, Section 508, and WAI-ARIA standards, with keyboard, screen reader, and RTL support. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Sparkline component +# Accessibility in React Sparkline Charts The Sparkline component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/sparkline/appearance.md b/chart-sdk/react/sparkline-charts/appearance.md similarity index 92% rename from chart-sdk/react/sparkline/appearance.md rename to chart-sdk/react/sparkline-charts/appearance.md index e24f21e25..1938ba79e 100644 --- a/chart-sdk/react/sparkline/appearance.md +++ b/chart-sdk/react/sparkline-charts/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React Sparkline component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Appearance in React Sparkline Charts | Syncfusion +description: Customize the Syncfusion React Sparkline Charts appearance with border, padding, container area background, and built-in Material, Fabric, Bootstrap themes. control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Sparkline component +# Appearance in React Sparkline Charts The appearance of the sparkline can be customized using margin, container Area border, and container Area background. diff --git a/chart-sdk/react/sparkline/axis-customization.md b/chart-sdk/react/sparkline-charts/axis-customization.md similarity index 93% rename from chart-sdk/react/sparkline/axis-customization.md rename to chart-sdk/react/sparkline-charts/axis-customization.md index 16a459419..088922509 100644 --- a/chart-sdk/react/sparkline/axis-customization.md +++ b/chart-sdk/react/sparkline-charts/axis-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis customization in React Sparkline component | Syncfusion -description: Learn here all about Axis customization in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Axis Customization in React Sparkline Charts | Syncfusion +description: Customize the Syncfusion React Sparkline Charts axis with Numeric, Category, or DateTime value types, min/max bounds, line color, width, and dash array. control: Axis customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in React Sparkline component +# Axis Customization in React Sparkline Charts You can customize axis value types and min and max values of the sparkline. diff --git a/chart-sdk/react/sparkline/data-labels.md b/chart-sdk/react/sparkline-charts/data-labels.md similarity index 90% rename from chart-sdk/react/sparkline/data-labels.md rename to chart-sdk/react/sparkline-charts/data-labels.md index 5dd228457..2550a17a6 100644 --- a/chart-sdk/react/sparkline/data-labels.md +++ b/chart-sdk/react/sparkline-charts/data-labels.md @@ -1,14 +1,14 @@ --- layout: post -title: Data labels in React Sparkline component | Syncfusion -description: Learn here all about Data labels in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Data Labels in React Sparkline Charts | Syncfusion +description: Display point values on the Syncfusion React Sparkline Charts by enabling data labels for all, start, end, high, low, or negative points with custom formatting. control: Data labels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data labels in React Sparkline component +# Data Labels in React Sparkline Charts Data labels are used to display values of data points to improve the readability. diff --git a/chart-sdk/react/sparkline/ej1-api-migration.md b/chart-sdk/react/sparkline-charts/ej1-api-migration.md similarity index 99% rename from chart-sdk/react/sparkline/ej1-api-migration.md rename to chart-sdk/react/sparkline-charts/ej1-api-migration.md index b6fb01acd..e1fad4886 100644 --- a/chart-sdk/react/sparkline/ej1-api-migration.md +++ b/chart-sdk/react/sparkline-charts/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Sparkline component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. -control: Ej1 api migration +title: Migration from Essential JS 1 in React Sparkline Charts | Syncfusion +description: Map Essential JS 1 Syncfusion React Sparkline Charts properties, methods, and events to their Essential JS 2 equivalents for quick API migration. +control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Sparkline component +# Migration from Essential JS 1 in React Sparkline Charts This article describes the API migration process of Accordion component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/sparkline/getting-started.md b/chart-sdk/react/sparkline-charts/getting-started.md similarity index 96% rename from chart-sdk/react/sparkline/getting-started.md rename to chart-sdk/react/sparkline-charts/getting-started.md index 5ace451d4..a19e9d40a 100644 --- a/chart-sdk/react/sparkline/getting-started.md +++ b/chart-sdk/react/sparkline-charts/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting started with React Sparkline component | Syncfusion -description: Checkout and learn about Getting started with React Sparkline component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React Sparkline Charts | Syncfusion +description: Learn how to get started with the Syncfusion React Sparkline Charts control. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting started with React Sparkline component +# Getting Started with React Sparkline Charts This section describes the steps to create a simple Sparkline and demonstrates the basic usage of the Sparkline component. diff --git a/chart-sdk/react/sparkline/localization.md b/chart-sdk/react/sparkline-charts/localization.md similarity index 77% rename from chart-sdk/react/sparkline/localization.md rename to chart-sdk/react/sparkline-charts/localization.md index 106f187ba..1054b93ad 100644 --- a/chart-sdk/react/sparkline/localization.md +++ b/chart-sdk/react/sparkline-charts/localization.md @@ -1,14 +1,14 @@ --- layout: post -title: Localization in React Sparkline component | Syncfusion -description: Learn here all about Localization in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Localization in React Sparkline Charts | Syncfusion +description: Localize the Syncfusion React Sparkline Charts tooltip and values by changing the culture with the setCulture method for region-specific formats. control: Localization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Localization in React Sparkline component +# Localization in React Sparkline Charts The sparkline control supports localization. The default culture for localization is `en-US`. You can change the culture using the `setCulture` method. diff --git a/chart-sdk/react/sparkline/marker.md b/chart-sdk/react/sparkline-charts/marker.md similarity index 90% rename from chart-sdk/react/sparkline/marker.md rename to chart-sdk/react/sparkline-charts/marker.md index ef2bbf55d..94cc41c97 100644 --- a/chart-sdk/react/sparkline/marker.md +++ b/chart-sdk/react/sparkline-charts/marker.md @@ -1,14 +1,14 @@ --- layout: post -title: Marker in React Sparkline component | Syncfusion -description: Learn here all about Marker in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Markers in React Sparkline Charts | Syncfusion +description: Add markers to the Syncfusion React Sparkline Charts for all, start, end, high, low, or negative points and customize their fill, border, size, and opacity. control: Marker platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Marker in React Sparkline component +# Markers in React Sparkline Charts This section explains how to add markers to the sparkline. diff --git a/chart-sdk/react/sparkline/range-band.md b/chart-sdk/react/sparkline-charts/range-band.md similarity index 84% rename from chart-sdk/react/sparkline/range-band.md rename to chart-sdk/react/sparkline-charts/range-band.md index 2e5f0925e..4a12acc29 100644 --- a/chart-sdk/react/sparkline/range-band.md +++ b/chart-sdk/react/sparkline-charts/range-band.md @@ -1,14 +1,14 @@ --- layout: post -title: Range band in React Sparkline component | Syncfusion -description: Learn here all about Range band in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Range Band in React Sparkline Charts | Syncfusion +description: Highlight specific y-axis value regions in the Syncfusion React Sparkline Charts using one or multiple range bands with custom start, end, color, and opacity. control: Range band platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Range band in React Sparkline component +# Range Band in React Sparkline Charts This section explains how to customize the sparkline with multiple range bands. diff --git a/chart-sdk/react/sparkline/sparkline-dimensions.md b/chart-sdk/react/sparkline-charts/sparkline-dimensions.md similarity index 83% rename from chart-sdk/react/sparkline/sparkline-dimensions.md rename to chart-sdk/react/sparkline-charts/sparkline-dimensions.md index 245f24d65..308fffa06 100644 --- a/chart-sdk/react/sparkline/sparkline-dimensions.md +++ b/chart-sdk/react/sparkline-charts/sparkline-dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Sparkline dimensions in React Sparkline component | Syncfusion -description: Learn here all about Sparkline dimensions in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. -control: Sparkline dimensions +title: Dimensions in React Sparkline Charts | Syncfusion +description: Set the Syncfusion React Sparkline Charts size via container, CSS, or direct width and height properties in pixel or percentage for responsive layouts. +control: Sparkline dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Sparkline dimensions in React Sparkline component +# Dimensions in React Sparkline Charts ## Size for container @@ -36,7 +36,7 @@ Sparkline can be rendered to its container size. You can set the size through in -You can also set the size for sparkline directly using the [`width`](../sparkline/#width-string) and [`height`](https://ej2.syncfusion.com/react/documentation/api/sparkline/#height-string) properties. +You can also set the size for sparkline directly using the [`width`](../sparkline#width-string) and [`height`](https://ej2.syncfusion.com/react/documentation/api/sparkline#height-string) properties. **In pixel** diff --git a/chart-sdk/react/sparkline/sparkline-types.md b/chart-sdk/react/sparkline-charts/sparkline-types.md similarity index 93% rename from chart-sdk/react/sparkline/sparkline-types.md rename to chart-sdk/react/sparkline-charts/sparkline-types.md index 2e522e119..388d28a12 100644 --- a/chart-sdk/react/sparkline/sparkline-types.md +++ b/chart-sdk/react/sparkline-charts/sparkline-types.md @@ -1,14 +1,14 @@ --- layout: post -title: Sparkline types in React Sparkline component | Syncfusion -description: Learn here all about Sparkline types in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Sparkline Types in React Sparkline Charts | Syncfusion +description: Render data with the Syncfusion React Sparkline Charts using line, column, area, win-loss, or pie types to visualize trends, comparisons, and composition. control: Sparkline types platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Sparkline types in React Sparkline component +# Sparkline Types in React Sparkline Charts Different shapes can be used to visualize data in a Sparkline component. You can change the Sparkline type using the [`type`](https://ej2.syncfusion.com/react/documentation/api/sparkline/sparklinemodel#type) property. diff --git a/chart-sdk/react/sparkline/special-points-customization.md b/chart-sdk/react/sparkline-charts/special-points-customization.md similarity index 84% rename from chart-sdk/react/sparkline/special-points-customization.md rename to chart-sdk/react/sparkline-charts/special-points-customization.md index 76cc33d34..470b212b0 100644 --- a/chart-sdk/react/sparkline/special-points-customization.md +++ b/chart-sdk/react/sparkline-charts/special-points-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Special points customization in React Sparkline component | Syncfusion -description: Learn here all about Special points customization in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: Special Points Customization in React Sparkline Charts | Syncfusion +description: Customize the start, end, positive, negative, low, and tie point colors in the Syncfusion React Sparkline Charts for line, column, and area types. control: Special points customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Special points customization in React Sparkline component +# Special Points Customization in React Sparkline Charts You can customize the points by initializing the point colors. The customization options allows to differentiate the [`start`], [`end`], [`positive`], [`negative`], and [`low`] points. This customization is only applicable for line, column, and area type sparklines. diff --git a/chart-sdk/react/sparkline/user-interaction.md b/chart-sdk/react/sparkline-charts/user-interaction.md similarity index 95% rename from chart-sdk/react/sparkline/user-interaction.md rename to chart-sdk/react/sparkline-charts/user-interaction.md index d4b54de96..fa5ff9b95 100644 --- a/chart-sdk/react/sparkline/user-interaction.md +++ b/chart-sdk/react/sparkline-charts/user-interaction.md @@ -1,14 +1,14 @@ --- layout: post -title: User interaction in React Sparkline component | Syncfusion -description: Learn here all about User interaction in Syncfusion React Sparkline component of Syncfusion Essential JS 2 and more. +title: User Interaction in React Sparkline Charts | Syncfusion +description: Enable hover tooltips with custom format and template, plus track lines, on the Syncfusion React Sparkline Charts to highlight nearby data points. control: User interaction platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# User interaction in React Sparkline component +# User Interaction in React Sparkline Charts Sparkline has two user interaction features: tooltip and tracker line. diff --git a/chart-sdk/react/stock-charts/accessibility.md b/chart-sdk/react/stock-charts/accessibility.md index 256d03206..47bbb9c96 100644 --- a/chart-sdk/react/stock-charts/accessibility.md +++ b/chart-sdk/react/stock-charts/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React Stock chart component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Accessibility +title: Accessibility in React Stock Charts | Syncfusion +description: Learn how the Syncfusion React Stock Charts Component supports accessibility with WAI-ARIA, Section 508, WCAG 2.2, and keyboard navigation. +control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React Stock chart component +# Accessibility in React Stock Charts The Stock chart component followed the accessibility guidelines and standards, including [ADA](https://www.ada.gov), [Section 508](https://www.section508.gov), [WCAG 2.2](https://www.w3.org/TR/WCAG22) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria#roles) that are commonly used to evaluate accessibility. diff --git a/chart-sdk/react/stock-charts/appearance.md b/chart-sdk/react/stock-charts/appearance.md index 0dbf69595..80ddde1ae 100644 --- a/chart-sdk/react/stock-charts/appearance.md +++ b/chart-sdk/react/stock-charts/appearance.md @@ -1,14 +1,14 @@ --- layout: post -title: Appearance in React Stock chart component | Syncfusion -description: Learn here all about Appearance in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Appearance +title: Appearance in React Stock Charts | Syncfusion +description: Learn how to customize the appearance of the Syncfusion React Stock Charts Component with custom title and theme. +control: Appearance platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in React Stock chart component +# Appearance in React Stock Charts ## Stock Chart Title diff --git a/chart-sdk/react/stock-charts/axis-customization.md b/chart-sdk/react/stock-charts/axis-customization.md index 30b4a5b22..5bdbaeff1 100644 --- a/chart-sdk/react/stock-charts/axis-customization.md +++ b/chart-sdk/react/stock-charts/axis-customization.md @@ -1,14 +1,14 @@ --- layout: post -title: Axis customization in React Stock chart component | Syncfusion -description: Learn here all about Axis customization in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Axis Customization in React Stock Charts | Syncfusion +description: Learn how to customize the axes in the Syncfusion React Stock Charts Component with titles, tick lines, grid lines, and opposed position options. control: Axis customization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in React Stock chart component +# Axis Customization in React Stock Charts ## Axis Crossing diff --git a/chart-sdk/react/stock-charts/axis-types.md b/chart-sdk/react/stock-charts/axis-types.md index c6bde71ba..703696b74 100644 --- a/chart-sdk/react/stock-charts/axis-types.md +++ b/chart-sdk/react/stock-charts/axis-types.md @@ -1,7 +1,7 @@ --- layout: post -title: Axis types in React Stock chart component | Syncfusion -description: Learn here all about Axis types in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Axis Types in React Stock Charts | Syncfusion +description: Learn how to use datetime and logarithmic axis types in the Syncfusion React Stock Charts Component for plotting financial time-series data. control: Axis types platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis types in React Stock chart component +# Axis Types in React Stock Charts ## DateTime axis diff --git a/chart-sdk/react/stock-charts/chart-dimensions.md b/chart-sdk/react/stock-charts/chart-dimensions.md index 90ead70ed..e142aac8f 100644 --- a/chart-sdk/react/stock-charts/chart-dimensions.md +++ b/chart-sdk/react/stock-charts/chart-dimensions.md @@ -1,14 +1,14 @@ --- layout: post -title: Chart dimensions in React Stock chart component | Syncfusion -description: Learn here all about Chart dimensions in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Chart Dimensions in React Stock Charts | Syncfusion +description: Learn how to set the Syncfusion React Stock Charts Component size to a fixed container or a custom width and height using CSS or inline style. control: Chart dimensions platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Chart dimensions in React Stock chart component +# Chart Dimensions in React Stock Charts ## Size for Container diff --git a/chart-sdk/react/stock-charts/cross-hair.md b/chart-sdk/react/stock-charts/cross-hair.md index 87f2d0d04..908eaeb06 100644 --- a/chart-sdk/react/stock-charts/cross-hair.md +++ b/chart-sdk/react/stock-charts/cross-hair.md @@ -1,14 +1,14 @@ --- layout: post -title: Cross hair in React Stock chart component | Syncfusion -description: Learn here all about Cross hair in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Cross hair +title: Crosshair in React Stock Charts | Syncfusion +description: Learn how to enable crosshair on the Syncfusion React Stock Charts Component to show vertical and horizontal lines at the cursor position. +control: Cross hair platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Cross hair in React Stock chart component +# Crosshair in React Stock Charts Crosshair has a vertical and horizontal line to view the value of the axis at mouse or touch position. diff --git a/chart-sdk/react/stock-charts/export-print.md b/chart-sdk/react/stock-charts/export-print.md index 19f6e3cbe..5f7886671 100644 --- a/chart-sdk/react/stock-charts/export-print.md +++ b/chart-sdk/react/stock-charts/export-print.md @@ -1,14 +1,14 @@ --- layout: post -title: Export print in React Stock chart component | Syncfusion -description: Learn here all about Export print in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Export and Print in React Stock Charts | Syncfusion +description: Learn how to export and print the Syncfusion React Stock Charts Component to PDF, image, or SVG using the public export and print methods. control: Export print platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Export print in React Stock chart component +# Export and Print in React Stock Charts The rendered stock chart can be exported to `JPEG`, `PNG`, `SVG`, or `PDF` format using the export dropdown button in the period selector toolbar. You can choose the required format using the export dropdown button in stock-chart. diff --git a/chart-sdk/react/stock-charts/getting-started.md b/chart-sdk/react/stock-charts/getting-started.md index fbe855336..525ab3bae 100644 --- a/chart-sdk/react/stock-charts/getting-started.md +++ b/chart-sdk/react/stock-charts/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with React Stock Chart Component | Syncfusion -description: Check out and learn about getting started with Syncfusion Essential React Stock Chart component, its elements, and more details. +title: Getting Started with React Stock Charts | Syncfusion +description: Learn how to get started with the Syncfusion React Stock Charts Component. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React Stock Chart Component +# Getting Started with React Stock Charts This section describes the steps to create a simple Stock Chart component. diff --git a/chart-sdk/react/stock-charts/gradient.md b/chart-sdk/react/stock-charts/gradient.md index 722d2062a..a36a899e6 100644 --- a/chart-sdk/react/stock-charts/gradient.md +++ b/chart-sdk/react/stock-charts/gradient.md @@ -1,7 +1,7 @@ --- layout: post -title: Gradient in React Stock chart component | Syncfusion -description: Learn here all about Gradient in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Gradient in React Stock Charts | Syncfusion +description: Learn how to apply linear and radial gradients to the Syncfusion React Stock Charts Component series and indicators for richer visual styling. control: Gradient platform: chart-sdk documentation: ug @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Gradient in React Stock chart control +# Gradient in React Stock Charts diff --git a/chart-sdk/react/stock-charts/legend.md b/chart-sdk/react/stock-charts/legend.md index 0cdbbd39b..a2c514cf6 100644 --- a/chart-sdk/react/stock-charts/legend.md +++ b/chart-sdk/react/stock-charts/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Stock chart component | Syncfusion -description: Learn here all about Legend in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Legend in React Stock Charts | Syncfusion +description: Learn how to enable the legend in the Syncfusion React Stock Charts Component to identify each series, with options for position, shape, and paging. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Stock chart component +# Legend in React Stock Charts Legend provides information about the series rendered in the Stock Chart. Legend can be added to a Stock Chart by enabling the [`visible`](https://ej2.syncfusion.com/react/documentation/api/stock-chart/legendSettings#visible) option in the [`legendSettings`](https://ej2.syncfusion.com/react/documentation/api/stock-chart/legendSettings). diff --git a/chart-sdk/react/stock-charts/period-selector.md b/chart-sdk/react/stock-charts/period-selector.md index 2d1503ffb..c7668ce64 100644 --- a/chart-sdk/react/stock-charts/period-selector.md +++ b/chart-sdk/react/stock-charts/period-selector.md @@ -1,14 +1,14 @@ --- layout: post -title: Period selector in React Stock chart component | Syncfusion -description: Learn here all about Period selector in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Period Selector in React Stock Charts | Syncfusion +description: Learn how to add a period selector to the Syncfusion React Stock Charts Component for quick presets. control: Period selector platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Period selector in React Stock chart component +# Period Selector in React Stock Charts The period selector allows to select a range with specified periods. By default the period selector is enabled in stock chart. diff --git a/chart-sdk/react/stock-charts/range-selector.md b/chart-sdk/react/stock-charts/range-selector.md index ac2e07a51..88f392949 100644 --- a/chart-sdk/react/stock-charts/range-selector.md +++ b/chart-sdk/react/stock-charts/range-selector.md @@ -1,14 +1,14 @@ --- layout: post -title: Range selector in React Stock chart component | Syncfusion -description: Learn here all about Range selector in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Range Selector in React Stock Charts | Syncfusion +description: Learn how to enable the range selector on the Syncfusion React Stock Charts Component to select a range by dragging thumbs, tapping labels, or using a date range. control: Range selector platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Range selector in React Stock chart component +# Range Selector in React Stock Charts The left and right thumb of RangeNavigator are used to indicate the selected range in the large collection of data. Following are the ways you can select a range. diff --git a/chart-sdk/react/stock-charts/series-types.md b/chart-sdk/react/stock-charts/series-types.md index 67836c664..9fd2d517f 100644 --- a/chart-sdk/react/stock-charts/series-types.md +++ b/chart-sdk/react/stock-charts/series-types.md @@ -1,14 +1,14 @@ --- layout: post -title: Series types in React Stock chart component | Syncfusion -description: Learn here all about Series types in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Series types +title: Series Types in React Stock Charts | Syncfusion +description: Learn how to render line, candle, OHLC, HLC, area, and spline series in the Syncfusion React Stock Charts Component for financial data. +control: Series types platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Series types in React Stock chart component +# Series Types in React Stock Charts Essential® JS 2 StockChart supports 6 major types of series namely `Line`, `Spline`, `Hilo`, `HiloOpenClose`, `Hollow Candle` and `Candle` . By using the series dropdown button you can navigate between the above listed series types. diff --git a/chart-sdk/react/stock-charts/stock-events.md b/chart-sdk/react/stock-charts/stock-events.md index 622e2a675..24a7b44a3 100644 --- a/chart-sdk/react/stock-charts/stock-events.md +++ b/chart-sdk/react/stock-charts/stock-events.md @@ -1,7 +1,7 @@ --- layout: post -title: Stock events in React Stock chart component | Syncfusion -description: Learn here all about Stock events in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Stock Events in React Stock Charts | Syncfusion +description: Learn how to add stock events to the Syncfusion React Stock Charts Component to mark specific data points with custom values and limit them to a particular series. control: Stock events platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Stock events in React Stock chart component +# Stock Events in React Stock Charts Stock Events visualizes stock events in stock chart. 'SplineSeries' is used to represent selected data value. You can customize the specific data value using `stockEvents` event. diff --git a/chart-sdk/react/stock-charts/technical-indicators.md b/chart-sdk/react/stock-charts/technical-indicators.md index f6e07d98c..708666eba 100644 --- a/chart-sdk/react/stock-charts/technical-indicators.md +++ b/chart-sdk/react/stock-charts/technical-indicators.md @@ -1,15 +1,15 @@ --- layout: post -title: Technical indicators in React Stock chart component | Syncfusion -description: Learn here all about Technical indicators in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Technical indicators +title: Technical Indicators in React Stock Charts | Syncfusion +description: Learn how to add technical indicators to the Syncfusion React Stock Charts Component, including SMA, EMA, RSI, MACD, and Bollinger Bands. +control: Technical indicators platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Technical indicators in React Stock chart component +# Technical Indicators in React Stock Charts A technical indicator is a mathematical calculation based on historic price, volume or open interest information that aims to forecast financial market direction. diff --git a/chart-sdk/react/stock-charts/tool-tip.md b/chart-sdk/react/stock-charts/tool-tip.md index 028a1df52..8f5d90915 100644 --- a/chart-sdk/react/stock-charts/tool-tip.md +++ b/chart-sdk/react/stock-charts/tool-tip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tool tip in React Stock chart component | Syncfusion -description: Learn here all about Tool tip in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Tool tip +title: Tooltip in React Stock Charts | Syncfusion +description: Learn how to enable and customize tooltips on the Syncfusion React Stock Charts Component with template, and shared tooltip options. +control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tool tip in React Stock chart component +# Tooltip in React Stock Charts diff --git a/chart-sdk/react/stock-charts/trend-lines.md b/chart-sdk/react/stock-charts/trend-lines.md index e51ee7984..d0baea4a8 100644 --- a/chart-sdk/react/stock-charts/trend-lines.md +++ b/chart-sdk/react/stock-charts/trend-lines.md @@ -1,15 +1,15 @@ --- layout: post -title: Trend lines in React Stock chart component | Syncfusion -description: Learn here all about Trend lines in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. -control: Trend lines +title: Trendlines in React Stock Charts | Syncfusion +description: Learn how to add trendlines to the Syncfusion React Stock Charts Component to show the direction and speed of a price trend over time. +control: Trendlines platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Trend lines in React Stock chart component +# Trendlines in React Stock Charts Trendlines are used to show the direction and speed of price. diff --git a/chart-sdk/react/stock-charts/working-with-data.md b/chart-sdk/react/stock-charts/working-with-data.md index 68450b8a2..2545b78ee 100644 --- a/chart-sdk/react/stock-charts/working-with-data.md +++ b/chart-sdk/react/stock-charts/working-with-data.md @@ -1,7 +1,7 @@ --- layout: post -title: Working with data in React Stock chart component | Syncfusion -description: Learn here all about Working with data in Syncfusion React Stock chart component of Syncfusion Essential JS 2 and more. +title: Working with Data in React Stock Charts | Syncfusion +description: Learn how to bind JSON data to the Syncfusion React Stock Charts Component by mapping fields to date, open, high, low, and close. control: Working with data platform: chart-sdk documentation: ug @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Working with data in React Stock chart component +# Working with Data in React Stock Charts Stock Chart can visualizes data bound from local or remote data. diff --git a/chart-sdk/react/treemap/accessibility.md b/chart-sdk/react/treemap/accessibility.md index 556ceca1b..80c9caf59 100644 --- a/chart-sdk/react/treemap/accessibility.md +++ b/chart-sdk/react/treemap/accessibility.md @@ -1,14 +1,14 @@ --- layout: post -title: Accessibility in React TreeMap component | Syncfusion -description: Learn here all about Accessibility in Syncfusion React TreeMap component of Syncfusion Essential JS 2 and more. +title: Accessibility in React TreeMap | Syncfusion +description: Learn how the Syncfusion React TreeMap meets WCAG 2.2, Section 508, ADA, and keyboard navigation accessibility standards. control: Accessibility platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in React TreeMap component +# Accessibility in React TreeMap The TreeMap component follows commonly used accessibility guidelines and standards, such as [ADA](https://www.ada.gov/), [Section 508](https://www.section508.gov/), [WCAG 2.2](https://www.w3.org/TR/WCAG22/) standards, and [WCAG roles](https://www.w3.org/TR/wai-aria/#roles). diff --git a/chart-sdk/react/treemap/color-mapping.md b/chart-sdk/react/treemap/color-mapping.md index 2a5802217..ad725aad5 100644 --- a/chart-sdk/react/treemap/color-mapping.md +++ b/chart-sdk/react/treemap/color-mapping.md @@ -1,14 +1,14 @@ --- layout: post -title: Color mapping in React Treemap component | Syncfusion -description: Learn here all about Color mapping in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Color Mapping in React TreeMap | Syncfusion +description: Learn how to apply color mapping in the Syncfusion React TreeMap using range, equal, desaturation, and palette modes for items. control: Color mapping platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Color mapping in React Treemap component +# Color Mapping in React TreeMap ## Apply color mapping diff --git a/chart-sdk/react/treemap/data-binding.md b/chart-sdk/react/treemap/data-binding.md index 15ac8ca71..8cb5a38d6 100644 --- a/chart-sdk/react/treemap/data-binding.md +++ b/chart-sdk/react/treemap/data-binding.md @@ -1,20 +1,20 @@ --- layout: post -title: Data binding in React Treemap component | Syncfusion -description: Learn here all about Data binding in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Data Binding in React TreeMap | Syncfusion +description: Learn how to bind flat or hierarchical data sources to the Syncfusion React TreeMap using the dataSource property. control: Data binding platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data binding in React Treemap component +# Data Binding in React TreeMap The TreeMap control supports data binding using the dataSource property. ## Populate data -The [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/treemap/#datasource) property accepts collection values as input. For example, a list of objects can be provided as input. Data can be given as either flat or hierarchical collection to the [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/treemap/#datasource) property. +The [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/treemap#datasource) property accepts collection values as input. For example, a list of objects can be provided as input. Data can be given as either flat or hierarchical collection to the [`dataSource`](https://ej2.syncfusion.com/react/documentation/api/treemap#datasource) property. diff --git a/chart-sdk/react/treemap/data-label.md b/chart-sdk/react/treemap/data-label.md index a2870bcc8..cffa528a2 100644 --- a/chart-sdk/react/treemap/data-label.md +++ b/chart-sdk/react/treemap/data-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Data label in React Treemap component | Syncfusion -description: Learn here all about Data label in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Data Label in React TreeMap | Syncfusion +description: Learn how to show and format data labels on items and groups in the Syncfusion React TreeMap with labelPath and labelFormat. control: Data label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data label in React Treemap component +# Data Label in React TreeMap Data Labels are used to identify the name of items or groups in the TreeMap component. Data Labels will be shown by specifying the data source properties in the [`labelPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/leafItemSettingsModel#labelpath) of the [`leafItemSettings`](https://ej2.syncfusion.com/react/documentation/api/treemap#leafitemsettings). diff --git a/chart-sdk/react/treemap/drilldown.md b/chart-sdk/react/treemap/drilldown.md index ff540ebf4..3950052f4 100644 --- a/chart-sdk/react/treemap/drilldown.md +++ b/chart-sdk/react/treemap/drilldown.md @@ -1,14 +1,14 @@ --- layout: post -title: Drilldown in React Treemap component | Syncfusion -description: Learn here all about Drilldown in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Drilldown in React TreeMap | Syncfusion +description: Learn how to enable drill-down in the Syncfusion React TreeMap to navigate hierarchical data by clicking items. control: Drilldown platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Drilldown in React Treemap component +# Drilldown in React TreeMap The TreeMap supports drill-down to expose the hierarchy, achieved by clicking a node. If an item is clicked in the TreeMap, it will be moved to the next level or sub level hierarchy and returned back to the previous level by clicking the node. diff --git a/chart-sdk/react/treemap/ej1-api-migration.md b/chart-sdk/react/treemap/ej1-api-migration.md index 8119d0b2e..328f2645d 100644 --- a/chart-sdk/react/treemap/ej1-api-migration.md +++ b/chart-sdk/react/treemap/ej1-api-migration.md @@ -1,14 +1,14 @@ --- layout: post -title: Ej1 api migration in React Treemap component | Syncfusion -description: Learn here all about Ej1 api migration in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Migration from EJ1 in React TreeMap | Syncfusion +description: Migrate apps from Syncfusion Essential JS 1 to the React TreeMap with the equivalent EJ2 API mapping for properties and events. control: Ej1 api migration platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Ej1 api migration in React Treemap component +# Migration from EJ1 in React TreeMap This article describes the API migration process of Accordion component from Essential® JS 1 to Essential® JS 2. diff --git a/chart-sdk/react/treemap/getting-started.md b/chart-sdk/react/treemap/getting-started.md index 859014524..c54f83c05 100644 --- a/chart-sdk/react/treemap/getting-started.md +++ b/chart-sdk/react/treemap/getting-started.md @@ -1,14 +1,14 @@ --- layout: post -title: Getting Started with React TreeMap component | Syncfusion -description: Checkout and learn about getting started with the React TreeMap component of Syncfusion Essential JS 2 and more details. +title: Getting Started with React TreeMap | Syncfusion +description: Learn how to get started with the Syncfusion React TreeMap control. Explore setup, features, examples, and customization options. control: Getting started platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with React TreeMap Component +# Getting Started with React TreeMap This document explains the steps required to create and render a TreeMap component and demonstrates the component's basic usage. diff --git a/chart-sdk/react/treemap/how-to/drilldown-with-label.md b/chart-sdk/react/treemap/how-to/drilldown-with-label.md index ae264b353..9ac26ce02 100644 --- a/chart-sdk/react/treemap/how-to/drilldown-with-label.md +++ b/chart-sdk/react/treemap/how-to/drilldown-with-label.md @@ -1,14 +1,14 @@ --- layout: post -title: Drilldown with label in React Treemap component | Syncfusion -description: Learn here all about Drilldown with label in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: How to drilldown with label in React TreeMap | Syncfusion +description: Learn how to add a label template to nodes on drill-down in the Syncfusion React TreeMap using a div template. control: Drilldown with label platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Drilldown with label in React Treemap component +# How to drilldown with label in React TreeMap Yon can add a label template as
element to the treemap control when using the label template. To add a label template to the tree map control, you have to hide another labels by setting the `showLabels` property to **false** in `leafItemSettings` to show only the label template. diff --git a/chart-sdk/react/treemap/how-to/drilldown.md b/chart-sdk/react/treemap/how-to/drilldown.md index c197d5ba3..3326c436d 100644 --- a/chart-sdk/react/treemap/how-to/drilldown.md +++ b/chart-sdk/react/treemap/how-to/drilldown.md @@ -1,14 +1,14 @@ --- layout: post -title: Drilldown customization in React Treemap component | Syncfusion -description: Learn here all about Drilldown customization in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: How to customize drilldown in React TreeMap | Syncfusion +description: Learn how to customize the header on drill-down in the Syncfusion React TreeMap to show population details for a node. control: Drilldown platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Drilldown customization in React Treemap component +# How to customize drilldown in React TreeMap ## Customize the header for treemap drilldown diff --git a/chart-sdk/react/treemap/internationalization.md b/chart-sdk/react/treemap/internationalization.md index 1f46c458d..a0b3dbe67 100644 --- a/chart-sdk/react/treemap/internationalization.md +++ b/chart-sdk/react/treemap/internationalization.md @@ -1,14 +1,14 @@ --- layout: post -title: Internationalization in React Treemap component | Syncfusion -description: Learn here all about Internationalization in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Internationalization in React TreeMap | Syncfusion +description: Learn how to globalize data labels and tooltips in the Syncfusion React TreeMap using the format property and locale support. control: Internationalization platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Internationalization in React Treemap component +# Internationalization in React TreeMap The TreeMap control supports internationalization for the following elements: @@ -21,7 +21,7 @@ For more information about number and date formatter, refer to [`internationaliz ## Globalization -Globalization is the process of designing and developing a component that works in different cultures/locales. Internationalization library is used to globalize number, date, and time values in the TreeMap control using the [`format`](https://ej2.syncfusion.com/react/documentation/api/treemap/#format) property in the TreeMap. +Globalization is the process of designing and developing a component that works in different cultures/locales. Internationalization library is used to globalize number, date, and time values in the TreeMap control using the [`format`](https://ej2.syncfusion.com/react/documentation/api/treemap#format) property in the TreeMap. **Numeric format** diff --git a/chart-sdk/react/treemap/layout.md b/chart-sdk/react/treemap/layout.md index a1963c875..735029719 100644 --- a/chart-sdk/react/treemap/layout.md +++ b/chart-sdk/react/treemap/layout.md @@ -1,16 +1,16 @@ --- layout: post -title: Layout in React Treemap component | Syncfusion -description: Learn here all about Layout in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Layout in React TreeMap | Syncfusion +description: Learn how to render the Syncfusion React TreeMap with Squarified, SliceAndDiceVertical, SliceAndDiceHorizontal, or SliceAndDiceAuto layouts. control: Layout platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Layout in React Treemap component +# Layout in React TreeMap -Determine the visual representation of nodes belonging to all the TreeMap levels using the [`layoutType`](https://ej2.syncfusion.com/react/documentation/api/treemap/#layouttype) property. +Determine the visual representation of nodes belonging to all the TreeMap levels using the [`layoutType`](https://ej2.syncfusion.com/react/documentation/api/treemap#layouttype) property. ## Types of layout diff --git a/chart-sdk/react/treemap/leaf-item.md b/chart-sdk/react/treemap/leaf-item.md index e1a2f59b7..a13455356 100644 --- a/chart-sdk/react/treemap/leaf-item.md +++ b/chart-sdk/react/treemap/leaf-item.md @@ -1,14 +1,14 @@ --- layout: post -title: Leaf item in React Treemap component | Syncfusion -description: Learn here all about Leaf item in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Leaf Item in React TreeMap | Syncfusion +description: Learn how to configure leaf items, labels, and styles in the Syncfusion React TreeMap using leafItemSettings. control: Leaf item platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Leaf item in React Treemap component +# Leaf Item in React TreeMap A leaf item defines a visualized data element and does not contain child nodes but contains parent node if the levels are specified in the TreeMap. diff --git a/chart-sdk/react/treemap/legend.md b/chart-sdk/react/treemap/legend.md index 5dea799c1..9ddfb2e21 100644 --- a/chart-sdk/react/treemap/legend.md +++ b/chart-sdk/react/treemap/legend.md @@ -1,14 +1,14 @@ --- layout: post -title: Legend in React Treemap component | Syncfusion -description: Learn here all about Legend in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Legend in React TreeMap | Syncfusion +description: Learn how to enable and customize legends in the Syncfusion React TreeMap for position, shape, and interactive item identification. control: Legend platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Legend in React Treemap component +# Legend in React TreeMap Legend is used to provide valuable information for interpreting what the TreeMap displays. The legends can be represented in various colors, shapes or other identifiers based on the data. diff --git a/chart-sdk/react/treemap/levels.md b/chart-sdk/react/treemap/levels.md index 68348a8ad..a92f74cae 100644 --- a/chart-sdk/react/treemap/levels.md +++ b/chart-sdk/react/treemap/levels.md @@ -1,24 +1,24 @@ --- layout: post -title: Levels in React Treemap component | Syncfusion -description: Learn here all about Levels in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. -control: Levels +title: Levels in React TreeMap | Syncfusion +description: Learn how to add multiple hierarchical levels to the Syncfusion React TreeMap using the groupPath property in levelSettings. +control: Levels platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Levels in React Treemap component +# Levels in React TreeMap -TreeMap supports **n** number of levels and each level is separated by using the [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#grouppath) property. +TreeMap supports **n** number of levels and each level is separated by using the [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#grouppath) property. ## Group path -The [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#grouppath) property is used to separate each level of the TreeMap by specifying the property from the data source. +The [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#grouppath) property is used to separate each level of the TreeMap by specifying the property from the data source. -In the following example, three levels are added and each level is configured using the [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#grouppath) property. +In the following example, three levels are added and each level is configured using the [`groupPath`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#grouppath) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -35,7 +35,7 @@ In the following example, three levels are added and each level is configured us ## Group gap -The [`groupGap`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#groupgap) property is used to separate an item from each group or another item to differentiate the levels mentioned in the TreeMap. +The [`groupGap`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#groupgap) property is used to separate an item from each group or another item to differentiate the levels mentioned in the TreeMap. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -52,7 +52,7 @@ The [`groupGap`](https://ej2.syncfusion.com/react/documentation/api/treemap/leve ## Header format and Alignment -Customize header using the [`headerFormat`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#headerformat) property in which fields are mapping from the dataSource and align header using the [`headerAlignment`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#headeralignment) property. +Customize header using the [`headerFormat`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#headerformat) property in which fields are mapping from the dataSource and align header using the [`headerAlignment`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#headeralignment) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -67,7 +67,7 @@ Customize header using the [`headerFormat`](https://ej2.syncfusion.com/react/doc ## Header height and style -Customize the font color, family, weight, opacity and size using the [`headerStyle`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#headerstyle). Based on the font settings, the header height is given using the [`headerHeight`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#headerheight) property in [`levels`](https://ej2.syncfusion.com/react/documentation/api/treemap/#levels). +Customize the font color, family, weight, opacity and size using the [`headerStyle`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#headerstyle). Based on the font settings, the header height is given using the [`headerHeight`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#headerheight) property in [`levels`](https://ej2.syncfusion.com/react/documentation/api/treemap#levels). {% tabs %} {% highlight js tabtitle="index.jsx" %} @@ -82,7 +82,7 @@ Customize the font color, family, weight, opacity and size using the [`headerSty ## Header template and position -The TreeMap header supports to customize header of each item using the [`headerTemplate`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#headertemplate) property. It uses Essential JS2 Template engine to render the elements. You can position the template using the [`templatePosition`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel/#templateposition) property. +The TreeMap header supports to customize header of each item using the [`headerTemplate`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#headertemplate) property. It uses Essential JS2 Template engine to render the elements. You can position the template using the [`templatePosition`](https://ej2.syncfusion.com/react/documentation/api/treemap/levelSettingsModel#templateposition) property. {% tabs %} {% highlight js tabtitle="index.jsx" %} diff --git a/chart-sdk/react/treemap/print-and-export.md b/chart-sdk/react/treemap/print-and-export.md index 7684cd19c..031e8e2a3 100644 --- a/chart-sdk/react/treemap/print-and-export.md +++ b/chart-sdk/react/treemap/print-and-export.md @@ -1,14 +1,14 @@ --- layout: post -title: Print and export in React Treemap component | Syncfusion -description: Learn here all about Print and export in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Print and Export in React TreeMap | Syncfusion +description: Learn how to print and export the Syncfusion React TreeMap as PDF or image using the Print and Export modules. control: Print and export platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and export in React Treemap component +# Print and Export in React TreeMap ## Print diff --git a/chart-sdk/react/treemap/selection-and-highlight.md b/chart-sdk/react/treemap/selection-and-highlight.md index d29cf9456..c73e86ab5 100644 --- a/chart-sdk/react/treemap/selection-and-highlight.md +++ b/chart-sdk/react/treemap/selection-and-highlight.md @@ -1,14 +1,14 @@ --- layout: post -title: Selection and highlight in React Treemap component | Syncfusion -description: Learn here all about Selection and highlight in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Selection and Highlight in React TreeMap | Syncfusion +description: Learn how to select and highlight items and groups in the Syncfusion React TreeMap using selectionSettings and highlightSettings. control: Selection and highlight platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Selection and highlight in React Treemap component +# Selection and Highlight in React TreeMap ## Selection diff --git a/chart-sdk/react/treemap/tooltip.md b/chart-sdk/react/treemap/tooltip.md index 66fef7e3e..d2c0d21bd 100644 --- a/chart-sdk/react/treemap/tooltip.md +++ b/chart-sdk/react/treemap/tooltip.md @@ -1,14 +1,14 @@ --- layout: post -title: Tooltip in React Treemap component | Syncfusion -description: Learn here all about Tooltip in Syncfusion React Treemap component of Syncfusion Essential JS 2 and more. +title: Tooltip in React TreeMap | Syncfusion +description: Learn how to enable and customize tooltips in the Syncfusion React TreeMap to show item details on hover. control: Tooltip platform: chart-sdk documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in React Treemap component +# Tooltip in React TreeMap Tooltip is used to display details about the items in the TreeMap. When space constraints prevent us from displaying the information using Data Labels, the tooltip comes in handy. diff --git a/chart-sdk/typescript/bullet-charts/accessibility.md b/chart-sdk/typescript/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/accessibility.md rename to chart-sdk/typescript/bullet-chart/accessibility.md diff --git a/chart-sdk/typescript/bullet-charts/axis-customization.md b/chart-sdk/typescript/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/axis-customization.md rename to chart-sdk/typescript/bullet-chart/axis-customization.md diff --git a/chart-sdk/typescript/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/typescript/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/typescript/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/typescript/bullet-charts/comparative-bar.md b/chart-sdk/typescript/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/comparative-bar.md rename to chart-sdk/typescript/bullet-chart/comparative-bar.md diff --git a/chart-sdk/typescript/bullet-charts/customization.md b/chart-sdk/typescript/bullet-chart/customization.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/customization.md rename to chart-sdk/typescript/bullet-chart/customization.md diff --git a/chart-sdk/typescript/bullet-charts/data-binding.md b/chart-sdk/typescript/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/data-binding.md rename to chart-sdk/typescript/bullet-chart/data-binding.md diff --git a/chart-sdk/typescript/bullet-charts/data-label.md b/chart-sdk/typescript/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/data-label.md rename to chart-sdk/typescript/bullet-chart/data-label.md diff --git a/chart-sdk/typescript/bullet-charts/getting-started.md b/chart-sdk/typescript/bullet-chart/getting-started.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/getting-started.md rename to chart-sdk/typescript/bullet-chart/getting-started.md diff --git a/chart-sdk/typescript/bullet-charts/ranges.md b/chart-sdk/typescript/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/ranges.md rename to chart-sdk/typescript/bullet-chart/ranges.md diff --git a/chart-sdk/typescript/bullet-charts/title.md b/chart-sdk/typescript/bullet-chart/title.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/title.md rename to chart-sdk/typescript/bullet-chart/title.md diff --git a/chart-sdk/typescript/bullet-charts/tool-tip.md b/chart-sdk/typescript/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/tool-tip.md rename to chart-sdk/typescript/bullet-chart/tool-tip.md diff --git a/chart-sdk/typescript/bullet-charts/value-bar.md b/chart-sdk/typescript/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/typescript/bullet-charts/value-bar.md rename to chart-sdk/typescript/bullet-chart/value-bar.md diff --git a/chart-sdk/typescript/heatmap-charts/accessibility.md b/chart-sdk/typescript/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/accessibility.md rename to chart-sdk/typescript/heatmap-chart/accessibility.md diff --git a/chart-sdk/typescript/heatmap-charts/appearance.md b/chart-sdk/typescript/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/appearance.md rename to chart-sdk/typescript/heatmap-chart/appearance.md diff --git a/chart-sdk/typescript/heatmap-charts/axis.md b/chart-sdk/typescript/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/axis.md rename to chart-sdk/typescript/heatmap-chart/axis.md diff --git a/chart-sdk/typescript/heatmap-charts/bubble-heatmap.md b/chart-sdk/typescript/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/bubble-heatmap.md rename to chart-sdk/typescript/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/typescript/heatmap-charts/dimensions.md b/chart-sdk/typescript/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/dimensions.md rename to chart-sdk/typescript/heatmap-chart/dimensions.md diff --git a/chart-sdk/typescript/heatmap-charts/ej1-api-migration.md b/chart-sdk/typescript/heatmap-chart/ej1-api-migration.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/ej1-api-migration.md rename to chart-sdk/typescript/heatmap-chart/ej1-api-migration.md diff --git a/chart-sdk/typescript/heatmap-charts/events.md b/chart-sdk/typescript/heatmap-chart/events.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/events.md rename to chart-sdk/typescript/heatmap-chart/events.md diff --git a/chart-sdk/typescript/heatmap-charts/getting-started.md b/chart-sdk/typescript/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/getting-started.md rename to chart-sdk/typescript/heatmap-chart/getting-started.md diff --git a/chart-sdk/typescript/heatmap-charts/how-to/legend-customization.md b/chart-sdk/typescript/heatmap-chart/how-to/legend-customization.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/how-to/legend-customization.md rename to chart-sdk/typescript/heatmap-chart/how-to/legend-customization.md diff --git a/chart-sdk/typescript/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/typescript/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/typescript/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/typescript/heatmap-charts/legend.md b/chart-sdk/typescript/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/legend.md rename to chart-sdk/typescript/heatmap-chart/legend.md diff --git a/chart-sdk/typescript/heatmap-charts/palette.md b/chart-sdk/typescript/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/palette.md rename to chart-sdk/typescript/heatmap-chart/palette.md diff --git a/chart-sdk/typescript/heatmap-charts/rendering-mode.md b/chart-sdk/typescript/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/rendering-mode.md rename to chart-sdk/typescript/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/typescript/heatmap-charts/selection.md b/chart-sdk/typescript/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/selection.md rename to chart-sdk/typescript/heatmap-chart/selection.md diff --git a/chart-sdk/typescript/heatmap-charts/tooltip.md b/chart-sdk/typescript/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/tooltip.md rename to chart-sdk/typescript/heatmap-chart/tooltip.md diff --git a/chart-sdk/typescript/heatmap-charts/working-with-data.md b/chart-sdk/typescript/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/typescript/heatmap-charts/working-with-data.md rename to chart-sdk/typescript/heatmap-chart/working-with-data.md diff --git a/chart-sdk/typescript/smith-charts/accessibility.md b/chart-sdk/typescript/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/typescript/smith-charts/accessibility.md rename to chart-sdk/typescript/smith-chart/accessibility.md diff --git a/chart-sdk/typescript/smith-charts/getting-started.md b/chart-sdk/typescript/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/typescript/smith-charts/getting-started.md rename to chart-sdk/typescript/smith-chart/getting-started.md diff --git a/chart-sdk/typescript/smith-charts/images/smithchart-TS.png b/chart-sdk/typescript/smith-chart/images/smithchart-TS.png similarity index 100% rename from chart-sdk/typescript/smith-charts/images/smithchart-TS.png rename to chart-sdk/typescript/smith-chart/images/smithchart-TS.png diff --git a/chart-sdk/typescript/smith-charts/smith-chart-axis.md b/chart-sdk/typescript/smith-chart/smith-chart-axis.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-axis.md rename to chart-sdk/typescript/smith-chart/smith-chart-axis.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-dimensions.md b/chart-sdk/typescript/smith-chart/smith-chart-dimensions.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-dimensions.md rename to chart-sdk/typescript/smith-chart/smith-chart-dimensions.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-legend.md b/chart-sdk/typescript/smith-chart/smith-chart-legend.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-legend.md rename to chart-sdk/typescript/smith-chart/smith-chart-legend.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-marker.md b/chart-sdk/typescript/smith-chart/smith-chart-marker.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-marker.md rename to chart-sdk/typescript/smith-chart/smith-chart-marker.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-print.md b/chart-sdk/typescript/smith-chart/smith-chart-print.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-print.md rename to chart-sdk/typescript/smith-chart/smith-chart-print.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-series.md b/chart-sdk/typescript/smith-chart/smith-chart-series.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-series.md rename to chart-sdk/typescript/smith-chart/smith-chart-series.md diff --git a/chart-sdk/typescript/smith-charts/smith-chart-tooltip.md b/chart-sdk/typescript/smith-chart/smith-chart-tooltip.md similarity index 100% rename from chart-sdk/typescript/smith-charts/smith-chart-tooltip.md rename to chart-sdk/typescript/smith-chart/smith-chart-tooltip.md diff --git a/chart-sdk/typescript/smith-charts/title-subtitle.md b/chart-sdk/typescript/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/typescript/smith-charts/title-subtitle.md rename to chart-sdk/typescript/smith-chart/title-subtitle.md diff --git a/chart-sdk/typescript/smith-charts/working-with-data.md b/chart-sdk/typescript/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/typescript/smith-charts/working-with-data.md rename to chart-sdk/typescript/smith-chart/working-with-data.md diff --git a/chart-sdk/typescript/sparkline/accessibility.md b/chart-sdk/typescript/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/typescript/sparkline/accessibility.md rename to chart-sdk/typescript/sparkline-charts/accessibility.md diff --git a/chart-sdk/typescript/sparkline/appearance.md b/chart-sdk/typescript/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/typescript/sparkline/appearance.md rename to chart-sdk/typescript/sparkline-charts/appearance.md diff --git a/chart-sdk/typescript/sparkline/axis-customization.md b/chart-sdk/typescript/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/typescript/sparkline/axis-customization.md rename to chart-sdk/typescript/sparkline-charts/axis-customization.md diff --git a/chart-sdk/typescript/sparkline/data-labels.md b/chart-sdk/typescript/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/typescript/sparkline/data-labels.md rename to chart-sdk/typescript/sparkline-charts/data-labels.md diff --git a/chart-sdk/typescript/sparkline/ej1-api-migration.md b/chart-sdk/typescript/sparkline-charts/ej1-api-migration.md similarity index 100% rename from chart-sdk/typescript/sparkline/ej1-api-migration.md rename to chart-sdk/typescript/sparkline-charts/ej1-api-migration.md diff --git a/chart-sdk/typescript/sparkline/getting-started.md b/chart-sdk/typescript/sparkline-charts/getting-started.md similarity index 100% rename from chart-sdk/typescript/sparkline/getting-started.md rename to chart-sdk/typescript/sparkline-charts/getting-started.md diff --git a/chart-sdk/typescript/sparkline/images/sparkline-TS.png b/chart-sdk/typescript/sparkline-charts/images/sparkline-TS.png similarity index 100% rename from chart-sdk/typescript/sparkline/images/sparkline-TS.png rename to chart-sdk/typescript/sparkline-charts/images/sparkline-TS.png diff --git a/chart-sdk/typescript/sparkline/localization.md b/chart-sdk/typescript/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/typescript/sparkline/localization.md rename to chart-sdk/typescript/sparkline-charts/localization.md diff --git a/chart-sdk/typescript/sparkline/marker.md b/chart-sdk/typescript/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/typescript/sparkline/marker.md rename to chart-sdk/typescript/sparkline-charts/marker.md diff --git a/chart-sdk/typescript/sparkline/range-band.md b/chart-sdk/typescript/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/typescript/sparkline/range-band.md rename to chart-sdk/typescript/sparkline-charts/range-band.md diff --git a/chart-sdk/typescript/sparkline/sparkline-dimensions.md b/chart-sdk/typescript/sparkline-charts/sparkline-dimensions.md similarity index 100% rename from chart-sdk/typescript/sparkline/sparkline-dimensions.md rename to chart-sdk/typescript/sparkline-charts/sparkline-dimensions.md diff --git a/chart-sdk/typescript/sparkline/sparkline-types.md b/chart-sdk/typescript/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/typescript/sparkline/sparkline-types.md rename to chart-sdk/typescript/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/typescript/sparkline/special-points-customization.md b/chart-sdk/typescript/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/typescript/sparkline/special-points-customization.md rename to chart-sdk/typescript/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/typescript/sparkline/user-interaction.md b/chart-sdk/typescript/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/typescript/sparkline/user-interaction.md rename to chart-sdk/typescript/sparkline-charts/user-interaction.md diff --git a/chart-sdk/vue/bullet-charts/accessibility.md b/chart-sdk/vue/bullet-chart/accessibility.md similarity index 100% rename from chart-sdk/vue/bullet-charts/accessibility.md rename to chart-sdk/vue/bullet-chart/accessibility.md diff --git a/chart-sdk/vue/bullet-charts/axis-customization.md b/chart-sdk/vue/bullet-chart/axis-customization.md similarity index 100% rename from chart-sdk/vue/bullet-charts/axis-customization.md rename to chart-sdk/vue/bullet-chart/axis-customization.md diff --git a/chart-sdk/vue/bullet-charts/bullet-chart-dimensions.md b/chart-sdk/vue/bullet-chart/bullet-chart-dimensions.md similarity index 100% rename from chart-sdk/vue/bullet-charts/bullet-chart-dimensions.md rename to chart-sdk/vue/bullet-chart/bullet-chart-dimensions.md diff --git a/chart-sdk/vue/bullet-charts/comparative-bar.md b/chart-sdk/vue/bullet-chart/comparative-bar.md similarity index 100% rename from chart-sdk/vue/bullet-charts/comparative-bar.md rename to chart-sdk/vue/bullet-chart/comparative-bar.md diff --git a/chart-sdk/vue/bullet-charts/customization.md b/chart-sdk/vue/bullet-chart/customization.md similarity index 100% rename from chart-sdk/vue/bullet-charts/customization.md rename to chart-sdk/vue/bullet-chart/customization.md diff --git a/chart-sdk/vue/bullet-charts/data-binding.md b/chart-sdk/vue/bullet-chart/data-binding.md similarity index 100% rename from chart-sdk/vue/bullet-charts/data-binding.md rename to chart-sdk/vue/bullet-chart/data-binding.md diff --git a/chart-sdk/vue/bullet-charts/data-label.md b/chart-sdk/vue/bullet-chart/data-label.md similarity index 100% rename from chart-sdk/vue/bullet-charts/data-label.md rename to chart-sdk/vue/bullet-chart/data-label.md diff --git a/chart-sdk/vue/bullet-charts/getting-started.md b/chart-sdk/vue/bullet-chart/getting-started.md similarity index 100% rename from chart-sdk/vue/bullet-charts/getting-started.md rename to chart-sdk/vue/bullet-chart/getting-started.md diff --git a/chart-sdk/vue/bullet-charts/images/vue3-bullet-chart-demo.png b/chart-sdk/vue/bullet-chart/images/vue3-bullet-chart-demo.png similarity index 100% rename from chart-sdk/vue/bullet-charts/images/vue3-bullet-chart-demo.png rename to chart-sdk/vue/bullet-chart/images/vue3-bullet-chart-demo.png diff --git a/chart-sdk/vue/bullet-charts/images/vue3-terminal.png b/chart-sdk/vue/bullet-chart/images/vue3-terminal.png similarity index 100% rename from chart-sdk/vue/bullet-charts/images/vue3-terminal.png rename to chart-sdk/vue/bullet-chart/images/vue3-terminal.png diff --git a/chart-sdk/vue/bullet-charts/ranges.md b/chart-sdk/vue/bullet-chart/ranges.md similarity index 100% rename from chart-sdk/vue/bullet-charts/ranges.md rename to chart-sdk/vue/bullet-chart/ranges.md diff --git a/chart-sdk/vue/bullet-charts/title.md b/chart-sdk/vue/bullet-chart/title.md similarity index 100% rename from chart-sdk/vue/bullet-charts/title.md rename to chart-sdk/vue/bullet-chart/title.md diff --git a/chart-sdk/vue/bullet-charts/tool-tip.md b/chart-sdk/vue/bullet-chart/tool-tip.md similarity index 100% rename from chart-sdk/vue/bullet-charts/tool-tip.md rename to chart-sdk/vue/bullet-chart/tool-tip.md diff --git a/chart-sdk/vue/bullet-charts/value-bar.md b/chart-sdk/vue/bullet-chart/value-bar.md similarity index 100% rename from chart-sdk/vue/bullet-charts/value-bar.md rename to chart-sdk/vue/bullet-chart/value-bar.md diff --git a/chart-sdk/vue/bullet-charts/vue-3-getting-started.md b/chart-sdk/vue/bullet-chart/vue-3-getting-started.md similarity index 100% rename from chart-sdk/vue/bullet-charts/vue-3-getting-started.md rename to chart-sdk/vue/bullet-chart/vue-3-getting-started.md diff --git a/chart-sdk/vue/heatmap-charts/accessibility.md b/chart-sdk/vue/heatmap-chart/accessibility.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/accessibility.md rename to chart-sdk/vue/heatmap-chart/accessibility.md diff --git a/chart-sdk/vue/heatmap-charts/appearance.md b/chart-sdk/vue/heatmap-chart/appearance.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/appearance.md rename to chart-sdk/vue/heatmap-chart/appearance.md diff --git a/chart-sdk/vue/heatmap-charts/axis.md b/chart-sdk/vue/heatmap-chart/axis.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/axis.md rename to chart-sdk/vue/heatmap-chart/axis.md diff --git a/chart-sdk/vue/heatmap-charts/bubble-heatmap.md b/chart-sdk/vue/heatmap-chart/bubble-heatmap.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/bubble-heatmap.md rename to chart-sdk/vue/heatmap-chart/bubble-heatmap.md diff --git a/chart-sdk/vue/heatmap-charts/dimensions.md b/chart-sdk/vue/heatmap-chart/dimensions.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/dimensions.md rename to chart-sdk/vue/heatmap-chart/dimensions.md diff --git a/chart-sdk/vue/heatmap-charts/events.md b/chart-sdk/vue/heatmap-chart/events.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/events.md rename to chart-sdk/vue/heatmap-chart/events.md diff --git a/chart-sdk/vue/heatmap-charts/getting-started-vue-3.md b/chart-sdk/vue/heatmap-chart/getting-started-vue-3.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/getting-started-vue-3.md rename to chart-sdk/vue/heatmap-chart/getting-started-vue-3.md diff --git a/chart-sdk/vue/heatmap-charts/getting-started.md b/chart-sdk/vue/heatmap-chart/getting-started.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/getting-started.md rename to chart-sdk/vue/heatmap-chart/getting-started.md diff --git a/chart-sdk/vue/heatmap-charts/how-to/legend-label-customization.md b/chart-sdk/vue/heatmap-chart/how-to/legend-label-customization.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/how-to/legend-label-customization.md rename to chart-sdk/vue/heatmap-chart/how-to/legend-label-customization.md diff --git a/chart-sdk/vue/heatmap-charts/how-to/tooltip-template.md b/chart-sdk/vue/heatmap-chart/how-to/tooltip-template.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/how-to/tooltip-template.md rename to chart-sdk/vue/heatmap-chart/how-to/tooltip-template.md diff --git a/chart-sdk/vue/heatmap-charts/images/vue2-terminal.png b/chart-sdk/vue/heatmap-chart/images/vue2-terminal.png similarity index 100% rename from chart-sdk/vue/heatmap-charts/images/vue2-terminal.png rename to chart-sdk/vue/heatmap-chart/images/vue2-terminal.png diff --git a/chart-sdk/vue/heatmap-charts/images/vue3-heatmap-demo.PNG b/chart-sdk/vue/heatmap-chart/images/vue3-heatmap-demo.PNG similarity index 100% rename from chart-sdk/vue/heatmap-charts/images/vue3-heatmap-demo.PNG rename to chart-sdk/vue/heatmap-chart/images/vue3-heatmap-demo.PNG diff --git a/chart-sdk/vue/heatmap-charts/images/vue3-terminal.png b/chart-sdk/vue/heatmap-chart/images/vue3-terminal.png similarity index 100% rename from chart-sdk/vue/heatmap-charts/images/vue3-terminal.png rename to chart-sdk/vue/heatmap-chart/images/vue3-terminal.png diff --git a/chart-sdk/vue/heatmap-charts/legend.md b/chart-sdk/vue/heatmap-chart/legend.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/legend.md rename to chart-sdk/vue/heatmap-chart/legend.md diff --git a/chart-sdk/vue/heatmap-charts/palette.md b/chart-sdk/vue/heatmap-chart/palette.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/palette.md rename to chart-sdk/vue/heatmap-chart/palette.md diff --git a/chart-sdk/vue/heatmap-charts/rendering-mode.md b/chart-sdk/vue/heatmap-chart/rendering-mode.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/rendering-mode.md rename to chart-sdk/vue/heatmap-chart/rendering-mode.md diff --git a/chart-sdk/vue/heatmap-charts/selection.md b/chart-sdk/vue/heatmap-chart/selection.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/selection.md rename to chart-sdk/vue/heatmap-chart/selection.md diff --git a/chart-sdk/vue/heatmap-charts/tooltip.md b/chart-sdk/vue/heatmap-chart/tooltip.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/tooltip.md rename to chart-sdk/vue/heatmap-chart/tooltip.md diff --git a/chart-sdk/vue/heatmap-charts/working-with-data.md b/chart-sdk/vue/heatmap-chart/working-with-data.md similarity index 100% rename from chart-sdk/vue/heatmap-charts/working-with-data.md rename to chart-sdk/vue/heatmap-chart/working-with-data.md diff --git a/chart-sdk/vue/smith-charts/accessibility.md b/chart-sdk/vue/smith-chart/accessibility.md similarity index 100% rename from chart-sdk/vue/smith-charts/accessibility.md rename to chart-sdk/vue/smith-chart/accessibility.md diff --git a/chart-sdk/vue/smith-charts/getting-started.md b/chart-sdk/vue/smith-chart/getting-started.md similarity index 100% rename from chart-sdk/vue/smith-charts/getting-started.md rename to chart-sdk/vue/smith-chart/getting-started.md diff --git a/chart-sdk/vue/smith-charts/images/vue2-terminal.png b/chart-sdk/vue/smith-chart/images/vue2-terminal.png similarity index 100% rename from chart-sdk/vue/smith-charts/images/vue2-terminal.png rename to chart-sdk/vue/smith-chart/images/vue2-terminal.png diff --git a/chart-sdk/vue/smith-charts/images/vue3-smith-chart-demo.png b/chart-sdk/vue/smith-chart/images/vue3-smith-chart-demo.png similarity index 100% rename from chart-sdk/vue/smith-charts/images/vue3-smith-chart-demo.png rename to chart-sdk/vue/smith-chart/images/vue3-smith-chart-demo.png diff --git a/chart-sdk/vue/smith-charts/images/vue3-terminal.png b/chart-sdk/vue/smith-chart/images/vue3-terminal.png similarity index 100% rename from chart-sdk/vue/smith-charts/images/vue3-terminal.png rename to chart-sdk/vue/smith-chart/images/vue3-terminal.png diff --git a/chart-sdk/vue/smith-charts/index.md b/chart-sdk/vue/smith-chart/index.md similarity index 100% rename from chart-sdk/vue/smith-charts/index.md rename to chart-sdk/vue/smith-chart/index.md diff --git a/chart-sdk/vue/smith-charts/smithchart-axis.md b/chart-sdk/vue/smith-chart/smithchart-axis.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-axis.md rename to chart-sdk/vue/smith-chart/smithchart-axis.md diff --git a/chart-sdk/vue/smith-charts/smithchart-dimensions.md b/chart-sdk/vue/smith-chart/smithchart-dimensions.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-dimensions.md rename to chart-sdk/vue/smith-chart/smithchart-dimensions.md diff --git a/chart-sdk/vue/smith-charts/smithchart-legend.md b/chart-sdk/vue/smith-chart/smithchart-legend.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-legend.md rename to chart-sdk/vue/smith-chart/smithchart-legend.md diff --git a/chart-sdk/vue/smith-charts/smithchart-marker.md b/chart-sdk/vue/smith-chart/smithchart-marker.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-marker.md rename to chart-sdk/vue/smith-chart/smithchart-marker.md diff --git a/chart-sdk/vue/smith-charts/smithchart-print.md b/chart-sdk/vue/smith-chart/smithchart-print.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-print.md rename to chart-sdk/vue/smith-chart/smithchart-print.md diff --git a/chart-sdk/vue/smith-charts/smithchart-series.md b/chart-sdk/vue/smith-chart/smithchart-series.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-series.md rename to chart-sdk/vue/smith-chart/smithchart-series.md diff --git a/chart-sdk/vue/smith-charts/smithchart-tooltip.md b/chart-sdk/vue/smith-chart/smithchart-tooltip.md similarity index 100% rename from chart-sdk/vue/smith-charts/smithchart-tooltip.md rename to chart-sdk/vue/smith-chart/smithchart-tooltip.md diff --git a/chart-sdk/vue/smith-charts/title-subtitle.md b/chart-sdk/vue/smith-chart/title-subtitle.md similarity index 100% rename from chart-sdk/vue/smith-charts/title-subtitle.md rename to chart-sdk/vue/smith-chart/title-subtitle.md diff --git a/chart-sdk/vue/smith-charts/vue-3-getting-started.md b/chart-sdk/vue/smith-chart/vue-3-getting-started.md similarity index 100% rename from chart-sdk/vue/smith-charts/vue-3-getting-started.md rename to chart-sdk/vue/smith-chart/vue-3-getting-started.md diff --git a/chart-sdk/vue/smith-charts/working-with-data.md b/chart-sdk/vue/smith-chart/working-with-data.md similarity index 100% rename from chart-sdk/vue/smith-charts/working-with-data.md rename to chart-sdk/vue/smith-chart/working-with-data.md diff --git a/chart-sdk/vue/sparkline/accessibility.md b/chart-sdk/vue/sparkline-charts/accessibility.md similarity index 100% rename from chart-sdk/vue/sparkline/accessibility.md rename to chart-sdk/vue/sparkline-charts/accessibility.md diff --git a/chart-sdk/vue/sparkline/appearance.md b/chart-sdk/vue/sparkline-charts/appearance.md similarity index 100% rename from chart-sdk/vue/sparkline/appearance.md rename to chart-sdk/vue/sparkline-charts/appearance.md diff --git a/chart-sdk/vue/sparkline/axis-customization.md b/chart-sdk/vue/sparkline-charts/axis-customization.md similarity index 100% rename from chart-sdk/vue/sparkline/axis-customization.md rename to chart-sdk/vue/sparkline-charts/axis-customization.md diff --git a/chart-sdk/vue/sparkline/data-labels.md b/chart-sdk/vue/sparkline-charts/data-labels.md similarity index 100% rename from chart-sdk/vue/sparkline/data-labels.md rename to chart-sdk/vue/sparkline-charts/data-labels.md diff --git a/chart-sdk/vue/sparkline/getting-started.md b/chart-sdk/vue/sparkline-charts/getting-started.md similarity index 100% rename from chart-sdk/vue/sparkline/getting-started.md rename to chart-sdk/vue/sparkline-charts/getting-started.md diff --git a/chart-sdk/vue/sparkline/images/vue2-terminal.png b/chart-sdk/vue/sparkline-charts/images/vue2-terminal.png similarity index 100% rename from chart-sdk/vue/sparkline/images/vue2-terminal.png rename to chart-sdk/vue/sparkline-charts/images/vue2-terminal.png diff --git a/chart-sdk/vue/sparkline/images/vue3-sparkline-charts-demo.png b/chart-sdk/vue/sparkline-charts/images/vue3-sparkline-charts-demo.png similarity index 100% rename from chart-sdk/vue/sparkline/images/vue3-sparkline-charts-demo.png rename to chart-sdk/vue/sparkline-charts/images/vue3-sparkline-charts-demo.png diff --git a/chart-sdk/vue/sparkline/images/vue3-terminal.png b/chart-sdk/vue/sparkline-charts/images/vue3-terminal.png similarity index 100% rename from chart-sdk/vue/sparkline/images/vue3-terminal.png rename to chart-sdk/vue/sparkline-charts/images/vue3-terminal.png diff --git a/chart-sdk/vue/sparkline/localization.md b/chart-sdk/vue/sparkline-charts/localization.md similarity index 100% rename from chart-sdk/vue/sparkline/localization.md rename to chart-sdk/vue/sparkline-charts/localization.md diff --git a/chart-sdk/vue/sparkline/marker.md b/chart-sdk/vue/sparkline-charts/marker.md similarity index 100% rename from chart-sdk/vue/sparkline/marker.md rename to chart-sdk/vue/sparkline-charts/marker.md diff --git a/chart-sdk/vue/sparkline/range-band.md b/chart-sdk/vue/sparkline-charts/range-band.md similarity index 100% rename from chart-sdk/vue/sparkline/range-band.md rename to chart-sdk/vue/sparkline-charts/range-band.md diff --git a/chart-sdk/vue/sparkline/sparkline-dimensions.md b/chart-sdk/vue/sparkline-charts/sparkline-dimensions.md similarity index 100% rename from chart-sdk/vue/sparkline/sparkline-dimensions.md rename to chart-sdk/vue/sparkline-charts/sparkline-dimensions.md diff --git a/chart-sdk/vue/sparkline/sparkline-types.md b/chart-sdk/vue/sparkline-charts/sparkline-types.md similarity index 100% rename from chart-sdk/vue/sparkline/sparkline-types.md rename to chart-sdk/vue/sparkline-charts/sparkline-types.md diff --git a/chart-sdk/vue/sparkline/special-points-customization.md b/chart-sdk/vue/sparkline-charts/special-points-customization.md similarity index 100% rename from chart-sdk/vue/sparkline/special-points-customization.md rename to chart-sdk/vue/sparkline-charts/special-points-customization.md diff --git a/chart-sdk/vue/sparkline/user-interaction.md b/chart-sdk/vue/sparkline-charts/user-interaction.md similarity index 100% rename from chart-sdk/vue/sparkline/user-interaction.md rename to chart-sdk/vue/sparkline-charts/user-interaction.md diff --git a/chart-sdk/vue/sparkline/vue-3-getting-started.md b/chart-sdk/vue/sparkline-charts/vue-3-getting-started.md similarity index 100% rename from chart-sdk/vue/sparkline/vue-3-getting-started.md rename to chart-sdk/vue/sparkline-charts/vue-3-getting-started.md diff --git a/chart-toc.html b/chart-toc.html index 5a9180b58..2b161521b 100644 --- a/chart-toc.html +++ b/chart-toc.html @@ -291,29 +291,29 @@
  • API Reference
  • -
  • HeatMap Charts -
  • -
  • Smith Charts -