Chart tooltip docs update (#86)

* chore(chart): removed padding and border from chart tooltip docs

* chore(chart): updated chart tooltip context template

* chore(chart): improvements to chart tooltip context template file

* docs(chart): minor improvements on tooltip context details

* chore(chart): updated common tooltip gif size

* chore(chart): updated chart tooltip overview article

Co-authored-by: Marin Bratanov <m.bratanov@gmail.com>

Author: svdimitr

_contentTemplates/chart/chart-tooltip-context-templates.md

@@ -2,7 +2,13 @@
 * `FormattedValue` - maps to the default rendering of the tooltip, formatted as a string.
  * Use this when the chart's data is bound by [Independent Series Binding]({%slug components/chart/databind%}#independent-series-binding). You can parse this to a numerical value (`int`, `double`, etc.) in order to apply formatting. Otherwise, use the `DataItem` to get the value of the point.
 
-* `DataItem` - provides the data model of the current series item. You may need to cast it to its type.
+* `DataItem` - provides the data model of the current series item. You need to cast it to the type from your datasource, which needs to be serializable. 
+
+    * If you are using a [Date Axis]({%slug components/chart/date-axis%}), the `DataItem` will contain the only the aggregated value in the corresponding y-value field, because it is a collection of more than one items. See the `Category` below for details.
+
+* `Category` - provides information on the category the data point is located in. You need to cast it to the type in your data source, for example `DateTime`, `string`, `int` or another type. The `Category` parameter is applicable to [Categorical Charts]({%slug components/chart/databind%}#series-types).
+
+    * When using a [Date Axis]({%slug components/chart/date-axis%}), you can use it, together with the `BaseUnit` value of the axis, to filter the data source and obtain the actual data items from the data source in case you want to provide extra information about them.
 
 * `Percentage` - applicable to [Donut]({%slug components/chart/types/donut%}), [Pie]({%slug components/chart/types/pie%}) and [Stacked 100%]({%slug components/chart/stack%}#stack-100) Charts - the percentage value of the current data point from the whole.
 
@@ -22,8 +28,4 @@
 * `Color` - control the text color by applying a CSS color string, including HEX and RGB.
 
 * `Opacity` - control the opacity of the tooltip.
-
-* `Border` - control the `Color` and the `Width` of the tooltip by using the `<ChartSeriesTooltipBorder />` nested inside the `<ChartSeriesTooltip>` tag.
-
-* `Padding` - control the `Left`, `Right`, `Top` and `Bottom` padding of the tooltip by using the `<ChartSeriesTooltipPadding />` nested inside the `<ChartSeriesTooltip>` tag.
 #end

components/chart/tooltip/images/tooltip-common-example.gif

@@ -129,10 +129,6 @@ You can customize the appearance of the individual series tooltip by using:
 
 * `Color` - control the text color by applying a CSS color string, including HEX and RGB.
 
-* `Border` - control the `Color` and the `Width` of the tooltip by using the `<ChartSeriesTooltipBorder />` nested inside the `<ChartSeriesTooltip>` tag.
-
-* `Padding` - control the `Left`, `Right`, `Top` and `Bottom` padding of the tooltip by using the `<ChartSeriesTooltipPadding />` nested inside the `<ChartSeriesTooltip>` tag.
-
 * Use the [Template](#template) to take control over what is rendered in the tooltip.
 
 >caption Configuration of the tooltips with applied customization settings
@@ -149,8 +145,6 @@ You can customize the appearance of the individual series tooltip by using:
             <ChartSeriesTooltip Visible="true"
                                 Background="#0000FF"
                                 Color="#D3D3D3">
-                <ChartSeriesTooltipBorder Color="#ADD8E6" Width="10" />
-                <ChartSeriesTooltipPadding Top="10" Bottom="10" Left="15" Right="15" />
             </ChartSeriesTooltip>
         </ChartSeries>
     </ChartSeriesItems>
@@ -199,7 +193,7 @@ You can customize the appearance of the individual series tooltip by using:
 
 #### Common Tooltip Settings
 
-In a similar fashion, you can declare these settings in the common tooltip section. Their tag names are slightly different, however:
+In a similar fashion, you can declare these settings in the common tooltip section:
 
 @[template](/_contentTemplates/chart/chart-tooltip-context-templates.md#shared-tooltip-parameter-settings)
 
@@ -264,7 +258,7 @@ The available series data point information in the `context` is:
     }
 
     public List<MyDataModel> modelData = new List<MyDataModel>()
-{
+    {
         new MyDataModel() { SecondSeriesValue = 1, ExtraData = "first" },
         new MyDataModel() { SecondSeriesValue = 5, ExtraData = "second" },
         new MyDataModel() { SecondSeriesValue = 3, ExtraData = "third" },