May 01, 2013, 8:55 PM
[OPEN] [#227] Scatter series label problem
Hello,
Please investigate the code below. Series labels are not rendered correctly. If I disable the store field converter, it is rendered correctly but empty values are also rendered on the chart (which I do not want).
Figure:
Code:
Please investigate the code below. Series labels are not rendered correctly. If I disable the store field converter, it is rendered correctly but empty values are also rendered on the chart (which I do not want).
Figure:
Code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = this.TestData();
this.Store1.DataBind();
}
}
private List<object> TestData()
{
List<object> data = new List<object>
{
new {
ID = 0,
Name = "Item 01",
XVal = 1,
Data1 = 1,
Data2 = "",
Data3 = ""
},
new {
ID = 1,
Name = "Item 02",
XVal = 2,
Data1 = 2,
Data2 = "",
Data3 = ""
},
new {
ID = 2,
Name = "Item 03",
XVal = 3,
Data2 = 3,
Data1 = "",
Data3 = ""
},
new {
ID = 3,
Name = "Item 04",
XVal = 4,
Data2 = 4,
Data1 = "",
Data3 = ""
},
new {
ID = 4,
Name = "Item 05",
XVal = 5,
Data3 = 5,
Data1 = "",
Data2 = ""
},
new {
ID = 5,
Name = "Item 06",
XVal = 6,
Data3 = 6,
Data1 = "",
Data2 = ""
}
};
return data;
}
</script>
<script type="text/javascript">
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Scatter Series Labels</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" SourceFormatting="True" />
<ext:Panel ID="Panel1" runat="server" Width="800" Height="500" Layout="FitLayout">
<Items>
<ext:Chart ID="Chart1" runat="server" StyleSpec="background:#fff;" Animate="false" Flex="1" Legend="true">
<Store>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" Type="Int" />
<ext:ModelField Name="XVal" Type="Int" />
<ext:ModelField Name="Name" Type="String" />
<ext:ModelField Name="Data1" Type="Int">
<Convert Handler="if(value==''){value=undefined;} return value;"></Convert>
</ext:ModelField>
<ext:ModelField Name="Data2" Type="Int">
<Convert Handler="if(value==''){value=undefined;} return value;"></Convert>
</ext:ModelField>
<ext:ModelField Name="Data3" Type="Int">
<Convert Handler="if(value==''){value=undefined;} return value;"></Convert>
</ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Axes>
<ext:NumericAxis Title="Vaue Y" Fields="Data1,Data2,Data3" Position="Left" Minimum="0" Maximum="10">
</ext:NumericAxis>
<ext:NumericAxis Title="Value X" Position="Bottom" Minimum="0" Maximum="10">
</ext:NumericAxis>
</Axes>
<Series>
<ext:ScatterSeries Axis="Bottom" XField="XVal" YField="Data1">
<MarkerConfig Type="Circle" Radius="7" Size="7" />
<HighlightConfig Size="10" Radius="10" />
<Label Display="Over" Field="Name" Orientation="Horizontal" FontSize="10"></Label>
<Tips TrackMouse="true" Width="100">
<Renderer Handler="this.setTitle(storeItem.data.Name);"></Renderer>
</Tips>
</ext:ScatterSeries>
<ext:ScatterSeries Axis="Bottom" XField="XVal" YField="Data2">
<MarkerConfig Type="Cross" Radius="7" Size="7" />
<HighlightConfig Size="10" Radius="10" />
<Label Display="Over" Field="Name" Orientation="Horizontal" FontSize="10"></Label>
<Tips TrackMouse="true" Width="100">
<Renderer Handler="this.setTitle(storeItem.data.Name);"></Renderer>
</Tips>
</ext:ScatterSeries>
<ext:ScatterSeries Axis="Bottom" XField="XVal" YField="Data3">
<MarkerConfig Type="Diamond" Radius="7" Size="7" />
<HighlightConfig Size="10" Radius="10" />
<Label Display="Over" Field="Name" Orientation="Horizontal" FontSize="10"></Label>
<Tips TrackMouse="true" Width="100">
<Renderer Handler="this.setTitle(storeItem.data.Name);"></Renderer>
</Tips>
</ext:ScatterSeries>
</Series>
</ext:Chart>
</Items>
</ext:Panel>
</form>
</body>
</html>
Last edited by Daniil; May 03, 2013 at 4:45 AM.
Reason: [OPEN] [#227]