I am able to drag a legend within a XamDataChart. The problem is on subsequent drags the ghost image of the legend gets further away from the cursor. The cursor is in the right spot but the opaque legend is not after the first drag. How do you position the ghost image?
<Grid x:Name="LineGrid" Background="White"> <ig:XamDataChart x:Name="LineChart" DefaultInteraction="DragZoom" HorizontalZoomable="True" HorizontalZoombarVisibility="Visible" VerticalZoomable="True" VerticalZoombarVisibility="Visible" Legend="{Binding ElementName=LineLegend}" PropertyChanged="OnPropertyChanged"> <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="True" DropChannels="ChannelLegend"/> </ig:DragDropManager.DropTarget> </ig:XamDataChart > <ig:Legend x:Name="LineLegend" Content="Legend" HorizontalAlignment="Left" Margin="10,10,0,0" PreviewMouseDown="legend_MouseLeftButtonDown"> <ig:DragDropManager.DragSource> <ig:DragSource IsDraggable="True" DragChannels="ChannelLegend" Drop="DragSource_Drop"> <ig:DragSource.MoveCursorTemplate> <DataTemplate> <Ellipse Fill="Green" Width="50" Height="50" /> </DataTemplate> </ig:DragSource.MoveCursorTemplate> </ig:DragSource> </ig:DragDropManager.DragSource> </ig:Legend> </Grid>
Hello Jason,
I have been investigating into this issue that you are reporting, but at the moment, I can't seem to reproduce this behavior that you are seeing. The behavior I am currently seeing is that the Legend of the XamDataChart is dragged, and the "ghost" image of the Legend appears relative to the mouse click and drag that started the dragging operation.
I have attached the sample project I used to test this. Please test this project on your PC; whether or not it works correctly may help indicate the nature of this problem.
If the project does not work correctly, this indicates either a problem possibly specific to your environment, or a difference in the DLL versions we are using. My test was performed using version 16.1.20161.2056 in Infragistics for WPF 2016 Volume 1.
If the project does show the product feature working correctly, this indicates a possible problem in the code of your application. It will help if you can provide a small, isolated sample application that demonstrates the behavior you are seeing.
Or, if this sample project is not an accurate demonstration of what you're trying to do, please feel free to modify it and send it back, or send a small sample project of your own if you have one.
Please let me know if you have any other questions or concerns on this matter.
Sincerely,AndrewAssociate Developer
Thank for the response and example project, but in your example, you arent 'dropping' the legend (ie leaving it in place). It's on the second drag where I have the problem.
I think I may have reproduced this issue, but I am unsure if my way of dragging the Legend is matching yours. By any chance, are you applying a Margin to the Legend when you drag and drop it? I ask, at it appears that the margin applied to the Legend control is being respected when the drag starts, and this may be what is causing the Legend "image" to be lagging behind the actual drag point. If this is the way that you are repositioning your Legend, please let me know, and I will continue to look into a solution to this particular issue.
If it is not the way that you are repositioning your Legend, would it be possible for you to please shed some light on how you are doing so?
Yes I am setting the margin. If there is a better way to set the position then let me know. But setting the margin was the only way I could find to change the legend position
Legend targetLegend = new Legend(); targetLegend = legend; Point pos = e.GetPosition(LineGrid); targetLegend.Margin = new Thickness(pos.X - dragPosInLegend.X, pos.Y - dragPosInLegend.Y, 0, 0);
After investigating into this issue a bit further, I have found that this "jumping" behavior has already been logged in our internal tracking systems, and has been internally fixed. This was a regression issue that resulted from another bug fix in the DragDropManager, and was offsetting the cursor slightly.
I have created a private support case on your behalf so that you can track this issue and be notified when a fix becomes available for it. This support case has an ID of CAS-176806-X7F5T7, and you can access it at the following link after signing into your account: https://es.infragistics.com/my-account/support-activity. I will soon be updating this case with more information about this development issue, and how you can view its status.
Binding the height and width worked! Thanks Andrew.
I look forward to hearing what you find on the mouse offset.
I apologize, I wasn't aware that you were zooming, panning, or using any type of flyovers for the XamDataChart. The overlaid Canvas will not work for those, as it will steal the mouse events that the chart would normally catch.
If you are going to surround both the XamDataChart and the Legend with the same canvas, I would recommend binding the Height and Width of your XamDataChart to the ActualHeight and ActualWidth of the Canvas to get the chart to essentially "fill" the parent Canvas. You can use an ElementName binding for this, as the Canvas will not do this automatically. For example, to do this, the code would look like the following:
<ig:XamDataChart Height="{Binding ElementName=dragCanvas, Path=ActualHeight}" Width="{Binding ElementName=dragCanvas, Path=ActualWidth}"/>
This should allow the XamDataChart to size to the parent of the Canvas, while allowing mouse events on the chart.
Regarding the offset of the mouse when dragging, this appears to likely be the result of a misplacement of the "ghost" element when the drag starts, as the mouse ends up slightly to the top and left of the spot that was actually clicked, but I'm not entirely sure just yet and would like to investigate a little further. I hope to have more inforamtion regarding this issue soon.
Unfortunately the use of a Canvas has caused different issues. I can no longer scroll or zoom in on my graph. My flyovers also no longer work. In an attempt to resolve this issue I placed my XamDatachart within the canvas.
<Canvas x:Name="dragCanvas" Background="Transparent"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch" > <ig:DragDropManager.DropTarget> <ig:DropTarget IsDropTarget="True"/> </ig:DragDropManager.DropTarget> <ig:XamDataChart x:Name="LineChart" DefaultInteraction="DragZoom" HorizontalZoomable="True" HorizontalZoombarVisibility="Visible" VerticalZoomable="True" VerticalZoombarVisibility="Visible" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Legend="{Binding ElementName=LineLegend}" PropertyChanged="LineGridChange" Loaded="LineGrid_Loaded"> </ig:XamDataChart > <ig:Legend x:Name="LineLegend" Content="Legend" HorizontalAlignment="Left" Margin="10,10,0,0" PreviewMouseDown="legend_MouseLeftButtonDown"> <ig:DragDropManager.DragSource> <ig:DragSource IsDraggable="True" Drop="DragSource_Drop"> </ig:DragSource> </ig:DragDropManager.DragSource> </ig:Legend> </Canvas>
This fixed the above problems but then my graph becomes too small and doesn't fill the entire window. I tried 'stretching' the vert and horz alignment for both the canvas and the XamDataChart (see above) but this has no effect. So how do I get my XamDataChart a)to receive mouse actions or b)resize to the full size of the parent?
Excellent. That resolves the issue. Thank you Andrew.
On a minor side note, why does the legend 'jump' as soon as I start dragging? After removing the MoveCursorTemplate code, if I put the mouse on the 'L' of "Legend" and then start dragging the legend ghost image moves such that the cursor is no longer below the 'L'. Note: I am only talking about dragging the legend, I understand the dropping the legend and it's location requires separate code.