Jan 18, 2016, 8:54 AM
Show Line chart when click button
I want to show chart when click button, no show in page_Load.
But when click button not show line chart.
p/s: i want to filter data before show line chart.
pls help me.
This is code
But when click button not show line chart.
p/s: i want to filter data before show line chart.
pls help me.
This is code
<ext:Panel
runat="server"
Width="1200"
Height="550"
Layout="FitLayout">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:ToolbarFill runat="server" />
<ext:Button ID="btn_ViewChart" runat="server" Text="View Report"></ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Items>
<ext:CartesianChart
ID="Chart1"
runat="server"
InsetPadding="40"
InnerPadding="0 40 0 40">
<Store>
<ext:Store runat="server">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="Month" />
<ext:ModelField Name="Data1" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Interactions>
<ext:PanZoomInteraction ZoomOnPanGesture="true" />
</Interactions>
<Items>
<ext:TextSprite
Text="Line Charts - Basic Line"
FontSize="22"
Width="100"
Height="30"
X="40"
Y="20" />
<ext:TextSprite
Text="Data: Browser Stats 2012"
FontSize="10"
X="12"
Y="480" />
<ext:TextSprite
Text="Source: http://www.w3schools.com/"
FontSize="10"
X="12"
Y="495" />
</Items>
<Axes>
<ext:NumericAxis
Position="Left"
Fields="Data1"
Grid="true"
Minimum="0"
Maximum="24">
<Renderer Handler="return layout.renderer(label) + '%';" />
</ext:NumericAxis>
<ext:CategoryAxis
Position="Bottom"
Fields="Month"
Grid="true">
<Label RotationDegrees="-45" />
</ext:CategoryAxis>
</Axes>
<Series>
<ext:LineSeries XField="Month" YField="Data1">
<StyleSpec>
<ext:Sprite LineWidth="4" />
</StyleSpec>
<HighlightConfig>
<ext:Sprite FillStyle="#000" Radius="5" LineWidth="2" StrokeStyle="#fff" />
</HighlightConfig>
<Marker>
<ext:Sprite Radius="4" />
</Marker>
<Label Field="Data1" Display="Over" />
<Tooltip TrackMouse="true" StyleSpec="background: #fff;" ShowDelay="0" DismissDelay="0" HideDelay="0">
<Renderer Handler="this.setHtml(storeItem.get('Month') + ': ' + storeItem.get('Data1') + '%');" />
</Tooltip>
</ext:LineSeries>
</Series>
</ext:CartesianChart>
</Items>
</ext:Panel>
this is code behind: Private Sub test_report()
Me.Chart1.GetStore().DataSource = New List(Of Object)() From { _
New With { _
Key .Month = "Jan", _
Key .Data1 = 20 _
}, _
New With { _
Key .Month = "Feb", _
Key .Data1 = 20 _
}, _
New With { _
Key .Month = "Mar", _
Key .Data1 = 19 _
}, _
New With { _
Key .Month = "Apr", _
Key .Data1 = 18 _
}, _
New With { _
Key .Month = "May", _
Key .Data1 = 18 _
}, _
New With { _
Key .Month = "Jun", _
Key .Data1 = 17 _
}, _
New With { _
Key .Month = "Jul", _
Key .Data1 = 16 _
}, _
New With { _
Key .Month = "Aug", _
Key .Data1 = 16 _
}, _
New With { _
Key .Month = "Sep", _
Key .Data1 = 16 _
}, _
New With { _
Key .Month = "Oct", _
Key .Data1 = 16 _
}, _
New With { _
Key .Month = "Nov", _
Key .Data1 = 15 _
}, _
New With { _
Key .Month = "Dec", _
Key .Data1 = 15 _
} _
}
End Sub
Protected Sub btn_ViewChart_DirectClick(sender As Object, e As Ext.Net.DirectEventArgs) Handles btn_ViewChart.DirectClick
test_report()
End Sub
Last edited by fabricio.murta; Jan 18, 2016 at 6:06 PM.