PDA

View Full Version : [CLOSED] chart isn't shown



tactime10
Oct 15, 2012, 5:24 PM
Hi,
I created my page with chart click enabled, now when I click on column of first chart, I create from codebehind
new chart that I would to show but I don't see nothing

I run the code below into the last version of firefox


<%@ Page Language = "C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
public class MonitorViewer
{
private double yieldValue;
private int pnFirstOk;
private int pnFirstKo;
private int pnTotalPass;
private string period;

public MonitorViewer() {}

public double YieldValue {
get { return yieldValue; }
set { yieldValue = value; }
}

public int PnFirstOk {
get { return pnFirstOk; }
set { pnFirstOk = value; }
}

public int PnFirstKo {
get { return pnFirstKo; }
set { pnFirstKo = value; }
}

public int PnTotalPass {
get { return pnTotalPass; }
set { pnTotalPass = value; }
}

public string Period {
get { return period; }
set { period = value; }
}
}

public object[] DataValue () {
IList<MonitorViewer> listItems = new List<MonitorViewer>();
MonitorViewer monitorViewer1 = new MonitorViewer();
monitorViewer1.YieldValue = Double.Parse("95,97");
monitorViewer1.Period= "30/03/12 - 20/04/12";
monitorViewer1.PnFirstOk = 7507;
monitorViewer1.PnFirstKo = 315;
monitorViewer1.PnTotalPass = 7994;

MonitorViewer monitorViewer2 = new MonitorViewer();
monitorViewer2.YieldValue = Double.Parse("96,68");
monitorViewer2.Period= "20/04/12 - 12/05/12";
monitorViewer2.PnFirstOk = 5995;
monitorViewer2.PnFirstKo = 206;
monitorViewer2.PnTotalPass = 6504;

MonitorViewer monitorViewer3 = new MonitorViewer();
monitorViewer3.YieldValue = Double.Parse("95,91");
monitorViewer3.Period= "12/05/12 - 03/06/12";
monitorViewer3.PnFirstOk = 9732;
monitorViewer3.PnFirstKo = 415;
monitorViewer3.PnTotalPass = 10209;

MonitorViewer monitorViewer4 = new MonitorViewer();
monitorViewer4.YieldValue = Double.Parse("96,09");
monitorViewer4.Period= "03/06/12 - 24/06/12";
monitorViewer4.PnFirstOk = 6710;
monitorViewer4.PnFirstKo = 273;
monitorViewer4.PnTotalPass = 7309;

MonitorViewer monitorViewer5 = new MonitorViewer();
monitorViewer5.YieldValue = Double.Parse("96,29");
monitorViewer5.Period= "24/06/12 - 16/07/12";
monitorViewer5.PnFirstOk = 1922;
monitorViewer5.PnFirstKo = 74;
monitorViewer5.PnTotalPass = 2021;

MonitorViewer monitorViewer6 = new MonitorViewer();
monitorViewer6.YieldValue = Double.Parse("0,0");
monitorViewer6.Period= "16/07/12 - 07/08/12";
monitorViewer6.PnFirstOk = 0;
monitorViewer6.PnFirstKo = 0;
monitorViewer6.PnTotalPass = 0;

MonitorViewer monitorViewer7 = new MonitorViewer();
monitorViewer7.YieldValue = Double.Parse("0,0");
monitorViewer7.Period= "07/08/12 - 28/08/12";
monitorViewer7.PnFirstOk = 0;
monitorViewer7.PnFirstKo = 0;
monitorViewer7.PnTotalPass = 0;

listItems.Add(monitorViewer1);
listItems.Add(monitorViewer2);
listItems.Add(monitorViewer3);
listItems.Add(monitorViewer4);
listItems.Add(monitorViewer5);
listItems.Add(monitorViewer6);
listItems.Add(monitorViewer7);

object[] periodArray = new object
[listItems.Count];
for (int i = 0;i < listItems.Count;i++) {
MonitorViewer monitorViewer = listItems[i];
object[] itemArray = new object[]{monitorViewer.YieldValue,monitorViewer.Period,mon itorViewer.PnFirstOk,monitorViewer.PnFirstKo,monit orViewer.PnTotalPass};

periodArray[i] = itemArray;
}
return periodArray;
}

public void Page_Load() {
//var store = this.yieldChart.GetStore();
//store.DataSource = DataValue();
//store.DataBind();
}

