diff --git a/concepts/05 UI Components/Chart/00 Overview.md b/concepts/05 UI Components/Chart/00 Overview.md deleted file mode 100644 index c0523ddd4f..0000000000 --- a/concepts/05 UI Components/Chart/00 Overview.md +++ /dev/null @@ -1,56 +0,0 @@ -The Chart is an interactive UI component that visualizes data from a local or remote storage using a great variety of [series types](/concepts/05%20UI%20Components/Chart/11%20Series%20Types/10%20Line%20Series.md '/Documentation/Guide/UI_Components/Chart/Series_Types/'). - -
- -The Chart can visualize data from any source. Refer to the following topics for details on how to bind the Chart to your data source. - -- [Simple Array](/concepts/70%20Data%20Binding/00%20Specify%20a%20Data%20Source/10%20Local%20Array.md '/Documentation/Guide/Data_Binding/Specify_a_Data_Source/Local_Array/') -- [JSON Data](/concepts/70%20Data%20Binding/00%20Specify%20a%20Data%20Source/20%20Read-Only%20Data%20in%20JSON%20Format.md '/Documentation/Guide/Data_Binding/Specify_a_Data_Source/Read-Only_Data_in_JSON_Format/') -- [OData Service](/concepts/70%20Data%20Binding/00%20Specify%20a%20Data%20Source/40%20OData.md '/Documentation/Guide/Data_Binding/Specify_a_Data_Source/OData/') -- [Custom Sources](/concepts/70%20Data%20Binding/00%20Specify%20a%20Data%20Source/60%20Custom%20Data%20Sources '/Documentation/Guide/Data_Binding/Specify_a_Data_Source/Custom_Data_Sources/') - -The next step is to configure the most essential chart elements - series and axes. - -- [Bind Series to Data](/concepts/05%20UI%20Components/Chart/03%20Data%20Binding/23%20Bind%20Series%20to%20Data '/Documentation/Guide/UI_Components/Chart/Data_Binding/Bind_Series_to_Data/') -- [Series Overview](/concepts/05%20UI%20Components/Chart/10%20Series/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Series/Overview/') -- [Series Types](/concepts/05%20UI%20Components/Chart/11%20Series%20Types/10%20Line%20Series.md '/Documentation/Guide/UI_Components/Chart/Series_Types/') -- [Series Points](/concepts/05%20UI%20Components/Chart/14%20Series%20Points/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Series_Points/Overview/') -- [Point Labels](/concepts/05%20UI%20Components/Chart/15%20Point%20Labels/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Point_Labels/Overview/') -- [Axes](/concepts/05%20UI%20Components/Chart/20%20Axes/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Axes/Overview/') - -Then, make the Chart more informative with the following elements. - -- [Legend](/concepts/05%20UI%20Components/Chart/35%20Legend/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Legend/Overview/') -- [Grid](/concepts/05%20UI%20Components/Chart/55%20Grid/00%20Grid.md '/Documentation/Guide/UI_Components/Chart/Grid/') -- [Title and Subtitle](/concepts/05%20UI%20Components/Chart/58%20Title%20and%20Subtitle.md '/Documentation/Guide/UI_Components/Chart/Title_and_Subtitle/') -- [Strips](/concepts/05%20UI%20Components/Chart/60%20Strips.md '/Documentation/Guide/UI_Components/Chart/Strips/') -- [Constant Lines](/concepts/05%20UI%20Components/Chart/65%20Constant%20Lines.md '/Documentation/Guide/UI_Components/Chart/Constant_Lines/') -- [Error Bars](/concepts/05%20UI%20Components/Chart/85%20Error%20Bars.md '/Documentation/Guide/UI_Components/Chart/Error_Bars/') - -Finally, add some interactivity. - -- [Tooltips](/concepts/05%20UI%20Components/Chart/30%20Tooltips/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Tooltips/Overview/') -- [Crosshair](/concepts/05%20UI%20Components/Chart/80%20Crosshair.md '/Documentation/Guide/UI_Components/Chart/Crosshair/') -- [Zooming and Panning](/concepts/05%20UI%20Components/Chart/95%20Zooming%20and%20Panning '/Documentation/Guide/UI_Components/Chart/Zooming_and_Panning/') -- [Client-Side Exporting and Printing](/concepts/05%20UI%20Components/Chart/99%20Client-Side%20Exporting%20and%20Printing '/Documentation/Guide/UI_Components/Chart/Client-Side_Exporting_and_Printing/') -- [Adaptive Layout](/concepts/05%20UI%20Components/Chart/89%20Adaptive%20Layout.md '/Documentation/Guide/UI_Components/Chart/Adaptive_Layout/') - -[note] - -Use our DevExpress BI Dashboard to embed interactive business intelligence into your next web app. - -The Web Dashboard is a data analysis UI component that you can embed into your ASP.NET Core or Angular, React, and Vue applications with .NET backend. Dashboards allow you to display multiple inter-connected data analysis elements such as grids, charts, maps, gauges, and others: all within an automatically-arranged layout. - -The set of components allows you to deploy an all-in-one solution and switch between Viewer and Designer modes directly on the web client (includes adaptive layouts for tablet & mobile). - -The Web Dashboard is available as a part of a Universal subscription. - -[Get Started with DevExpress BI Dashboard](https://docs.devexpress.com/Dashboard/115955/web-dashboard) | [Explore Demos](https://demos.devexpress.com/Dashboard/) - -[/note] - -#####See Also##### -- [Chart Demos](https://js.devexpress.com/Demos/WidgetsGallery/Demo/Charts/LocalDataSource) -- [Chart API Reference](/api-reference/10%20UI%20Components/dxChart '/Documentation/ApiReference/UI_Components/dxChart/') - -[tags]dxchart, chart, overview diff --git a/concepts/05 UI Components/Chart/02 Overview/00 Overview.md b/concepts/05 UI Components/Chart/02 Overview/00 Overview.md new file mode 100644 index 0000000000..6c6269902e --- /dev/null +++ b/concepts/05 UI Components/Chart/02 Overview/00 Overview.md @@ -0,0 +1,3 @@ +DevExtreme Chart is an interactive UI component that visualizes data from local or remote storage with various [series types](/concepts/05%20UI%20Components/Chart/11%20Series%20Types/10%20Line%20Series.md '/Documentation/Guide/UI_Components/Chart/Series_Types/'). + +In this overview, you can find a map of Chart elements, information about key features, and what to explore next. \ No newline at end of file diff --git a/concepts/05 UI Components/Chart/02 Overview/05 Elements.md b/concepts/05 UI Components/Chart/02 Overview/05 Elements.md new file mode 100644 index 0000000000..7d93ff5071 --- /dev/null +++ b/concepts/05 UI Components/Chart/02 Overview/05 Elements.md @@ -0,0 +1,10 @@ +

Chart elements

+ +1. [Value axis](/concepts/05%20UI%20Components/Chart/20%20Axes/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Axes/Overview/') +2. [Argument axis](/concepts/05%20UI%20Components/Chart/20%20Axes/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Axes/Overview/') +3. [Legend](/concepts/05%20UI%20Components/Chart/35%20Legend/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Legend/Overview/') +4. [Title](/concepts/05%20UI%20Components/Chart/58%20Title%20and%20Subtitle.md '/Documentation/Guide/UI_Components/Chart/Title_and_Subtitle/') +5. [Point label](/concepts/05%20UI%20Components/Chart/15%20Point%20Labels/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Point_Labels/Overview/') +6. [Area](/Documentation/Guide/UI_Components/Chart/Series_Types/Area_Series/) +7. [Line](/Documentation/Guide/UI_Components/Chart/Series_Types/Line_Series/) +8. [Bar](/Documentation/Guide/UI_Components/Chart/Series_Types/Bar_Series/) \ No newline at end of file diff --git a/concepts/05 UI Components/Chart/02 Overview/10 Key Features.md b/concepts/05 UI Components/Chart/02 Overview/10 Key Features.md new file mode 100644 index 0000000000..f906465297 --- /dev/null +++ b/concepts/05 UI Components/Chart/02 Overview/10 Key Features.md @@ -0,0 +1,24 @@ +- **Series Options** +The Chart component features over 20 [types of series](/concepts/05%20UI%20Components/Chart/11%20Series%20Types/10%20Line%20Series.md '/Documentation/Guide/UI_Components/Chart/Series_Types/'). [Combine](/concepts/05%20UI%20Components/Chart/10%20Series/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Series/Overview/') them, [customize](/Documentation/Guide/UI_Components/Chart/Series/Customize_Appearance/) appearance, and configure individual [points](/concepts/05%20UI%20Components/Chart/14%20Series%20Points/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Series_Points/Overview/'). + +- **Data Sources** +Chart can load and update data from various [data source](/concepts/70%20Data%20Binding/00%20Specify%20a%20Data%20Source/10%20Local%20Array.md '/Documentation/Guide/Data_Binding/Specify_a_Data_Source/Local_Array/') types. Bind data [directly](/Documentation/Guide/UI_Components/Chart/Data_Binding/Bind_Series_to_Data/#Directly) or use a [series template](/Documentation/Guide/UI_Components/Chart/Data_Binding/Bind_Series_to_Data/#Using_a_Series_Template). + +- **Informational Elements** +You can enhance Chart with additional information elements, such as the following: + + - [Legend](/concepts/05%20UI%20Components/Chart/35%20Legend/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Legend/Overview/') + - [Grid](/concepts/05%20UI%20Components/Chart/55%20Grid/00%20Grid.md '/Documentation/Guide/UI_Components/Chart/Grid/') + - [Title and Subtitle](/concepts/05%20UI%20Components/Chart/58%20Title%20and%20Subtitle.md '/Documentation/Guide/UI_Components/Chart/Title_and_Subtitle/') + - [Strips](/concepts/05%20UI%20Components/Chart/60%20Strips.md '/Documentation/Guide/UI_Components/Chart/Strips/') + - [Constant Lines](/concepts/05%20UI%20Components/Chart/65%20Constant%20Lines.md '/Documentation/Guide/UI_Components/Chart/Constant_Lines/') + - [Error Bars](/concepts/05%20UI%20Components/Chart/85%20Error%20Bars.md '/Documentation/Guide/UI_Components/Chart/Error_Bars/') + +- **Interactive Features** +Add interactivity to your Chart with the following elements: + + - [Tooltips](/concepts/05%20UI%20Components/Chart/30%20Tooltips/00%20Overview.md '/Documentation/Guide/UI_Components/Chart/Tooltips/Overview/') + - [Crosshair](/concepts/05%20UI%20Components/Chart/80%20Crosshair.md '/Documentation/Guide/UI_Components/Chart/Crosshair/') + - [Zooming and Panning](/concepts/05%20UI%20Components/Chart/95%20Zooming%20and%20Panning '/Documentation/Guide/UI_Components/Chart/Zooming_and_Panning/') + - [Client-Side Exporting and Printing](/concepts/05%20UI%20Components/Chart/99%20Client-Side%20Exporting%20and%20Printing '/Documentation/Guide/UI_Components/Chart/Client-Side_Exporting_and_Printing/') + - [Adaptive Layout](/concepts/05%20UI%20Components/Chart/89%20Adaptive%20Layout.md '/Documentation/Guide/UI_Components/Chart/Adaptive_Layout/') \ No newline at end of file diff --git a/concepts/05 UI Components/Chart/02 Overview/15 Explore More.md b/concepts/05 UI Components/Chart/02 Overview/15 Explore More.md new file mode 100644 index 0000000000..b9ffa3302e --- /dev/null +++ b/concepts/05 UI Components/Chart/02 Overview/15 Explore More.md @@ -0,0 +1,3 @@ +- [API](/api-reference/10%20UI%20Components/dxChart '/Documentation/ApiReference/UI_Components/dxChart/') + +- [Demos](https://js.devexpress.com/Demos/WidgetsGallery/Demo/Charts/Overview/) \ No newline at end of file diff --git a/images/ChartJS/chart-elements.png b/images/ChartJS/chart-elements.png new file mode 100644 index 0000000000..54c9784bc1 Binary files /dev/null and b/images/ChartJS/chart-elements.png differ