Apr 14, 2016, 10:39 AM
Error on Chart controls (Label , Renderer , Tooltip ) giving parser errors
Using MVC 4 , Ext.net 4.0
We are in process of upgrading Ext.net 2.0 to 4.0
Getting following parser errors
1) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Tooltip' is of type 'System.Web.UI.HtmlControls.HtmlGenericControl'.
2) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Renderer' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.
3) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Label' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.
Example followed from link : https://examples4.ext.net/#/Chart/Column/Basic/
Code :
We are in process of upgrading Ext.net 2.0 to 4.0
Getting following parser errors
1) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Tooltip' is of type 'System.Web.UI.HtmlControls.HtmlGenericControl'.
2) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Renderer' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.
3) Ext.Net.SeriesCollection must have items of type 'Ext.Net.Series'. 'Label' is of type 'System.Web.UI.HtmlControls.HtmlGeneriControl'.
Example followed from link : https://examples4.ext.net/#/Chart/Column/Basic/
Code :
<ext:Panel runat="server" ID="pnlChart" ItemID="pnlChart" Layout="HBoxLayout" Padding="2" Height="335px" Border="false" Region="Center" AutoScroll="true" >
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch"></ext:HBoxLayoutConfig>
</LayoutConfig>
<Items>
<ext:CartesianChart
ID="Chart1"
runat="server" EnableTheming="true"
Shadow="true"
StyleSpec="background:#fff"
Animate="true" Flex="4" Margins="5">
<AnimationConfig Easing="BounceOut" Duration="1000" />
<Store>
<ext:Store ID="storeChart" ItemID="storeChart" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChart%>">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="val" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Axes>
<ext:NumericAxis
Fields="val"
Grid="true"
Title=""
Minimum="0" AdjustByMajorUnit="true" Maximum="<%#ViewBag.MaxLabelCount%>" AutoDataBind="true">
<Label>
<Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
</Label>
</ext:NumericAxis>
<ext:CategoryAxis
Position="Bottom"
Fields="id"
Title="US Label Count">
<%--<Label>
<Rotate Degrees="270" />
</Label>--%>
</ext:CategoryAxis>
</Axes>
<Series>
<ext:BarSeries
<%--Axis="Left"--%>
Highlight="true"
XField="id"
YField="val">
<Tooltip ID="Tips1" runat="server" TrackMouse="true" Width="140" Height="28">
<%--<Renderer Handler="this.setTitle(storeItem.get('id') + ': ' + storeItem.get('val'));" />--%>
<Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + (storeItem.get('id').toLowerCase()=='uk spc' ? storeItem.get('id') : (storeItem.get('id')+ ' Labels')));" />
</Tooltip>
<Label
Display="InsideEnd"
Field="val"
Orientation="Horizontal"
Color="#333"
<%--Contrast="true"--%>
>
<Renderer Handler="return Ext.util.Format.number(value, '0');" />
</Label>
<Renderer Fn="barRenderer" />
</ext:BarSeries>
</Series>
</ext:CartesianChart>
<ext:CartesianChart
runat="server"
Shadow="true" EnableTheming="true"
StyleSpec="background:#fff"
Animate="true" Flex="4" Margins="5">
<AnimationConfig Easing="BounceOut" Duration="1000" />
<Store>
<ext:Store ID="storeChartUk" ItemID="storeChartUk" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChartUk%>">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="val" />
<%--<ext:ModelField Name="archived" />
<ext:ModelField Name="current" />--%>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Axes>
<ext:NumericAxis
Fields="val"
Grid="true"
Title=""
Minimum="0" AdjustByMajorUnit="true" Maximum="<%#ViewBag.MaxSPCCount%>" AutoDataBind="true">
<Label>
<Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
</Label>
</ext:NumericAxis>
<ext:CategoryAxis
Position="Bottom"
Fields="id"
Title="UK SPC Count" />
</Axes>
<%--<Background Fill="rgb(232,246,252)" StandardTheme="Category5" />--%>
<Series>
<ext:BarSeries
<%--Axis="Left" --%>
Stacked="true"
Highlight="true"
XField="id"
YField="val">
<%--<Tooltip ID="Tips3" runat="server" TrackMouse="true" Width="140" Height="28">--%>
<Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + (storeItem.get('id').toLowerCase()=='uk SPC' ? storeItem.get('id') : (storeItem.get('id')+ ' SPCs')));" />
<%--<Renderer Handler="this.setTitle(String(item.value[1] / 1000000) + 'M');" />--%>
<%--</Tooltip>--%>
<Label
Display="InsideEnd"
Field="val"
Orientation="Horizontal"
Color="#333"
<%--Contrast="true"--%>
>
<Renderer Handler="return Ext.util.Format.number(value, '0');" />
</Label>
<Renderer Fn="barRenderer" />
</ext:BarSeries>
</Series>
</ext:CartesianChart>
<ext:CartesianChart
ID="Chart2"
runat="server"
Shadow="true"
StyleSpec="background:#fff"
Animate="true" Flex="3" Margins="5">
<AnimationConfig Easing="BounceOut" Duration="1000" />
<Store>
<ext:Store ID="storeChart2" ItemID="storeChart2" runat="server" AutoDataBind="true" Data="<%#ViewBag.dtStoreChart2%>">
<Model>
<ext:Model ID="Model2" runat="server">
<Fields>
<ext:ModelField Name="id" />
<ext:ModelField Name="val" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<%--<Background Fill="rgb(242,250,252)" />--%>
<Axes>
<ext:NumericAxis
Fields="val"
Grid="true"
Title="" AutoDataBind="true"
Minimum="0" Maximum="<%#ViewBag.WeeklyUpdateMax%>" AdjustByMajorUnit="true">
<Label>
<Renderer Handler="return Ext.util.Format.number(value, '0,0');" />
</Label>
</ext:NumericAxis>
<ext:CategoryAxis
Position="Bottom"
Fields="id"
Title="Weekly Stats" />
</Axes>
<Series>
<ext:BarSeries
<%--Axis="Left"--%>
Highlight="true"
XField="id"
YField="val">
<%--<Tooltip ID="Tips2" runat="server" TrackMouse="true" Width="130" Height="40">--%>
<%--<Renderer Handler="this.setTitle(storeItem.get('val') + ' ' + storeItem.get('id') +' Labels <br> Click to view');" />--%>
<%-- +'<br> Click to view details'--%>
<%-- </Tooltip>--%>
<Label
Display="InsideEnd"
Field="val"
Orientation="Horizontal"
Color="#333"
<%-- Contrast="true"--%>
>
<Renderer Handler="return Ext.util.Format.number(value, '0');" />
</Label>
<Listeners>
<ItemClick Handler="welcomeScreen.fillWeeklyStatsGrid(item);"></ItemClick>
</Listeners>
<Renderer Fn="barRenderer" />
</ext:BarSeries>
</Series>
</ext:CartesianChart>
</Items>
</ext:Panel>
