Hi,
I've got to produce a chart that shows how many contacts have been added or deleted from the database over a six month period.
I was hoping to show a chart with an Y axis going from a negative number to a positive number with the X axis running from the 0 value on the Y axis. The Y axis would be the number of contacts and the X axis would be dates.
The positive would show the contacts added and the negative the contacts deleted.
I thought I need to add a Series for the Added and a Series for the Deleted.
Here's a mock up
I've been trying to get this to work all afternoon using various examples but I'm failing miserably.
I initially tried binding the series to a List(Of ) but that failed so I converted it to a table. It seems to see the data to set some labels but doesn't show anything in the graph.
I've no idea what to try next so any help pointing me in the right direction would be greatly appreciated
Here's my code for setting up the axis, data and chart. All it's trying to do at the moment is display the Added contacts.
Private Sub SetupContactsVEventschart() Dim posContacts As New List(Of ContactVEventsContactChartData) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 2, .ActivityDate = Date.Parse("20 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 0, .ActivityDate = Date.Parse("21 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 3, .ActivityDate = Date.Parse("22 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 5, .ActivityDate = Date.Parse("24 Jul 2014")}) ContactsVEventsUltraChart.ChartType = ChartType.Composite Dim area As New ChartArea ContactsVEventsUltraChart.CompositeChart.ChartAreas.Add(area) Dim axisX As New AxisItem() axisX.OrientationType = AxisNumber.X_Axis axisX.DataType = AxisDataType.Time 'axisX.SetLabelAxisType = SetLabelAxisType.DateData axisX.Labels.ItemFormatString = "" axisX.Labels.Orientation = TextOrientation.VerticalLeftFacing axisX.TimeAxisStyle.TimeAxisStyle = RulerGenre.Discrete Dim axisY As New AxisItem() axisY.OrientationType = AxisNumber.Y_Axis axisY.DataType = AxisDataType.Numeric axisY.Labels.ItemFormatString = "" axisY.RangeType = AxisRangeType.Custom axisY.RangeMin = -50 axisY.RangeMax = 50 area.Axes.Add(axisX) area.Axes.Add(axisY) Dim table As DataTable = GetContactData(posContacts) Dim series1 As New NumericTimeSeries() series1.Label = "Added" series1.Data.DataSource = table series1.Data.TimeValueColumn = "ActivityDate" series1.Data.ValueColumn = "Count" Me.ContactsVEventsUltraChart.CompositeChart.Series.Add(series1) Dim myColumnLayer As New ChartLayerAppearance() myColumnLayer.ChartType = ChartType.ColumnChart myColumnLayer.ChartArea = area myColumnLayer.AxisX = axisX myColumnLayer.AxisY = axisY myColumnLayer.Series.Add(series1) Me.ContactsVEventsUltraChart.CompositeChart.ChartLayers.Add(myColumnLayer) End Sub Private Shared Function GetContactData(ByVal items As List(Of ContactVEventsContactChartData)) As DataTable Dim table As New DataTable() table.Columns.Add("Label", GetType(String)) table.Columns.Add("Count", GetType(Integer)) table.Columns.Add("ActivityDate", GetType(DateTime)) For Each i In items table.Rows.Add(New Object() {i.Label, i.Count, i.ActivityDate}) Next Return table End Function
Private Sub SetupContactsVEventschart()
Dim posContacts As New List(Of ContactVEventsContactChartData) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 2, .ActivityDate = Date.Parse("20 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 0, .ActivityDate = Date.Parse("21 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 3, .ActivityDate = Date.Parse("22 Jul 2014")}) posContacts.Add(New ContactVEventsContactChartData With {.Label = "Added", .Count = 5, .ActivityDate = Date.Parse("24 Jul 2014")})
ContactsVEventsUltraChart.ChartType = ChartType.Composite
Dim area As New ChartArea ContactsVEventsUltraChart.CompositeChart.ChartAreas.Add(area)
Dim axisX As New AxisItem() axisX.OrientationType = AxisNumber.X_Axis axisX.DataType = AxisDataType.Time 'axisX.SetLabelAxisType = SetLabelAxisType.DateData axisX.Labels.ItemFormatString = "" axisX.Labels.Orientation = TextOrientation.VerticalLeftFacing axisX.TimeAxisStyle.TimeAxisStyle = RulerGenre.Discrete
Dim axisY As New AxisItem() axisY.OrientationType = AxisNumber.Y_Axis axisY.DataType = AxisDataType.Numeric axisY.Labels.ItemFormatString = "" axisY.RangeType = AxisRangeType.Custom axisY.RangeMin = -50 axisY.RangeMax = 50
area.Axes.Add(axisX) area.Axes.Add(axisY)
Dim table As DataTable = GetContactData(posContacts)
Dim series1 As New NumericTimeSeries() series1.Label = "Added" series1.Data.DataSource = table series1.Data.TimeValueColumn = "ActivityDate" series1.Data.ValueColumn = "Count"
Me.ContactsVEventsUltraChart.CompositeChart.Series.Add(series1)
Dim myColumnLayer As New ChartLayerAppearance() myColumnLayer.ChartType = ChartType.ColumnChart myColumnLayer.ChartArea = area myColumnLayer.AxisX = axisX myColumnLayer.AxisY = axisY myColumnLayer.Series.Add(series1) Me.ContactsVEventsUltraChart.CompositeChart.ChartLayers.Add(myColumnLayer)
End Sub
Private Shared Function GetContactData(ByVal items As List(Of ContactVEventsContactChartData)) As DataTable Dim table As New DataTable() table.Columns.Add("Label", GetType(String)) table.Columns.Add("Count", GetType(Integer)) table.Columns.Add("ActivityDate", GetType(DateTime)) For Each i In items table.Rows.Add(New Object() {i.Label, i.Count, i.ActivityDate}) Next Return table End Function
Kind regards,
Nathan
Hello Nathan,
Thank you for contacting Infragistics.
You really don't need a composite chart for this. The composite chart is meant to be used when you need to combine two or more different kinds of charts.
In fact, if you're using Infragistics for Windows Forms 2014 Volume 2, I'd recommend using our new UltraDataChart instead of the UltraWinChart.
Please let me know if I may be of further assistance.
Hi Dave,
I'll give that a go.
If I need to plot events on the chart, such as a mail shot occurred on a particular date, so the chart could show contact activity in relation to that event, I'd have to use a composite chart then? Should I still use the UltraDataChart to achieve that too?
To be honest I'm not sure the best way to show the events as they're just a point in time. They have a value for the X axis but nothing for the Y (although that could be manually added to be displayed on the graph).
After a couple of discussions we thought the following mock up might be one way. I've added the event as a vertical line dissecting the X axis so you can see the contact activity on either site of it.
Hi Nathan,
I am currently working with our UltraDataChart to build you a sample that presents the data as you have shown in the above image. I'm conferring with the team on the best way to draw the vertical lines. I will update you again when I complete the sample. I expect to finish it on Monday. If I am unable to complete it by Wednesday, I will update you on my progress.
Please let me know if there is anything else that you need while I work to build this sample.
Hi Mike,
How are you getting on?
I'm very close. I have a DataChart sample that I think you'll like. I am cleaning up the sample to make it easier to read and integrate into a full-scale project. When I have finished doing that, I'll upload it here.
Thank you very much for your patience while I have been researching.
Thanks Mike, that's excellent news. I'm really excited to see the result of all your hard work.
Many thanks that works a treat. I've managed to adapt it to run on actual dates and it's looking good. Thank you very much.
I do have other questions but I'll post them separately because they maybe relevant to others.
I have included the correct attachment with this post. Sorry about that!
I removed the previous attachment as it was not relevant to the issue.
Is this the right attachment? When I run it, it just gives me a black form, then looking at the code it's related to Energy Production and I couldn't see the DataChartLine class.
I have completed the sample. I built a DataChartLine class that you can use to easily add custom lines to the chart. The details of how the line is drawn and updated are abstracted. The user of the class needs only to specify a target point along the x-axis, as well as a label and a color. The line positions itself correctly when zooming, and also offsets if a clustered series (such as ColumnSeries) is added to the chart.
Please review the sample and let me know whether it fits your requirement.
EDIT: I have removed the attachment as it was the wrong sample. Please find the correct sample below.