[WPSL] [XAML]如何在Windows Phone 8中创建柱形图 [英] [WPSL][XAML]How to create column charts in windows phone 8

问题描述

我正在开发windows phone 8 app。我需要在列图中显示一些分析值。我试图使用谷歌图表，但它不支持Windows Phone应用程序。所以我安装了"amcharts"。库来创建图表。但是，
我成功创建了图表。但是所有列都显示相同的颜色，我需要区分不同颜色的每一列。它还显示图表右侧的y轴值，如何将其移动到左侧。我刚刚在下面加了我的
代码。如果有任何解决方案请帮忙。谢谢。

XAML代码：

< ScrollViewer VerticalScrollBarVisibility =" Auto" Horizo​​ntalScrollBarVisibility = QUOT;自动"余量= QUOT; 0,208,0,0"> 
 
 
< amCharts：SerialChart x：Name =" BarChart" 
高度="400" 
 Width =" 800" 
 CategoryValueMemberPath =" Category" 
 AxisForeground ="白色" 
 PlotAreaBackground =" Black" > 
 
 
 
< amCharts：SerialChart.Graphs> 
 
 
< amCharts：ColumnGraph Title =" Title 1" ValueMemberPath = QUOT;值"刷= QUOT;橙红色" ColumnWidthAllocation = QUOT; 0.4" > 
 
< / amCharts：ColumnGraph> 
< / amCharts：SerialChart.Graphs> 
< / amCharts：SerialChart> 
< / ScrollViewer> 

c＃：

 ObservableCollection< BarData> BarDataCollection = new ObservableCollection< BarData>（）
 {
 new BarData {Category =" Facebook"，Value = 80}，
 new BarData {Category =" Twitter"，Value = 50 }，
新BarData {Category =" SNG"，Value = 60}，
 new BarData {Category =" Email Camp"，Value = 10}，
 new BarData {Category = "SMS Camp"，值= 40}，
新BarData {Category =" Voice Camp"，Value = 40}，
 
}; 
 BarChart.DataSource = BarDataCollection; 

---

Nikitha

解决方案

你好Nikitha K，

欢迎来到开发通用Windows应用论坛！ 

请阅读粘贴帖子，尤其是  发布指南：主题行标签 &absp; 已知
问题适用于Windows 10 SDK和工具   

根据您的描述，我知道您要使用不同的颜色并更改柱形图的y轴位置，目前为止据我所知，我们只能设置一次柱形图的刷子属性，所以在我看来你需要为它创建一个自定义的
样式。根据您的要求，我建议您使用饼图，您只需修改您的xaml代码如下，此外，我们还可以更改饼图的画笔属性以将您喜欢的颜色分配给每个字段$ b饼图中的$ b：

< ScrollViewer VerticalScrollBarVisibility =" Auto" Horizo​​ntalScrollBarVisibility = QUOT;自动"余量= QUOT; 0,208,0,0"> 
< amCharts：PieChart Name =" BarChart" 
 TitleMemberPath =" Category" 
 ValueMemberPath =" Value" /> 
< / ScrollViewer> 

然后结果：


$

最好的问候，

Amy Peng

Hi, I'm developing windows phone 8 app. I need to display some analytics values in column graph. I tried to use the google charts but its not supporting in windows phone app. So I installed the "amcharts" library to create the charts. However, I created the chart successfully. But all the columns showing the same color, I need to differentiate the every columns with different colors. Also its showing the y-axis value in right side of the chart, how can I move this to left side. I just included my code below.Please help if there any solution. Thanks.

XAML code:

 <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Margin="0,208,0,0">

              
                <amCharts:SerialChart x:Name="BarChart" 
     Height="400" 
     Width="800" 
     CategoryValueMemberPath="Category" 
     AxisForeground="White" 
     PlotAreaBackground="Black"   >
                
                
                
                <amCharts:SerialChart.Graphs>


                        <amCharts:ColumnGraph  Title="Title 1" ValueMemberPath="Value"  Brush="OrangeRed" ColumnWidthAllocation="0.4" >
                            
                        </amCharts:ColumnGraph>
                </amCharts:SerialChart.Graphs>
            </amCharts:SerialChart>
            </ScrollViewer>

c#:

 ObservableCollection<BarData> BarDataCollection = new ObservableCollection<BarData>()
            {
                new BarData { Category = "Facebook", Value = 80},
                new BarData { Category = "Twitter", Value = 50  },
                new BarData { Category = "SNG", Value = 60 },
                new BarData { Category = "Email Camp", Value = 10 },
                new BarData { Category = "SMS Camp", Value = 40 }, 
                new BarData { Category = "Voice Camp", Value = 40 } ,
               
            };
            BarChart.DataSource = BarDataCollection;

---

Nikitha

解决方案

Hi Nikitha K,

Welcome to the Developing Universal Windows apps forum! 
Please read the sticky posts, especially the Guide to posting: subject line tags and Known Issues for Windows 10 SDK and Tools  
Based on your description, I know that you want to use different colors and change the position of y-axis for the Column Chart, as far as I known we can only set the Brush property of the Column Chart for once, so in my mind you will need to create a custom style for it. For your requirement, I will recommend you use the Pie Chart, you just need to modify your xaml code as following, besides, we can also change the Brushes property of the Pie Chart to assign your favourite colors to every field in the Pie Chart:

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Margin="0,208,0,0">
   <amCharts:PieChart Name="BarChart"
        TitleMemberPath="Category"
        ValueMemberPath="Value"/>
</ScrollViewer>

Then result:

Best Regards,
Amy Peng

这篇关于[WPSL] [XAML]如何在Windows Phone 8中创建柱形图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！