StackingBarSeries Dash Line

[Javier]

Hi,

Is it posible to set dash line style to StackingBarSeries?

Thank you.

[Parthiban Sundaram]

Hi Javier,

Thanks for using Syncfusion products.

Could you please let us know whether you want to apply the dashes to the border of the rectangle of whole rectangle in stacked bar series? This will help us to assist you further on this.

Regards,
Parthiban S

[Javier]

Hi,

I´m trying to build something like the image attached.

Thanks.

Attachment: example_a6c1145b.rar

[Parthiban Sundaram]

Hi Javier, 

 

Thanks for using Syncfusion products.  

 

We don’t have direct support for dashes in StackedBarSeries. So, we have achieved in the workaround sample by extending StackedBarSeries and overriding the GetPaint method in Android and overriding the DrawSegment method in iOS. Please refer the BarSeriesExt.cs and BarSegmentExt.cs files in both Android and iOS projects for more details.  

 

Please download the customized sample from below location.  

 

Sample: http://www.syncfusion.com/downloads/support/forum/132777/ze/ChartSample288563654  

 

Note: We have exposed the StrokeDashArray property in the StackBarSeriesExt. Please refer the following code snippet to enable the dashes line for StackedBarSeries. 

 

Code Snippet: 

 

 

series2.StrokeDashArray = new float[] { 10, 20 }; 

 

Please let us know, if you need further assistance on this.  

 

Regards, 

Parthiban S 

[Javier]

Hi,

First of all thank you for the assistance. I have tested you example on real device (LG) and the result is an empty screen. As well, I have integrated your renderers in my project and the bar is exactly the same as before applying the renderer.

ChartExt chart = new ChartExt();

NumericalAxis xAxis = new NumericalAxis();

NumericalAxis yAxis = new NumericalAxis();

chart.PrimaryAxis = xAxis;

chart.SecondaryAxis = yAxis;

StackingBarSeries serie1 = new StackingBarSeries();

StackingBarExt serie2 = new StackingBarExt();

serie2.StrokeDashArray = new float[] { 10, 20 };

serie1.SetBinding(ColumnSeries.ItemsSourceProperty, "mycollect1");

serie2.SetBinding(ColumnSeries.ItemsSourceProperty, "mycollect2");

chart.Series.Add(serie1);

chart.Series.Add(serie2);

Thanks

[Parthiban Sundaram]

Hi Javier,

Sorry for the inconvenience caused.

As we have analyzed in the previous attached sample, the reported issue was occurred due to mismatching the Xamarin.Forms version between PCL and Android projects. Please download the modified the sample from the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/132777/ze/StackedBarSeries-597645159
 
Please let us know, if you need further assistance on this.

Regards,
Parthiban S

[Javier]

Hello,

Your renderer is working both in Android and iOS. But I have noticed these issues:

     - Android: bars are separated by a small space

     -iOS: the dashed line is thicker than Android one, and it is always set to red color

Screens captures attached.

Thanks!

Attachment: sample_a3407018.rar

[Parthiban Sundaram]

Hi Javier,

Thanks for the update.

We have modified the sample based on your reported issue. Please download the sample from following location.

Sample: http://www.syncfusion.com/downloads/support/forum/132777/ze/StackedBarSample1338563046  

Please let us know, if you need further assistance on this.

Regards,
Parthiban S

[Javier]

Hi,

Just 2 things:

Android: with tooltip enabled, when I click on bar, the label appears on the bottom of the chart. You can see it on file attached.

iOS: the line is still too thick. You can see it on file attached. Is it posible to set the thick on the renderer with a number?

Thanks again!

Attachment: images_72c87b4b.rar

[Parthiban Sundaram]

Hi Jaiver,

Thanks for the update.

Regarding query 1:

We have created an incident under your Direct Trac account. So, we request to follow the incident for further details.

Our Direct Trac support system can be accessed from the following link:

https://www.syncfusion.com/account/login?ReturnUrl=%2fsupport%2fdirecttrac%2fincidents  

Regarding query 2:

You achieve this requirement with help of Device.OnPlatform method. Please refer the following snippet for more details.

Code Snippet:  

  

        <local:StackingBarExt.StrokeWidth> 

          <OnPlatform x:TypeArguments="x:Double" iOS ="1" Android ="2"/>  

       </local:StackingBarExt.StrokeWidth> 

 

 
Please download the sample from following location.

Sample: http://www.syncfusion.com/downloads/support/forum/132777/ze/StackedBarDashes-1690349280  

Please let us know, if you need further assistance on this.

Regards,  

Parthiban S 

[Javier]

Hi again,

Using the StackingBarExt, I have noticed that when I´m using tooltip its background color is always transparent. Is it possible to set it white?

var serie = new Controls.StackingBarExt();

serie.EnableTooltip = true;

serie.TooltipTemplate = new DataTemplate(() =>

{

var label = new Label()

{

FontSize = smallSize

};

label.SetBinding(Label.TextProperty, ".", BindingMode.Default, tooltipConvert);

return label;

});

Thank you.

[Divya Venkatesan]

Hi Javier, 

 

You can set the background color for tooltip with ChartTooltipBehavior.BackgroundColor property. Please refer the below code snippet. 

 

ChartTooltipBehavior tooltip = new ChartTooltipBehavior(); 

tooltip.BackgroundColor = Color.White; 

chart.ChartBehaviors.Add(tooltip); 

 

 

Please let us know, if you need any further assistance on this. 

  

Regards, 

Divya Venkatesan 

[Javier]

Great!

Thank you.

[Divya Venkatesan]

Hi Javier,

Thanks for the update. We are glad to know that the given solution works. Please let us know if you need any further assistance.

Regards,
Divya Venkatesan