Hi,
I am using the XamDataChart with a BubbleSeries to create a BubbleChart. The RadiusMemberPath is bound to a property which can offer quite different values. What this means is that my BubbleChart quite correctly displays large bubbles that often overlaps with smaller bubbles. My problem here is that the XamDataChart does not ensure that the smaller Bubbles have a Z-Index that will force them to be painted over the top of the larger bubble. The result of this problem is that I often see the smaller bubbles hidden behind the larger ones, so I have no idea of the position of the smaller bubbles.
I have seen some Z-Index forum posts on this issue, but these problems are often related to the ordering of the multiple series. In my case, I have only one series, and it is the markers on the same series that are overlapping.
Please note that I can apply a colour with an alternative alpha value to provide a degree of opacity - which does work to some extent. But my CircleMarkerTemplate provides a tool-tip, which does not work with a small bubble hidden by a larger one. So the Z-Index still needs correcting to truly fix this issue.
Are there any XamaDataChart options available to me to fix this issue?
Thanks,
Russell
Hi Russell,
This issue has to do with the order in which the bubbles are rendered. In the case of the xamDataChart, the chart iterates over your data source items and renders a bubble for each one regardless of size. This means if you have a smaller radius item at index 0 in the data source and then a much larger radius item at index 1, the larger item will be rendered after the smaller item which may result in overlapping the smaller item. To resolve this you will need to sort your datasource by the radius value so that larger radii are first in the collection and the smaller radii are at the bottom so they are rendered last.
Let me know if you have any questions on this.
Let me know if you have any further questions on this matter.
Any sorting or Canvas.SetZIndex function calls will only affect the bubble series in its current canvas. Using either of these methods will not solve the issue completely across multiple series. Since they all have their own canvas setting their Z-order will not work with relation to other bubble series in the chart. The only way to currently do this would be to split your data across the number of bubble series that you have where the larger radius items are in the first series and the smaller ones are in the last series. For example, if you had 3 bubble series and your radius value ranges from 10 - 100, your data might be split like so:
Bubble Series 1: 100 - 70 Bubble Series 2: 69 - 30 Bubble Series 3: 29 - 10
In addition to this, the items in each single series would need to be sorted largest to smallest so each item is rendered correctly. You can then use a marker template to handle coloring the bubbles based on where the data came from so you can give the appearance that each color group are their own series.
Hi Rob,
Thanks for the response.
Unfortunately, this does not help me if I have multiple BubbleSeries on a single chart (I didn't mention before that I have three BubbleSeries). I can only sort the itemSource for each individual BubbleSeries, but this will not correct the ordering for all bubbles in the DataChart.
Any ideas?
R