protected void ExtractData(object sender, DirectEventArgs e) {
this.panel1.Hidden = false;
var store = this.yieldChart.GetStore();
store.DataSource = DataValue();
store.DataBind();
}


public void SetUpChartLevels(Chart chartAnalysisLevel) {
chartAnalysisLevel.Height = 500;
chartAnalysisLevel.Theme = "CustomThemeAnalysis";
chartAnalysisLevel.Animate = true;
chartAnalysisLevel.Shadow = true;

Store storeAnalysisLevel = new Store();
storeAnalysisLevel.ID = "storeAnalysisLevel";
storeAnalysisLevel.Reader.Add(new Ext.Net.ArrayReader());

ModelField modelFieldDefectiveness = new ModelField("defectiveness");
ModelField modelFieldFirstPass = new ModelField("firstPass");
ModelField modelFieldFirstFail = new ModelField("firstFail");
ModelField modelFieldPartNumber = new ModelField("partNumber");

Model model = new Model();
model.Fields.Add(modelFieldDefectiveness);
model.Fields.Add(modelFieldFirstPass);
model.Fields.Add(modelFieldFirstFail);
model.Fields.Add(modelFieldPartNumber);

storeAnalysisLevel.Model.Add(model);

NumericAxis numericAxisDefectiveness = new NumericAxis();
numericAxisDefectiveness.Fields = new string[]{"defectiveness"};
numericAxisDefectiveness.Position = Position.Left;
numericAxisDefectiveness.Minimum = 0;

NumericAxis numericFirstPass = new NumericAxis();
numericFirstPass.Fields = new string[]{"firstFail","firstPass"};
numericFirstPass.Position = Position.Right;
numericFirstPass.Minimum = 0;
numericFirstPass.Hidden = true;

CategoryAxis categoryAxis = new CategoryAxis();
categoryAxis.Position = Position.Bottom;
categoryAxis.Fields = new string[]{"partNumber"};
AxisLabel axisLabel = new AxisLabel();
RotateAttribute rotate = new RotateAttribute();
rotate.Degrees = 270;
axisLabel.Rotate = rotate;
axisLabel.Renderer.Handler = "return Ext.String.ellipsis(value, 15, false);";
categoryAxis.Label = axisLabel;

chartAnalysisLevel.Axes.Add(numericAxisDefectivene ss);
chartAnalysisLevel.Axes.Add(categoryAxis);

ColumnSeries columnSeries = new ColumnSeries();
columnSeries.Axis = Position.Left;
columnSeries.Highlight = true;
columnSeries.XField = new string[]{"partNumber"};
columnSeries.YField = new string[]{"defectiveness"};

columnSeries.Listeners.ItemMouseUp.Handler = "App.direct.OnItemMouseUp()";

LineSeries lineSeriesFirstFail = new LineSeries();
lineSeriesFirstFail.Axis = Position.Right;
lineSeriesFirstFail.Highlight = true;
lineSeriesFirstFail.Smooth = 3;
lineSeriesFirstFail.XField = new string[]{"partNumber"};
lineSeriesFirstFail.YField = new string[]{"firstFail"};
lineSeriesFirstFail.ShowMarkers = true;

LineSeries lineSeriesFirstPass = new LineSeries();
lineSeriesFirstPass.Axis = Position.Right;
lineSeriesFirstPass.Highlight = true;
lineSeriesFirstPass.Smooth = 3;
lineSeriesFirstPass.XField = new string[]{"partNumber"};
lineSeriesFirstPass.YField = new string[]{"firstPass"};
lineSeriesFirstPass.ShowMarkers = true;

chartAnalysisLevel.Series.Add(columnSeries);

chartAnalysisLevel.Store.Add(storeAnalysisLevel);
}

public List<object> CreateItems() {
List<object> listDefectivenessItems = new List<object> ();

listDefectivenessItems.Add(new object[]{"50,6","25","24","partnumber1"});
listDefectivenessItems.Add(new object[]{"40,6","20","24","partnumber2"});
listDefectivenessItems.Add(new object[]{"55,3","26","22","partnumber3"});
listDefectivenessItems.Add(new object[]{"22,6","12","28","partnumber4"});
listDefectivenessItems.Add(new object[]{"32,1","18","56","partnumber5"});
listDefectivenessItems.Add(new object[]{"12,0","10","34","partnumber6"});
return listDefectivenessItems;
}

