i have a composite chart. i have enabled cross hair. the problem i face is the cross hair does not goes when i move my mouse out of chart area.
Following is my code:
protected void Page_Load(object sender, EventArgs e) { ultraChart.ChartType = ChartType.Composite; ultraChart.EnableCrossHair = true; ChartArea myChartArea = new ChartArea(); ultraChart.CompositeChart.ChartAreas.Add(myChartArea); AxisItem axisX = new AxisItem(); axisX.OrientationType = AxisNumber.X_Axis; axisX.DataType = AxisDataType.String; axisX.SetLabelAxisType = SetLabelAxisType.GroupBySeries; axisX.Labels.ItemFormatString = "<ITEM_LABEL>"; axisX.Labels.Orientation = TextOrientation.VerticalLeftFacing; AxisItem axisY = new AxisItem(); axisY.OrientationType = AxisNumber.Y_Axis; axisY.DataType = AxisDataType.Numeric; axisY.Labels.ItemFormatString = "<DATA_VALUE:0.#>"; myChartArea.Axes.Add(axisX); myChartArea.Axes.Add(axisY); NumericSeries seriesA = GetNumericSeriesBound(); NumericSeries seriesB = GetNumericSeriesUnBound(); ultraChart.CompositeChart.Series.Add(seriesA); ultraChart.CompositeChart.Series.Add(seriesB); ChartLayerAppearance myColumnLayer = new ChartLayerAppearance(); myColumnLayer.ChartType = ChartType.ColumnChart; myColumnLayer.ChartArea = myChartArea; myColumnLayer.AxisX = axisX; myColumnLayer.AxisY = axisY; myColumnLayer.Series.Add(seriesA); myColumnLayer.Series.Add(seriesB); ultraChart.CompositeChart.ChartLayers.Add(myColumnLayer); CompositeLegend myLegend = new CompositeLegend(); myLegend.ChartLayers.Add(myColumnLayer); myLegend.Bounds = new Rectangle(0, 75, 20, 25); myLegend.BoundsMeasureType = MeasureType.Percentage; myLegend.PE.ElementType = PaintElementType.Gradient; myLegend.PE.FillGradientStyle = GradientStyle.ForwardDiagonal; myLegend.PE.Fill = Color.CornflowerBlue; myLegend.PE.FillStopColor = Color.Transparent; myLegend.Border.CornerRadius = 10; myLegend.Border.Thickness = 0; ultraChart.CompositeChart.Legends.Add(myLegend); } private static DataTable GetData() { DataTable table = new DataTable(); table.Columns.Add("Label Column", typeof(string)); table.Columns.Add("Value Column", typeof(double)); table.Columns.Add("Another Value Column", typeof(double)); table.Rows.Add(new object[] { "Point A", 1.0, 3.0 }); table.Rows.Add(new object[] { "Point B", 2.0, 2.0 }); table.Rows.Add(new object[] { "Point C", 3.0, 1.0 }); table.Rows.Add(new object[] { "Point D", 4.0, 2.0 }); table.Rows.Add(new object[] { "Point E", 5.0, 3.0 }); return table; } private static NumericSeries GetNumericSeriesBound() { NumericSeries series = new NumericSeries(); series.Label = "Series A"; // this code populates the series from an external data source DataTable table = GetData(); series.Data.DataSource = table; series.Data.LabelColumn = "Label Column"; series.Data.ValueColumn = "Value Column"; return series; } private static NumericSeries GetNumericSeriesUnBound() { NumericSeries series = new NumericSeries(); series.Label = "Series B"; // this code populates the series using unbound data series.Points.Add(new NumericDataPoint(5.0, "Point A", false)); series.Points.Add(new NumericDataPoint(4.0, "Point B", false)); series.Points.Add(new NumericDataPoint(3.0, "Point C", false)); series.Points.Add(new NumericDataPoint(2.0, "Point D", false)); series.Points.Add(new NumericDataPoint(1.0, "Point E", false)); return series; }
Hi utkarsh_bandekar,
Thank you for posting in the community.
In order to ensure that the crosshair is hidden when you mouse out of you composite chart, I suggest that you handle the onload event of the body of your page. Here is a sample implementation for such a scenario:
Please let me know if this helps.
Thanks Petar Ivanov,
Your solution works fine for me.
I want to implement another feature:
i want to implement crosshair in my composite webchart. if i enable normal cross hair, both the cross hair moves along with mouse.i want the horizontal line to move with data point and vertical line to move with mouse. Following is the the example. open the following link and go to chart tab
http://www.six-swiss-exchange.com/indices/security_info_de.html?id=CH0009980894CHF9
I want the crosshair to function as it is working in the above example.
Any help will be thoroughly appreciated.