This is a migrated thread and some comments may be shown as answers.
RadCartesianChart background transparent - Axes issues.
2 Answers 19 Views
This is a migrated thread and some comments may be shown as answers.
Prasanth
Top achievements
Rank 1
Prasanth asked on 10 Aug 2018, 05:07 AM

See the attached screenshots of Android & iOS using RadCartesianChart. We tried to use Xamarin Forms to have common UI consistency between the platforms. 

Can someone please identify what's causing the issue?

1. Need to have transparent background to the RadCartesian Chart so that the background gradient (Gradience created in Frame) is visible.

2. X-Axis and Y-Axis are not plotted correctly which are plotted in Android.

3. Why the same code is working differently in Android & iOS. What else customizations has to be performed to achieve same and consistent look and feel.

We are in final stages of evaluating the chart controls using Xamarin forms and this PoC which we are evaluating would lead to continuing with Telerik. Please assist.

 <telerikChart:RadCartesianChart PaletteName="Light" SelectionPaletteName="LightSelected" BackgroundColor="Transparent" HeightRequest="350" x:Name="myChart">
                    <telerikChart:RadCartesianChart.ChartBehaviors>
                        <telerikChart:ChartSelectionBehavior DataPointSelectionMode="Single" SeriesSelectionMode="Single" />
                        <telerikChart:ChartPanAndZoomBehavior ZoomMode="Both" PanMode="Both"  HandleDoubleTap="True"  />
                        <telerikChart:ChartTooltipBehavior  TriggerMode="Tap"/>
                        <telerikChart:ChartTrackBallBehavior ShowIntersectionPoints="True" ShowTrackInfo="True" />
                    </telerikChart:RadCartesianChart.ChartBehaviors>
                    <telerikChart:RadCartesianChart.HorizontalAxis>
                        <telerikChart:DateTimeContinuousAxis GapLength="0.1" MajorStepUnit="Day" MajorStep="1"  LabelFitMode="Rotate" LabelFormat="dd MMM"  LineColor="#A9A9A9" MajorTickThickness="10" PlotMode="OnTicks" ShowLabels="True" MajorTickBackgroundColor="#A9A9A9" LabelTextColor="White"/>
                    </telerikChart:RadCartesianChart.HorizontalAxis>
                    <telerikChart:RadCartesianChart.VerticalAxis>
                        <telerikChart:NumericalAxis LineColor="#A9A9A9" MajorTickBackgroundColor="#A9A9A9" LabelTextColor="White"/>
                    </telerikChart:RadCartesianChart.VerticalAxis>
                    <telerikChart:RadCartesianChart.Grid>
                        <telerikChart:CartesianChartGrid MajorLinesVisibility="X" MajorLineColor="White" MajorLineThickness="10" />
                    </telerikChart:RadCartesianChart.Grid>
                    <telerikChart:RadCartesianChart.Series>
                        <telerikChart:LineSeries CategoryBinding="MeasureDate" ValueBinding="Value" ItemsSource="{Binding SeriesData}" CombineMode="None" Stroke="White" StrokeThickness="2">
                        </telerikChart:LineSeries>
                        <!--<telerikChart:SplineSeries CategoryBinding="Category" ValueBinding="Value" ItemsSource="{Binding SecondSeriesData}" CombineMode="Stack" />-->
                    </telerikChart:RadCartesianChart.Series>
                </telerikChart:RadCartesianChart>

2 Answers, 1 is accepted

Sort by
0
Prasanth
Top achievements
Rank 1
answered on 10 Aug 2018, 05:33 AM

It seems we've figured out the issue why the background is White and not getting transparent. It is MajorLineThickness=10 which is causing the problem. But it works nice in Android.

However, we don't see HandleDoubleTap="True" of ChartPanAndZoomBehavior is not working in iOS. Any help on this?

0
Didi
Telerik team
answered on 14 Aug 2018, 10:49 AM
Hi Prasanth,

I have tested the described scenario and I reproduced the issue on iOS. The ChartPanAndZoomBehavior.HandleDoubleTap property is not working properly on iOS when ChartTooltipBehavior.TriggerMode is set on Tap. I have logged this in our Feedback Portal and you could follow the item and track its progress on the provided link below:
https://feedback.telerik.com/Project/168/Feedback/Details/255300-chart-ios-chartpanandzoombehavior-handledoubletap-property-is-not-working-when. Please find your Telerik points updated for this report.

In order to resolve the issue with the ChartPanAndZoomBehavior.HandleDoubleTap property you could set the ChartTooltipBehavior.TriggerMode property on Hold, as follow:

<telerikChart:RadCartesianChart.ChartBehaviors>
            <telerikChart:ChartSelectionBehavior DataPointSelectionMode="Single" SeriesSelectionMode="Single"/>
            <telerikChart:ChartPanAndZoomBehavior ZoomMode="Both" PanMode="Both" HandleDoubleTap="True"/>
            <telerikChart:ChartTooltipBehavior TriggerMode="Hold"/>
            <telerikChart:ChartTrackBallBehavior ShowIntersectionPoints="True" ShowTrackInfo="True"/>
</telerikChart:RadCartesianChart.ChartBehaviors>

Let me know if the suggested workaround works in your case.

Regards,
Didi
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Chart
Asked by
Prasanth
Top achievements
Rank 1
Answers by
Prasanth
Top achievements
Rank 1
Didi
Telerik team
Share this question
or