[DirectMethod]
public void OnItemMouseUp() {
FormPanel formPanelLevel = new FormPanel();
formPanelLevel.ID = "formPanelLevel";
formPanelLevel.Border = false;
formPanelLevel.Height = 600;
formPanelLevel.MarginSpec = "0 5 5 5";
formPanelLevel.Frame = true;
formPanelLevel.BodyPadding = 5;
formPanelLevel.Hidden = false;
formPanelLevel.Collapsed = false;
formPanelLevel.Collapsible = false;
HBoxLayoutConfig hBoxLayoutConfig = new HBoxLayoutConfig();
hBoxLayoutConfig.Align = HBoxAlign.Stretch;
formPanelLevel.LayoutConfig.Add(hBoxLayoutConfig);

formPanelLevel.Show();
formPanelLevel.AddTo(panelContentLevels);
this.panelContentLevels.Show();

Ext.Net.Panel panelLevels = new Ext.Net.Panel();
panelLevels.Flex = 1;
panelLevels.ID = "panelLevels";
panelLevels.Layout = "FitLayout";
panelLevels.Title = "Chart";

Chart chartAnalysisLevel = new Chart();
chartAnalysisLevel.ID = "chartAnalysisLevel";
SetUpChartLevels(chartAnalysisLevel);
panelLevels.Items.Add(chartAnalysisLevel);

Ext.Net.Label labelError = new Ext.Net.Label();
labelError.ID = "labelError";
chartAnalysisLevel.GetStore().DataSource = CreateItems();
chartAnalysisLevel.DataBind();

panelLevels.AddTo(formPanelLevel);
panelLevels.Show();
}

</script>
<script type="text/javascript">
var onMouseUp = function (item) {
App.direct.OnItemMouseUp();
};
</script>

<body>
<form Method=post Runat="server">
<ext:ResourceManager Id="resourceManager" runat="server" />
<br/>
<h3>Example</h3>
<br/>
<ext:Panel id="panelFilter" runat="server" MarginSpec="0 5 5 0" Border="false"
AutoHeight="false" Header="false" Collapsible="false" CollapseMode="Mini" BodyPadding="5" >
<Items>
<ext:FieldSet Id="fieldSetFilterLeadtime" runat="server" Title="Filter" Collapsible="true" Layout="AnchorLayout"
ButtonAlign="Right" BodyPadding="5">
<Items>
<ext:Panel runat="server" Layout="HBoxLayout" Border="false" AutoHeight="true" Header="false">
<Defaults>
<ext:Parameter Name="margins" Value="5 0 0 0" Mode="Value" />
</Defaults>
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Middle" />
</LayoutConfig>
<Items>
<ext:Button ID="btnSearch" Text="Search" runat="server" Hidden="false" Icon="Magnifier" >
<DirectEvents>
<Click OnEvent="ExtractData">
<EventMask ShowMask="true" MinDelay="100"/>
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Panel>
</Items>
</ext:FieldSet>
</Items>
</ext:Panel>
<ext:ChartTheme
ID="CustomThemeID"
runat="server"
ThemeName="CustomTheme"
Colors="url(#blueColor),url(#greenColor),url(#redColor),ur l(#orangeColor)">
</ext:ChartTheme>
<ext:ChartTheme
ID="CustomThemeAnalysisID"
runat="server"
ThemeName="CustomThemeAnalysis"
Colors="url(#orangeColor),url(#redColor),url(#greenColor), url(#blueColor)">
</ext:ChartTheme>

<ext:FormPanel ID="panel1" runat="server" Title="Items found" MarginSpec="0 5 5 5"
Frame="true" BodyPadding="5" Hidden="true" Icon="ApplicationFormMagnify" >
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Bin>
<ext:Store ID="yieldStore" runat="server" >
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="yield"/>
<ext:ModelField Name="period"/>
<ext:ModelField Name="pnFirstOk"/>
<ext:ModelField Name="pnFirstKo"/>
<ext:ModelField Name="pnTotalPass"/>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Bin>
<Items>
<ext:FormPanel runat="server" Border="false" Height="600" >
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:Panel runat="server" Border="true" Layout="FitLayout" Flex="1" Title="Monitor">
<Items>
<ext:Chart
ID="yieldChart"
runat="server"
Flex="1"
Theme="CustomTheme"
Shadow="true"
Animate="true"
StoreID="yieldStore">

