Page 1 of 1
Adding image annotation
Posted: Wed Sep 23, 2020 7:14 am
by ilanro
Hi!
I'm testing the .NET sdk, and I need to be able to add small icons to my 2D chart. Is there a convenient way to add images as annotations or any other way so they would appear on the chart, and so I could control and modify their location in terms of data point units?
Thank you!
Re: Adding image annotation
Posted: Wed Sep 23, 2020 12:42 pm
by Arction_LasseP
Hello,
Either Annotations or SeriesEventMarkers can be used to achieve this, as both accept bitmaps as an fill option. The main difference is that SeriesEventMarkers are tied to a series, in other words you also need to have for example a PointLineSeries in the chart. Furthermore, Annotations are a bit more flexible.
Here are code examples of setting both Annotation and Marker to use bitmaps:
Code: Select all
AnnotationXY anno = new AnnotationXY(_chart.ViewXY, _chart.ViewXY.XAxes[0], _chart.ViewXY.YAxes[0]);
anno.Style = AnnotationStyle.Rectangle;
anno.Text = "";
// Allow only moving the annotation by mouse.
anno.TargetMoveByMouse = false;
anno.ResizeByMouse = false;
anno.RotateByMouse = false;
anno.AnchorAdjustByMouse = false;
anno.MoveByMouse = true;
// Set location in axis values and size in screen coordinates.
anno.LocationCoordinateSystem = CoordinateSystem.AxisValues;
anno.LocationAxisValues.SetValues(5, 5);
anno.SizeScreenCoords.SetValues(200, 200);
// Use bitmap as fill.
anno.Fill.Style = RectFillStyle.Bitmap;
anno.Fill.Bitmap.Layout = BitmapFillLayout.Stretch;
BitmapFrame frame = BitmapFrame.Create(new Uri(System.IO.Path.GetDirectoryName(System.Reflection.Assembly.GetEntryAssembly().Location) + "\\Resources\\image.png"));
anno.Fill.Bitmap.Image = frame;
_chart.ViewXY.Annotations.Add(anno);
SeriesEventMarker marker = new SeriesEventMarker(pointLineSeries);
marker.Label.Visible = false;
// Set marker position
marker.HorizontalPosition = SeriesEventMarkerHorizontalPosition.AtXValue;
marker.VerticalPosition = SeriesEventMarkerVerticalPosition.AtYValue;
marker.XValue = 6;
marker.YValue = 8;
// Using bitmap as fill (symbol).
marker.Symbol.Shape = SeriesMarkerPointShape.Bitmap;
marker.Symbol.UseImageSize = false; // Use custom size instead of image's original size
marker.Symbol.Width = 20;
marker.Symbol.Height = 20;
BitmapFrame frame2 = BitmapFrame.Create(new Uri(System.IO.Path.GetDirectoryName(System.Reflection.Assembly.GetEntryAssembly().Location) + "\\Resources\\image.png"));
marker.Symbol.BitmapImage = frame2;
pointLineSeries.SeriesEventMarkers.Add(marker);
You can change the position of the image any time in code via anno.LocationAxisValues.SetValues(x, y) for Annotations and marker.XValue or marker.YValue for Markers. Both can also be moved by mouse.
Hope this is helpful.
Best regards,
Lasse