diff --git a/ej2-javascript-toc.html b/ej2-javascript-toc.html
index f2e258c72..76d89b718 100644
--- a/ej2-javascript-toc.html
+++ b/ej2-javascript-toc.html
@@ -960,7 +960,8 @@
Migration from Essential JS 1
API Reference
-
+
+
DropDown Menu
- Getting Started
diff --git a/ej2-javascript/chart/working-with-data.md b/ej2-javascript/chart/working-with-data.md
new file mode 100644
index 000000000..5b9d901be
--- /dev/null
+++ b/ej2-javascript/chart/working-with-data.md
@@ -0,0 +1,369 @@
+---
+layout: post
+title: Working with data in ##Platform_Name## Chart control | Syncfusion
+description: Learn here all about Working with data in Syncfusion ##Platform_Name## Chart control of Syncfusion Essential JS 2 and more.
+platform: ej2-javascript
+control: Working with data
+publishingplatform: ##Platform_Name##
+documentation: ug
+domainurl: ##DomainURL##
+---
+
+
+# Working with data in ##Platform_Name## Chart control
+
+Chart can visualize data bound from local or remote data.
+
+## Local data
+
+You can bind a simple JSON data to the chart using [`dataSource`](../api/chart/series/) property in series. Now map the fields in
+JSON to [`xName`](../api/chart/series/#xname-string) and [`yName`](../api/chart/series/#yname-string) properties.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs1/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs1/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs1" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs1/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs1/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs1" %}
+{% endif %}
+
+## Remote data
+
+You can also bind remote data to the chart using DataManager. The `DataManager` requires minimal information like webservice URL, adaptor and crossDomain to interact with service endpoint properly. Assign the instance of DataManager to the [`dataSource`](../api/chart/series/#datasource-object---datamanager) property in series and map the fields of data to [`xName`](../api/chart/series/#xname-string) and [`yName`](../api/chart/series/#yname-string) properties. You can also use the [`query`](../api/chart/series/#query-string) property of the series to filter the data.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs2/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs2/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs2" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs2/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs2/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs2" %}
+{% endif %}
+
+## Binding data using ODataAdaptor
+
+[`OData`](http://www.odata.org/documentation/odata-version-3-0/) is a standardized protocol for creating and consuming data. You can retrieve data from an OData service using the DataManager. Refer to the following code example for remote data binding using an OData service.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs3/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs3/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs3" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs3/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs3/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs3" %}
+{% endif %}
+
+## Binding data using ODataV4Adaptor
+
+ODataV4 is an improved version of the OData protocols, and the `DataManager` can also retrieve and consume ODataV4 services. For more details on ODataV4 services, refer to the [`odata documentation`](http://docs.oasis-open.org/odata/odata/v4.0/errata03/os/complete/part1-protocol/odata-v4.0-errata03-os-part1-protocol-complete.html#_Toc453752197). To bind an ODataV4 service, use the **ODataV4Adaptor**.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs7/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs7/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs7" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs7/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs7/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs7" %}
+{% endif %}
+
+## Web API adaptor
+
+You can use the **WebApiAdaptor** to bind the chart with a Web API created using an OData endpoint.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs8/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs8/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs8" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs8/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs8/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs8" %}
+{% endif %}
+
+The response object should contain the properties **Items** and **Count**, where **Items** represents a collection of entities, and **Count** represents the total number of entities.
+
+The sample response object should appear as follows:
+
+```
+{
+ Items: [{..}, {..}, {..}, ...],
+ Count: 830
+}
+```
+
+## Custom adaptor
+
+You can create your own adaptor by extending the built-in adaptors. The following demonstrates the custom adaptor approach and how to add a serial number to the records by overriding the built-in response processing using the **processResponse** method of the **ODataAdaptor**.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs10/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs10/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs10" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs10/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs10/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs10" %}
+{% endif %}
+
+## Offline mode
+
+When using remote data binding, all chart actions will be processed on the server-side. To avoid postback for every action, configure the chart to load all data upon initialization and handle actions on the client-side. To enable this behavior, utilize the **offline** property of the `DataManager`.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs9/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs9/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs9" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs9/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs9/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs9" %}
+{% endif %}
+
+## Lazy loading
+
+Lazy loading allows you to load data for chart on demand. Chart will fire the scrollEnd event, in that we can get the minimum and maximum range of the axis, based on this, we can upload the data to chart.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs4/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs4/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs4" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs4/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs4/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs4" %}
+{% endif %}
+
+## Empty points
+
+The Data points that uses the `null` or `undefined` as value are considered as empty points. Empty data points are ignored and not plotted in the Chart. When the data is provided by using the points property, By using `emptyPointSettings` property in series, you can customize the empty point. Default `mode` of the empty point is `Gap`.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs5/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs5/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs5" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs5/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs5/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs5" %}
+{% endif %}
+
+**Customizing empty point**
+
+Specific color for empty point can be set by `fill` property in `emptyPointSettings`. Border for a empty point can be set by `border` property.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs6/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs6/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs6" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs6/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs6/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs6" %}
+{% endif %}
+
+## Handling No Data
+
+When no data is available to render in the chart, the `noDataTemplate` property can be used to display a custom layout within the chart area. This layout may include a message indicating the absence of data, a relevant image, or a button to initiate data loading. Styled text, images, or interactive elements can be incorporated to maintain design consistency and improve user guidance. Once data becomes available, the chart automatically updates to display the appropriate visualization.
+
+{% if page.publishingplatform == "typescript" %}
+
+{% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/chart/working-with-data-cs11/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs11/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs11" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/chart/working-with-data-cs11/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/chart/working-with-data-cs11/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/chart/working-with-data-cs11" %}
+{% endif %}
+
diff --git a/ej2-javascript/stock-chart/working-with-data.md b/ej2-javascript/stock-chart/working-with-data.md
new file mode 100644
index 000000000..6f1a55e19
--- /dev/null
+++ b/ej2-javascript/stock-chart/working-with-data.md
@@ -0,0 +1,81 @@
+---
+layout: post
+title: Working with data in ##Platform_Name## Stock chart control | Syncfusion
+description: Learn here all about Working with data in Syncfusion ##Platform_Name## Stock chart control of Syncfusion Essential JS 2 and more.
+platform: ej2-javascript
+control: Working with data
+publishingplatform: ##Platform_Name##
+documentation: ug
+domainurl: ##DomainURL##
+---
+
+
+# Working with data in ##Platform_Name## Stock chart control
+
+Stock Chart can visualise data bound from local or remote data.
+
+## Local Data
+
+You can bind a simple JSON data to the chart using [`dataSource`](../api/stock-chart/stockSeriesModel/#datasource) property in series.
+
+{% if page.publishingplatform == "typescript" %}
+
+ {% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/stock-chart/working-with-data-cs1/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/stock-chart/working-with-data-cs1/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/stock-chart/working-with-data-cs1" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/stock-chart/working-with-data-cs1/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/stock-chart/working-with-data-cs1/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/stock-chart/working-with-data-cs1" %}
+{% endif %}
+
+## Handling No Data
+
+When no data is available to render in the stock chart, the `noDataTemplate` property can be used to display a custom layout within the chart area. This layout may include a message indicating the absence of data, a relevant image, or a button to initiate data loading. Styled text, images, or interactive elements can be incorporated to maintain design consistency and improve user guidance. Once data becomes available, the chart automatically updates to display the appropriate visualization.
+
+{% if page.publishingplatform == "typescript" %}
+
+ {% tabs %}
+{% highlight ts tabtitle="index.ts" %}
+{% include code-snippet/stock-chart/working-with-data-cs2/index.ts %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/stock-chart/working-with-data-cs2/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/stock-chart/working-with-data-cs2" %}
+
+{% elsif page.publishingplatform == "javascript" %}
+
+{% tabs %}
+{% highlight js tabtitle="index.js" %}
+{% include code-snippet/stock-chart/working-with-data-cs2/index.js %}
+{% endhighlight %}
+{% highlight html tabtitle="index.html" %}
+{% include code-snippet/stock-chart/working-with-data-cs2/index.html %}
+{% endhighlight %}
+{% endtabs %}
+
+{% previewsample "page.domainurl/code-snippet/stock-chart/working-with-data-cs2" %}
+{% endif %}
+
+## See Also
+
+* [Series Types](./series-types/)
\ No newline at end of file
diff --git a/ej2-typescript-toc.html b/ej2-typescript-toc.html
new file mode 100644
index 000000000..ffb0cf0e4
--- /dev/null
+++ b/ej2-typescript-toc.html
@@ -0,0 +1,3507 @@
+
+
+
+- Introduction
+- Deployment
+- Browser Compatibility
+- API Reference
+- Security Advisories
+-
+ Getting started
+
+
+-
+ Installation and upgrade
+
+
+-
+ Licensing
+
+
+-
+ Appearance
+
+
+-
+ Common
+
+
+
+-
+ 3D Chart
+
+
-
+Accordion
+
+
-
+AccumulationChart
+
+
+-
+ AI AssistView
+
+
+-
+Appbar
+
+
-
+AutoComplete
+
+
+-
+Avatar
+
+
-
+Badge
+
+
+-
+Barcode
+
+
- Block Editor
+
+
-
+Breadcrumb
+
+
-
+Bullet Chart
+
+
-
+ButtonGroup
+
+
-
+Button
+
+
-
+Calendar
+
+
-
+Card
+
+
-
+Carousel
+
+
-
+Chart
+
+
+-
+ Chat UI
+
+
+-
+CheckBox
+
+
-
+Chips
+
+
-
+ 3D Circular Chart
+
+
-
+Circular Gauge
+
+
-
+Color Picker
+
+
-
+ComboBox
+
+
+-
+ContextMenu
+
+
-
+DashboardLayout
+
+
-
+DataManager
+
+
+-
+DatePicker
+
+
-
+DateRangePicker
+
+
-
+DateTimePicker
+
+
-
+ Diagram
+
+
-
+Dialog
+
+
+-
+DropDown Menu
+
+
-
+DropDownList
+
+
+-
+Dropdown Tree
+
+
-
+FileManager
+
+
-
+Floating Action Button
+
+
-
+Form Validator
+
+
-
+ Gantt
+
+
-
+Grid
+
+
+-
+HeatMap Chart
+
+
-
+Image Editor
+
+
-
+InPlaceEditor
+
+
-
+Kanban
+
+
-
+Linear Gauge
+
+
-
+List Box
+
+
-
+ListView
+
+
-
+Maps
+
+
- Markdown Editor
+
+
-
+MaskedTextBox
+
+
-
+Mention
+
+
-
+Menu Bar
+
+
-
+Message
+
+
-
+ MultiColumn ComboBox
+
+
-
+MultiSelect
+
+
+-
+NumericTextBox
+
+
-
+ OTP Input
+
+
-
+Pager
+
+
-
+PDF Viewer
+
+
+-
+Pivot Table
+
+
+-
+Predefined Dialogs
+
+
-
+Progressbar
+
+
-
+ProgressButton
+
+
-
+Query Builder
+
+
-
+RadioButton
+
+
-
+Range Navigator
+
+
-
+Range Slider
+
+
+-
+Rating
+
+
-
+Ribbon
+
+
+-
+RichTextEditor
+
+
-
+Schedule
+
+
+-
+Sidebar
+
+
+-
+Signature
+
+
-
+Skeleton
+
+
-
+Smart Paste Button
+
+
-
+Smart TextArea
+
+
-
+Smithchart
+
+
-
+Sparkline
+
+
- Speech To Text
+
+
-
+SpeedDial
+
+
-
+Spinner
+
+
-
+SplitButton
+
+
-
+Splitter
+
+
-
+Stepper
+
+
+-
+Stock Chart
+
+
-
+Switch
+
+
-
+Tabs
+
+
-
+ TextArea
+
+
-
+TextBox
+
+
-
+ Timeline
+
+
-
+TimePicker
+
+
-
+Toast
+
+
-
+Toolbar
+
+
-
+Tooltip
+
+
- TreeGrid
+
+
+-
+Treemap
+
+
-
+TreeView
+
+
-
+Uploader
+
+
- Release Notes
+
+ - 2025 Volume 3 - 31.*
+ - 2025 Volume 2 - 30.*
- 2025 Volume 1 - 29.*
- 2024 Volume 4 - 28.*
- 2024 Volume 3 - 27.*
- 2024 Volume 2 - 26.*
- 2024 Volume 1 - 25.*
+ - 2023 Volume 4 - 24.*
+ - 2023 Volume 3 - 23.*
+ - 2023 Volume 2 - 22.*
+
+
+ - 2023 Volume 1 - 21.*
+
+
+ - 2022 Volume 4 - 20.4.*
+
+
+ - 2022 Volume 3 - 20.3.*
+
+
+ - 2022 volume 2 - 20.2.*
+
+
+ - 2022 volume 1 - 20.1.*
+
+
+ - 2021 Volume 4 - 19.4.*
+
+
+ - 2021 volume 3 - 19.3.*
+
+
+ - 2021 Volume 2 - 19.2.*
+
+
+ - 2021 volume 1 - 19.1.*
+
+
+ - 2020 volume 4 - 18.4.*
+
+
+ - 2020 volume 3 - 18.3.*
+
+
+ - 2020 volume 2 - 18.2.*
+
+
+ - 2020 volume 1 - 18.1.*
+
+
+ - 2019 volume 4 - 17.4.*
+
+
+ - 2019 Volume 3 - 17.3.*
+
+
+ - 2019 Volume 2 - 17.2.*
+
+
+ - 2019 Volume 1 - 17.1.*
+
+
+ - 2018 Volume 4 - v16.4.*
+
+
+ - 2018 Volume 3 - v16.3.*
+
+
+ - 2018 Volume 2 - v16.2.*
+
+
+ - 2018 Volume 1 - 16.1.*
+
+
+ - 2017 Volume 4 - 15.4.*
+
+
+
+
+
\ No newline at end of file