<Gradients>
<ext:Gradient GradientID="redColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#e21413" />
<ext:GradientStop Offset="100" Color="#d82931" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="orangeColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#ecbe38" />
<ext:GradientStop Offset="100" Color="#dc9614" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="greenColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#3ed730" />
<ext:GradientStop Offset="100" Color="#3ea830" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="blueColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#4868e7" />
<ext:GradientStop Offset="100" Color="#3c56bf" />
</Stops>
</ext:Gradient>
</Gradients>

<Axes>
<ext:NumericAxis Position="Left" Fields="yield" Minimum="0" />
<ext:NumericAxis Position="Right" Minimum="0" Fields="pnFirstOk,pnFirstKo,pnTotalPass" Hidden="true">
</ext:NumericAxis>
<ext:CategoryAxis Position="Bottom" Fields="period">
<Label Font="10px Arial">
<Rotate Degrees="270" />
<Renderer Handler="return Ext.String.ellipsis(value, 15, false);" />
</Label>
</ext:CategoryAxis>
</Axes>

<Series>
<ext:ColumnSeries Axis="Left" Highlight="true" XField="period" YField="yield">
<Style Fill="#38B8BF" StrokeWidth="3" />
<Label Contrast="true" Display="Under" Field="yield" Color="#000" TextAnchor="middle" />
<Listeners>
<ItemMouseUp Fn="onMouseUp" />
</Listeners>
</ext:ColumnSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnFirstOk" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnFirstOk" Color="#319915" TextAnchor="Middle" />
</ext:LineSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnFirstKo" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnFirstKo" Color="#CC1700" TextAnchor="Middle" />
</ext:LineSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnTotalPass" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnTotalPass" Color="#C97C00" TextAnchor="Middle" />
</ext:LineSeries>
</Series>
</ext:Chart>
</Items>
</ext:Panel>
</Items>
</ext:FormPanel>
<ext:Panel runat="server" ID="panelContentLevels" Border="false" Hidden="true">
<%--<Items>
<ext:FormPanel ID="formPanelLevels" runat="server" Border="false" Height="600" MarginSpec="0 5 5 5"
Frame="true" BodyPadding="5" Hidden="true" Collapsed="false" Collapsible="false" >
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
</ext:FormPanel>
</Items> --%>
</ext:Panel>
</Items>
</ext:FormPanel>
</form>
</Body>
</Html>

Can you help me?
Thanks

Daniil
Oct 15, 2012, 6:14 PM
Hi @tactime10,

I launched the page and can see the chart after clicking the Button.

Do you use the latest sources? If not, please update and retest.
http://svn.ext.net/premium/branches/2.1/

P.S. Please always simplify code samples removing anything that is not required to reproduce the problem.

tactime10
Oct 16, 2012, 10:03 AM
Hi,

I use version 2.1.0.20528 of Ext.Net.

I update the last version but I see the version of Ext.Net.dll as 2.1.0.19276 it's correct?

Thanks

Daniil
Oct 16, 2012, 10:11 AM
A minor dll revision depends on time when you build the assembly. So, it doesn't identify the version exactly, but SVN revision does.

tactime10
Oct 16, 2012, 10:41 AM
I update Ext.Net at the SVN revision 4422 but into my page I have the same problem.

Daniil
Oct 16, 2012, 12:57 PM
Please clarify these things:

1. Exact steps to reproduce
2. A screenshot how you see a result
3. A browser version

tactime10
Oct 16, 2012, 1:48 PM
1. I posted again my code because I simplified the code that reproduce the problem



<%@ Page Language = "C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
public class MonitorViewer
{
private double yieldValue;
private int pnFirstOk;
private int pnFirstKo;
private int pnTotalPass;
private string period;

public MonitorViewer() {}

public double YieldValue {
get { return yieldValue; }
set { yieldValue = value; }
}

public int PnFirstOk {
get { return pnFirstOk; }
set { pnFirstOk = value; }
}

public int PnFirstKo {
get { return pnFirstKo; }
set { pnFirstKo = value; }
}

public int PnTotalPass {
get { return pnTotalPass; }
set { pnTotalPass = value; }
}

public string Period {
get { return period; }
set { period = value; }
}
}

