This is a migrated thread and some comments may be shown as answers.

Custom colors in Doughnut Chart

3 Answers 173 Views
Chart
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Aditya
Top achievements
Rank 1
Aditya asked on 24 Mar 2017, 04:17 AM
Hi, I am working on a UWP app. I want to provide custom colors for the segments of the doughnut chart. How can I do this? I have 3 regions, I need one red other yellow, other green. Can you please help?

3 Answers, 1 is accepted

Sort by
0
Lance | Manager Technical Support
Telerik team
answered on 24 Mar 2017, 03:45 PM
Hi Aditya,

You can find a tutorial on how to create a custom palette here.

Regards,
Lance | Tech Support Engineer, Sr.
Telerik by Progress
Leverage your XAML skill to create beautiful Windows 10 apps for phone, tablet and desktop. Try UI for Universal Windows Platform today!
0
Aditya
Top achievements
Rank 1
answered on 27 Mar 2017, 07:54 AM
Hi thanks for the help. Last question, is there a way to provide a custom palette via DataBinding? For eg: I can bind the chart into a DataTemplate and in the data source for the DataTemplate, I can have a SolidColorBrush property or an observableCollection of SolidColorBrush and I can bind the palette to my Collection in the model for it to dynamically set colors based on the data provided to it. Is there a way to achieve this? I tried FillEntries but it doesn't take List/ObservableCollection as an Input. Can you please help? 
Below is my code:
<HummingBirdCharts:RadPieChart x:Name="ChartData" Grid.Row="1" Foreground="Black"  PaletteName="None"  Visibility="{x:Bind IsProcessingData,Converter={StaticResource BoolToInverseVisibilityConverter},Mode=OneWay}">
                    <HummingBirdCharts:RadPieChart.Palette>
                        <HummingBirdCharts:ChartPalette FillEntries="{x:Bind ColorPalette,Mode=OneWay}"/>
                    </HummingBirdCharts:RadPieChart.Palette>
                    <HummingBirdCharts:DoughnutSeries ItemsSource="{x:Bind PlottingArea,Mode=OneWay}" RadiusFactor="0.8">
                        <HummingBirdCharts:DoughnutSeries.ValueBinding>
                            <HummingBirdCharts:PropertyNameDataPointBinding PropertyName="Value"/>
                        </HummingBirdCharts:DoughnutSeries.ValueBinding>
                        <HummingBirdCharts:DoughnutSeries.LegendTitleBinding >
                            <HummingBirdCharts:PropertyNameDataPointBinding PropertyName="Label"/>
                        </HummingBirdCharts:DoughnutSeries.LegendTitleBinding>
                    </HummingBirdCharts:DoughnutSeries>
                </HummingBirdCharts:RadPieChart>
0
Lance | Manager Technical Support
Telerik team
answered on 27 Mar 2017, 05:28 PM
Hello Aditya,

Take a look at the examples explained in this forum thread. You'll also find a demo application attached here as well.


I wanted to briefly discuss the status of your license. I see that you were using a trial version of commercial UI for UWP, however that has expired. For your convenience, I'll paste in the support policy below so you can be aware of the support policy concerning the community version on the components.

Getting Help

As a fully-open source project, UI for UWP is a primarily community-supported project, as such, you are encouraged to use forums like Stack Overflow to post questions, and the issues list of this repo to report bugs.

The UI for UWP team does not provide formal support, except to those customers who have purchased a commercial license for UI for UWP. Please do not create support requests for this project in the issues list for this repo, as these will be immediately closed. You'll be directed to post your question on a community forum.


Regards,
Lance | Tech Support Engineer, Sr.
Telerik by Progress
Leverage your XAML skill to create beautiful Windows 10 apps for phone, tablet and desktop. Try UI for Universal Windows Platform today!
Tags
Chart
Asked by
Aditya
Top achievements
Rank 1
Answers by
Lance | Manager Technical Support
Telerik team
Aditya
Top achievements
Rank 1
Share this question
or