{"id":953,"date":"2019-10-24T11:12:18","date_gmt":"2019-10-24T10:12:18","guid":{"rendered":"https:\/\/ibex.tech\/windows-iot\/?p=953"},"modified":"2019-10-24T11:12:18","modified_gmt":"2019-10-24T10:12:18","slug":"legends","status":"publish","type":"post","link":"https:\/\/ibex.tech\/csharp\/uwp-programming-in-c\/charts-uwp-programming-in-c\/telerik-ui-for-uwp\/legends","title":{"rendered":"Legends"},"content":{"rendered":"\n<h5 class=\"wp-block-heading\">This needs adding to the top section of the .xaml file<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>xmlns:telerikPrimitives=\"using:Telerik.UI.Xaml.Controls.Primitives\"<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">A vertical list of legends (unbound)<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>    &lt;!-- THE CHART LEGENDS --&gt;\n     &lt;telerikPrimitives:RadLegendControl &gt;\n        &lt;telerikPrimitives:RadLegendControl.LegendItems&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#1E98E4\" Stroke=\"#1E98E4\" Title=\"Temperature 1\"\/&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#FFC500\" Stroke=\"#FFC500\" Title=\"Temperature 2\"\/&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#FF2A00\" Stroke=\"#FF2A00\" Title=\"Temperature 3\"\/&gt;\n        &lt;\/telerikPrimitives:RadLegendControl.LegendItems&gt;\n    &lt;\/telerikPrimitives:RadLegendControl&gt;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Displaying Legends Horizontally<\/h4>\n\n\n\n<p>You can set a height and width of the telerikPrimitives:RadLegendControl, thus causing them to be laid out to fit<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Example with horizontally laid out Legends and styling of the legend items<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>    &lt;!-- THE CHART LEGENDS --&gt;\n    &lt;telerikPrimitives:RadLegendControl Canvas.Left=\"10\" Canvas.Top=\"470\"  Width=\"780\" Height=\"40\" &gt;\n        &lt;!--Style the Legend Items --&gt;\n        &lt;telerikPrimitives:RadLegendControl.ItemTemplate&gt;\n            &lt;DataTemplate&gt;\n                &lt;StackPanel Orientation=\"Horizontal\"&gt;\n                    &lt;Ellipse Fill=\"{Binding Fill}\" Stroke=\"{Binding Stroke}\" StrokeThickness=\"1\" Width=\"10\" Height=\"10\"\/&gt;\n                    &lt;TextBlock Text=\"{Binding Title}\" Foreground=\"{Binding Fill}\" Margin=\"3,0,26,0\" &gt;  &lt;!-- L T R B --&gt;\n                    &lt;\/TextBlock&gt;\n                &lt;\/StackPanel&gt;\n            &lt;\/DataTemplate&gt;\n        &lt;\/telerikPrimitives:RadLegendControl.ItemTemplate&gt;\n        &lt;!-- Create the individual Legend Items --&gt;\n        &lt;telerikPrimitives:RadLegendControl.LegendItems &gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#F48267\" Stroke=\"#F48267\" Title=\"Temperature 1\"\/&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#18E600\" Stroke=\"#18E600\" Title=\"Temperature 2\"\/&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#64F4FF\" Stroke=\"#64F4FF\" Title=\"Temperature 3\"\/&gt;\n            &lt;telerikPrimitives:LegendItem Fill=\"#F4FF67\" Stroke=\"#F4FF67\" Title=\"Temperature 4\"\/&gt;\n        &lt;\/telerikPrimitives:RadLegendControl.LegendItems&gt;\n    &lt;\/telerikPrimitives:RadLegendControl&gt;<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>This needs adding to the top section of the .xaml file A vertical list of legends (unbound) Displaying Legends Horizontally You can set a height and width of the telerikPrimitives:RadLegendControl, thus causing them to be laid out to fit Example with horizontally laid out Legends and styling of the legend items<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[111],"tags":[],"class_list":["post-953","post","type-post","status-publish","format-standard","hentry","category-telerik-ui-for-uwp"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts\/953","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/comments?post=953"}],"version-history":[{"count":0,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/posts\/953\/revisions"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/media?parent=953"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/categories?post=953"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/csharp\/wp-json\/wp\/v2\/tags?post=953"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}