public object[] DataValue () {
IList<MonitorViewer> listItems = new List<MonitorViewer>();
MonitorViewer monitorViewer1 = new MonitorViewer();
monitorViewer1.YieldValue = Double.Parse("95,97");
monitorViewer1.Period= "30/03/12 - 20/04/12";
monitorViewer1.PnFirstOk = 7507;
monitorViewer1.PnFirstKo = 315;
monitorViewer1.PnTotalPass = 7994;

MonitorViewer monitorViewer2 = new MonitorViewer();
monitorViewer2.YieldValue = Double.Parse("96,68");
monitorViewer2.Period= "20/04/12 - 12/05/12";
monitorViewer2.PnFirstOk = 5995;
monitorViewer2.PnFirstKo = 206;
monitorViewer2.PnTotalPass = 6504;

MonitorViewer monitorViewer3 = new MonitorViewer();
monitorViewer3.YieldValue = Double.Parse("95,91");
monitorViewer3.Period= "12/05/12 - 03/06/12";
monitorViewer3.PnFirstOk = 9732;
monitorViewer3.PnFirstKo = 415;
monitorViewer3.PnTotalPass = 10209;

MonitorViewer monitorViewer4 = new MonitorViewer();
monitorViewer4.YieldValue = Double.Parse("96,09");
monitorViewer4.Period= "03/06/12 - 24/06/12";
monitorViewer4.PnFirstOk = 6710;
monitorViewer4.PnFirstKo = 273;
monitorViewer4.PnTotalPass = 7309;

MonitorViewer monitorViewer5 = new MonitorViewer();
monitorViewer5.YieldValue = Double.Parse("96,29");
monitorViewer5.Period= "24/06/12 - 16/07/12";
monitorViewer5.PnFirstOk = 1922;
monitorViewer5.PnFirstKo = 74;
monitorViewer5.PnTotalPass = 2021;

MonitorViewer monitorViewer6 = new MonitorViewer();
monitorViewer6.YieldValue = Double.Parse("0,0");
monitorViewer6.Period= "16/07/12 - 07/08/12";
monitorViewer6.PnFirstOk = 0;
monitorViewer6.PnFirstKo = 0;
monitorViewer6.PnTotalPass = 0;

MonitorViewer monitorViewer7 = new MonitorViewer();
monitorViewer7.YieldValue = Double.Parse("0,0");
monitorViewer7.Period= "07/08/12 - 28/08/12";
monitorViewer7.PnFirstOk = 0;
monitorViewer7.PnFirstKo = 0;
monitorViewer7.PnTotalPass = 0;

listItems.Add(monitorViewer1);
listItems.Add(monitorViewer2);
listItems.Add(monitorViewer3);
listItems.Add(monitorViewer4);
listItems.Add(monitorViewer5);
listItems.Add(monitorViewer6);
listItems.Add(monitorViewer7);

object[] periodArray = new object[listItems.Count];
for (int i = 0;i < listItems.Count;i++) {
MonitorViewer monitorViewer = listItems[i];
object[] itemArray = new object[]{monitorViewer.YieldValue,monitorViewer.Period,mon itorViewer.PnFirstOk,monitorViewer.PnFirstKo,monit orViewer.PnTotalPass};

periodArray[i] = itemArray;
}
return periodArray;
}

public void Page_Load() {
this.panel1.Hidden = false;
var store = this.yieldChart.GetStore();
store.DataSource = DataValue();
store.DataBind();
}

public void SetUpChartLevels(Chart chartAnalysisLevel) {
chartAnalysisLevel.Height = 500;
chartAnalysisLevel.Theme = "CustomThemeAnalysis";
chartAnalysisLevel.Animate = true;
chartAnalysisLevel.Shadow = true;

Store storeAnalysisLevel = new Store();
storeAnalysisLevel.ID = "storeAnalysisLevel";
storeAnalysisLevel.Reader.Add(new Ext.Net.ArrayReader());

ModelField modelFieldDefectiveness = new ModelField("defectiveness");
ModelField modelFieldFirstPass = new ModelField("firstPass");
ModelField modelFieldFirstFail = new ModelField("firstFail");
ModelField modelFieldPartNumber = new ModelField("partNumber");

Model model = new Model();
model.Fields.Add(modelFieldDefectiveness);
model.Fields.Add(modelFieldFirstPass);
model.Fields.Add(modelFieldFirstFail);
model.Fields.Add(modelFieldPartNumber);

storeAnalysisLevel.Model.Add(model);

NumericAxis numericAxisDefectiveness = new NumericAxis();
numericAxisDefectiveness.Fields = new string[]{"defectiveness"};
numericAxisDefectiveness.Position = Position.Left;
numericAxisDefectiveness.Minimum = 0;

NumericAxis numericFirstPass = new NumericAxis();
numericFirstPass.Fields = new string[]{"firstFail","firstPass"};
numericFirstPass.Position = Position.Right;
numericFirstPass.Minimum = 0;
numericFirstPass.Hidden = true;

CategoryAxis categoryAxis = new CategoryAxis();
categoryAxis.Position = Position.Bottom;
categoryAxis.Fields = new string[]{"partNumber"};
AxisLabel axisLabel = new AxisLabel();
RotateAttribute rotate = new RotateAttribute();
rotate.Degrees = 270;
axisLabel.Rotate = rotate;
axisLabel.Renderer.Handler = "return Ext.String.ellipsis(value, 15, false);";
categoryAxis.Label = axisLabel;

chartAnalysisLevel.Axes.Add(numericAxisDefectivene ss);
chartAnalysisLevel.Axes.Add(categoryAxis);

ColumnSeries columnSeries = new ColumnSeries();
columnSeries.Axis = Position.Left;
columnSeries.Highlight = true;
columnSeries.XField = new string[]{"partNumber"};
columnSeries.YField = new string[]{"defectiveness"};

columnSeries.Listeners.ItemMouseUp.Handler = "App.direct.OnItemMouseUp()";

LineSeries lineSeriesFirstFail = new LineSeries();
lineSeriesFirstFail.Axis = Position.Right;
lineSeriesFirstFail.Highlight = true;
lineSeriesFirstFail.Smooth = 3;
lineSeriesFirstFail.XField = new string[]{"partNumber"};
lineSeriesFirstFail.YField = new string[]{"firstFail"};
lineSeriesFirstFail.ShowMarkers = true;

LineSeries lineSeriesFirstPass = new LineSeries();
lineSeriesFirstPass.Axis = Position.Right;
lineSeriesFirstPass.Highlight = true;
lineSeriesFirstPass.Smooth = 3;
lineSeriesFirstPass.XField = new string[]{"partNumber"};
lineSeriesFirstPass.YField = new string[]{"firstPass"};
lineSeriesFirstPass.ShowMarkers = true;

chartAnalysisLevel.Series.Add(columnSeries);

chartAnalysisLevel.Store.Add(storeAnalysisLevel);
}

public List<object> CreateItems() {
List<object> listDefectivenessItems = new List<object> ();

listDefectivenessItems.Add(new object[]{"50,6","25","24","partnumber1"});
listDefectivenessItems.Add(new object[]{"40,6","20","24","partnumber2"});
listDefectivenessItems.Add(new object[]{"55,3","26","22","partnumber3"});
listDefectivenessItems.Add(new object[]{"22,6","12","28","partnumber4"});
listDefectivenessItems.Add(new object[]{"32,1","18","56","partnumber5"});
listDefectivenessItems.Add(new object[]{"12,0","10","34","partnumber6"});
return listDefectivenessItems;
}

[DirectMethod]
public void OnItemMouseUp() {
FormPanel formPanelLevel = new FormPanel();
formPanelLevel.ID = "formPanelLevel";
formPanelLevel.Border = false;
formPanelLevel.Height = 250;
formPanelLevel.MarginSpec = "0 5 5 5";
formPanelLevel.Frame = true;
formPanelLevel.BodyPadding = 5;
formPanelLevel.Hidden = false;
formPanelLevel.Collapsed = false;
formPanelLevel.Collapsible = false;
HBoxLayoutConfig hBoxLayoutConfig = new HBoxLayoutConfig();
hBoxLayoutConfig.Align = HBoxAlign.Stretch;
formPanelLevel.LayoutConfig.Add(hBoxLayoutConfig);

formPanelLevel.Show();
formPanelLevel.AddTo(panelContentLevels);
this.panelContentLevels.Show();

Ext.Net.Panel panelLevels = new Ext.Net.Panel();
panelLevels.Flex = 1;
panelLevels.ID = "panelLevels";
panelLevels.Layout = "FitLayout";
panelLevels.Title = "Chart";

Chart chartAnalysisLevel = new Chart();
chartAnalysisLevel.ID = "chartAnalysisLevel";
SetUpChartLevels(chartAnalysisLevel);
panelLevels.Items.Add(chartAnalysisLevel);

Ext.Net.Label labelError = new Ext.Net.Label();
labelError.ID = "labelError";
chartAnalysisLevel.GetStore().DataSource = CreateItems();
chartAnalysisLevel.DataBind();

panelLevels.AddTo(formPanelLevel);
panelLevels.Show();
}

</script>
<script type="text/javascript">
var onMouseUp = function (item) {
App.direct.OnItemMouseUp();
};
</script>

<body>
<form Method=post Runat="server">
<ext:ResourceManager Id="resourceManager" runat="server" />
<br/>
<h3>Example</h3>
<br/>
<ext:ChartTheme
ID="CustomThemeID"
runat="server"
ThemeName="CustomTheme"
Colors="url(#blueColor),url(#greenColor),url(#redColor),ur l(#orangeColor)">
</ext:ChartTheme>
<ext:ChartTheme
ID="CustomThemeAnalysisID"
runat="server"
ThemeName="CustomThemeAnalysis"
Colors="url(#orangeColor),url(#redColor),url(#greenColor), url(#blueColor)">
</ext:ChartTheme>

<ext:FormPanel ID="panel1" runat="server" Title="Items found" MarginSpec="0 5 5 5"
Frame="true" BodyPadding="5" Hidden="true" Icon="ApplicationFormMagnify" >
<LayoutConfig>
<ext:VBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Bin>
<ext:Store ID="yieldStore" runat="server" >
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="yield"/>
<ext:ModelField Name="period"/>
<ext:ModelField Name="pnFirstOk"/>
<ext:ModelField Name="pnFirstKo"/>
<ext:ModelField Name="pnTotalPass"/>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Bin>
<Items>
<ext:FormPanel runat="server" Border="false" Height="250" >
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:Panel runat="server" Border="true" Layout="FitLayout" Flex="1" Title="Monitor">
<Items>
<ext:Chart
ID="yieldChart"
runat="server"
Flex="1"
Theme="CustomTheme"
Shadow="true"
Animate="true"
StoreID="yieldStore">

<Gradients>
<ext:Gradient GradientID="redColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#e21413" />
<ext:GradientStop Offset="100" Color="#d82931" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="orangeColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#ecbe38" />
<ext:GradientStop Offset="100" Color="#dc9614" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="greenColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#3ed730" />
<ext:GradientStop Offset="100" Color="#3ea830" />
</Stops>
</ext:Gradient>

<ext:Gradient GradientID="blueColor" Angle="0">
<Stops>
<ext:GradientStop Offset="0" Color="#4868e7" />
<ext:GradientStop Offset="100" Color="#3c56bf" />
</Stops>
</ext:Gradient>
</Gradients>

<Axes>
<ext:NumericAxis Position="Left" Fields="yield" Minimum="0" />
<ext:NumericAxis Position="Right" Minimum="0" Fields="pnFirstOk,pnFirstKo,pnTotalPass" Hidden="true">
</ext:NumericAxis>
<ext:CategoryAxis Position="Bottom" Fields="period">
<Label Font="10px Arial">
<Rotate Degrees="270" />
<Renderer Handler="return Ext.String.ellipsis(value, 15, false);" />
</Label>
</ext:CategoryAxis>
</Axes>

<Series>
<ext:ColumnSeries Axis="Left" Highlight="true" XField="period" YField="yield">
<Style Fill="#38B8BF" StrokeWidth="3" />
<Label Contrast="true" Display="Under" Field="yield" Color="#000" TextAnchor="middle" />
<Listeners>
<ItemMouseUp Fn="onMouseUp" />
</Listeners>
</ext:ColumnSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnFirstOk" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnFirstOk" Color="#319915" TextAnchor="Middle" />
</ext:LineSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnFirstKo" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnFirstKo" Color="#CC1700" TextAnchor="Middle" />
</ext:LineSeries>
<ext:LineSeries Highlight="true" Axis="Right" Smooth="3" XField="period" YField="pnTotalPass" >
<MarkerConfig Type="Circle" Size="4" Radius="4" StrokeWidth="0" />

<Label Contrast="false" Display="InsideEnd" Field="pnTotalPass" Color="#C97C00" TextAnchor="Middle" />
</ext:LineSeries>
</Series>
</ext:Chart>
</Items>
</ext:Panel>
</Items>
</ext:FormPanel>
<ext:Panel runat="server" ID="panelContentLevels" Border="false" Hidden="true" Height="250">
</ext:Panel>
</Items>
</ext:FormPanel>
</form>
</Body>
</Html>


The page built with two charts, into the first as you can see into the page is enabled the click on the columns. if you click one column I want to show the second chart built from codebehind into the DirectMethod "OnItemMouseUp" but I don't see the columns for the last chart,

2. instead after click on the column of the first chart, I see this
4931


3. I run the page with last version of firefox

I hope clear now. Thanks

geoffrey.mcgill
Oct 16, 2012, 4:14 PM
Your listDefectivenessItems List is creating new object with String values, and they should be numbers. If you remove all the quotes, your sample renders correctly.

Examples


public List<object> CreateItems() { List<object> listDefectivenessItems = new List<object> ();

listDefectivenessItems.Add(new object[]{50.6,25,24,"partnumber1"});
listDefectivenessItems.Add(new object[]{40.6,20,24,"partnumber2"});
listDefectivenessItems.Add(new object[]{55.3,26,22,"partnumber3"});
listDefectivenessItems.Add(new object[]{22.6,12,28,"partnumber4"});
listDefectivenessItems.Add(new object[]{32,1,18,56,"partnumber5"});
listDefectivenessItems.Add(new object[]{12.0,10,34,"partnumber6"});
return listDefectivenessItems;
}

geoffrey.mcgill
Oct 16, 2012, 4:17 PM
As well, with future samples posted to the forums, please simplify as much as possible. Remove all code that is not directly related to the problem.

Here's a simplified version of your sample above.

Example


<%@ Page Language="C#" %>
<script runat="server">
public void Page_Load()
{
if (!X.IsAjaxRequest)
{
var store = this.Chart1.GetStore();

store.DataSource = new object[] {
new object[] { 95.97, "Period 1" },
new object[] { 96.68, "Period 2" }
};

store.DataBind();
}
}

[DirectMethod]
public void Chart1_Click()
{
Chart chart = new Chart
{
ID = "Chart2",
Height = 250,
Width = 500,
Axes = {
new NumericAxis
{
Fields = new string[] { "defectiveness" }
},
new CategoryAxis
{
Position = Position.Bottom,
Fields = new string[] { "partNumber" }
}
},
Series = {
new ColumnSeries
{
Axis = Position.Left,
XField = new string[] { "partNumber" },
YField = new string[] { "defectiveness" }
}
},
Store = {
new Store
{
ID = "strChartLevels",
Reader = {
new ArrayReader()
},
Model = {
new Model{
Fields = {
new ModelField("defectiveness"),
new ModelField("partNumber")
}
}
}
}
}
};


var store = chart.GetStore();

store.DataSource = new object[] {
new object[] { 50.6, "Part 1" },
new object[] { 40.6, "Part 2" }
};

store.DataBind();


this.Container1.Show();
chart.AddTo(this.Container1);
}
</script>
<html>
<head>
<title>Ext.NET Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />


<ext:Chart ID="Chart1" runat="server" Height="250" Width="500">
<Store>
<ext:Store runat="server" >
<Reader>
<ext:ArrayReader />
</Reader>
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="YieldValue"/>
<ext:ModelField Name="Period"/>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Axes>
<ext:CategoryAxis Position="Bottom" Fields="Period" />
<ext:NumericAxis Position="Left" Fields="YieldValue" />
</Axes>
<Series>
<ext:ColumnSeries XField="Period" YField="YieldValue">
<Listeners>
<ItemClick Handler="App.direct.Chart1_Click();" />
</Listeners>
</ext:ColumnSeries>
</Series>
</ext:Chart>

<ext:Container ID="Container1" runat="server" Hidden="true" />
</form>
</body>
</html>

tactime10
Oct 17, 2012, 10:45 AM
ok,

excuse me if the example code is too complex. However now it work.

thanks