I been stack for the last few days trying to figure out the SilverLight 4 LineSeries graph, for some strange reason the graph being displayed but the line not being displayed. I am pretty sure that my mistake is something very basic but I been straggling to pinpoint the problem by myself.
Bellow is the code that I having problem with.
<toolkit:Chart HorizontalAlignment="Left" x:Name="chartLine" Margin="31,35,0,0" Title="Chart for test" VerticalAlignment="Top" Height="233" Width="309">
<toolkit:LineSeries IsSelectionEnabled="True" HorizontalAlignment="Left" DependentValuePath="Y" IndependentValuePath="X" Margin="195,49,0,0" Name="lineSeries1" VerticalAlignment="Top" Height="78" Width="130">
<toolkit:LineSeries.ItemsSource>
<PointCollection>
<Point>1,10</Point>
<Point>2,20</Point>
<Point>3,30</Point>
<Point>4,40</Point>
</PointCollection>
</toolkit:LineSeries.ItemsSource>
</toolkit:LineSeries>
</toolkit:Chart>
I would also apreciate if anyone can point me to some code example with scrollable graph on Silverlight.
Thank you in advance.
Here's the corrected XAML. Your problem is the HorizontalAlignment/VerticalAlignment/Margin/Width/Height you have set in the LineSeries. Removing these fixes the problem.
Here's the complete XAML which shows the Chart with the lines properly placed.
<UserControl x:Class="SilverlightApplication1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:toolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White">
<toolkit:Chart HorizontalAlignment="Left" x:Name="chartLine" Margin="31,35,0,0" Title="Chart for test" VerticalAlignment="Top" Height="233" Width="309">
<toolkit:LineSeries IsSelectionEnabled="True" DependentValuePath="Y" IndependentValuePath="X" Name="lineSeries1">
<toolkit:LineSeries.ItemsSource>
<PointCollection>
<Point>1,10</Point>
<Point>2,20</Point>
<Point>3,30</Point>
<Point>4,40</Point>
</PointCollection>
</toolkit:LineSeries.ItemsSource>
</toolkit:LineSeries>
</toolkit:Chart>
</Grid>
</UserControl>
Related
I am using the Xceed Extended WPF Toolkit for the Integer Up Down Control. I have installed this via Nuget.
I have the integrated into a custom control which contains other normal textboxes and button etc.
This custom control I then put in a tab control on a Window. Everything shows correctly apart from this IntegerUpDown which shows as an empty box. (It is fine when looking at the custom control in design)
I have added the namespace to both the control and window so am not sure what the problem is. Everything is inside one project so I don't think references are a problem.
Any ideas of what I could be missing?
Control XAML:
<Label Grid.Row="3" Content="Quantity of Tickets:" VerticalAlignment="Center"></Label>
<xctk:IntegerUpDown Grid.Row="3" Grid.Column="1" Name="numTickets"></xctk:IntegerUpDown>
Form XAML:
<TabItem Header="New Booking">
<Grid Background="#FFE5E5E5">
<btc:NewBooking></btc:NewBooking>
</Grid>
</TabItem>
Thanks,
Ryan
Here's a MCVE:
MainWindow:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:WpfApplication8"
x:Class="WpfApplication8.MainWindow"
mc:Ignorable="d"
Title="MainWindow" Height="300" Width="300">
<Grid>
<TabControl x:Name="tabControl" Margin="0">
<TabItem Header="TabItem 1">
<Grid Background="#FFE5E5E5">
<local:UserControl1></local:UserControl1>
</Grid>
</TabItem>
<TabItem Header="TabItem 2">
<Grid Background="#FFE5E5E5"/>
</TabItem>
</TabControl>
</Grid>
UserControl:
<UserControl x:Class="WpfApplication8.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
xmlns:local="clr-namespace:WpfApplication8"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<StackPanel>
<Label Grid.Row="3" Content="Quantity of Tickets:" VerticalAlignment="Center"></Label>
<xctk:IntegerUpDown Grid.Row="3" Grid.Column="1" Name="numTickets"></xctk:IntegerUpDown>
</StackPanel>
</Grid>
Both MainWindow and UserControl are at the same level in the project structure:
EDIT: One more thing, make sure your UserControl is fully contained by the MainWindow and you do NOT have something like this:
That would cause the IntegerUpDown look like an empty box, like you described.
I have been using MahApp.Metro for a few project now, and WinForms charts too, and also combined them.
So nothing new on that front in this project, except :
The placement of the chart.
And this is causing an issue where the Mahapps.Metro Flyout menu i have opens BEHIND the chart. See Screenshot.
Is there any way to solve this? i have searched a bit and found nothing. In CSS it would be a simple z-index setting... but in C# i have no idea.
Any help appreciated.
XAML as requested :
<Controls:MetroWindow x:Name="wdw_MainWindow" x:Class="AdminProgram.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:winformchart="clr-namespace:System.Windows.Forms.DataVisualization.Charting;assembly=System.Windows.Forms.DataVisualization"
xmlns:local="clr-namespace:AdminProgram"
mc:Ignorable="d"
Title="MainWindow" Height="600" Width="1024" GlowBrush="{DynamicResource AccentColorBrush}" WindowStartupLocation="CenterScreen" ResizeMode="NoResize" BorderThickness="2,2,0,2" ShowMinButton="False" ShowMaxRestoreButton="False" IsMinButtonEnabled="False" IsMaxRestoreButtonEnabled="False" BorderBrush="#FF7C7C7C" TitleForeground="White">
<Controls:MetroWindow.Flyouts>
<Controls:FlyoutsControl>
<Controls:Flyout x:Name="fyo_Menu" Header="Menu" Width="200" Theme="Accent">
<Grid>
<Controls:Tile x:Name="btn_AddNew" Title="Add New"
Width="150" Height="150" TitleFontSize="20" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0" Click="btn_AddNew_Click" KeepDragging="False" MouseEnter="Tile_MouseEnter" MouseLeave="Tile_MouseLeave" BorderBrush="#FFC89632">
</Controls:Tile>
<Controls:Tile x:Name="btn_ViewAll" Title="View All"
Width="150" Height="150" TitleFontSize="20" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="0,160,0,0" Padding="0" Click="btn_ViewAll_Click" MouseEnter="Tile_MouseEnter" MouseLeave="Tile_MouseLeave" BorderBrush="#FFC89632" >
</Controls:Tile>
</Grid>
</Controls:Flyout>
</Controls:FlyoutsControl>
</Controls:MetroWindow.Flyouts>
<GroupBox x:Name="gpb_Home_Stats" Header="Latest information and statistics" Margin="0,50,0,0">
<Grid>
<!--- Winforms Integrated charting -->
<!--Strength bars -->
<WindowsFormsHost x:Name="wfh_Statistics_Strengthometer" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="0,0,0,0" Width="950" Height="425">
<winformchart:Chart x:Name="chart_Strengthometer" Dock="None">
<winformchart:Chart.Legends>
<winformchart:Legend Docking="Left" TitleSeparator="Line" Title="Coffee count by strength"/>
</winformchart:Chart.Legends>
<winformchart:Chart.Series>
<winformchart:Series Name="Strength" ChartType="Column"/>
</winformchart:Chart.Series>
<winformchart:Chart.ChartAreas>
<winformchart:ChartArea/>
</winformchart:Chart.ChartAreas>
</winformchart:Chart>
</WindowsFormsHost>
</Grid>
</GroupBox>
That's a known issue when mixing WinForms and WPF and is not related to MahApps.Metro. Just search for Airspace here at StackOverflow.
I've already posted a message about this, but I've lost it! And I can paste code now too...
I have a RibbonRadioButton whose image is being stretched, XAML below (I haven't changed the code-behind from its default). I have checked that the PNG is at 96dpi but the problem remains.
XAML:
<Window x:Class="DashboardTest.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ribbon="clr-namespace:Microsoft.Windows.Controls.Ribbon;assembly=RibbonControlsLibrary"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ribbon:Ribbon x:Name="Ribbon">
<ribbon:RibbonGroup x:Name="LiveStatusGroup"
Header="RibbonGroup Header">
<ribbon:RibbonRadioButton x:Name="Dashboard"
LargeImageSource="images\LiveStatus_Dashboard.png"
HorizontalContentAlignment="Center"
HorizontalAlignment="Center"
VerticalContentAlignment="Center"
VerticalAlignment="Center"
Label="RibbonRadioButton Label"
ToolTip="RibbonRadioButton ToolTip"/>
</ribbon:RibbonGroup>
</ribbon:Ribbon>
</Grid>
</Window>
Can anyone shed light on why this is happening? I am running Windows 7 with text size set to medium (125%).
J
I am having a problem with different appearance in Blend/VS2012 IDE and in Debugging.
In IDE, the Rectangle is at the center, but when it is compiled or debugged, the size of the margin is different. In my view, this occurs because the size of the window border is different. I really want to fix this problem. Any suggestions?
Thank You.
XAML
<Window x:Class="WpfApplication2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="202" Width="194">
<Grid HorizontalAlignment="Left" Height="171" VerticalAlignment="Top" Width="186">
<Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="151" Margin="10,10,0,0" Stroke="Black" VerticalAlignment="Top" Width="166"/>
</Grid>
Edited XAML code:
<Window x:Class="WpfApplication2.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="202" Width="194">
<Grid HorizontalAlignment="Left" Height="171" VerticalAlignment="Top" Width="186">
<Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Center" Height="151" Margin="10" Stroke="Black" VerticalAlignment="Center" Width="166"/>
</Grid>
Result is the same. Is this problem of my PC?
Your Problem here is Window Size includes the Chrome Size(Window Border and stuff like close/max min buttons).
Your Grid is hence the size you requested but it does not fit in the window size you've requested.
I could fix your issue to make the output window look like this, with Window size:
Width: 202
Height: 210
on Windows 8
However you should rather have your window size set to SizeToContent="WidthAndHeight"
Example:
<Window x:Class="WpfApplication4.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication4"
x:Name="window"
Title="MainWindow"
SizeToContent="WidthAndHeight">
<Grid HorizontalAlignment="Left" Height="171" VerticalAlignment="Top" Width="186">
<Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="151" Margin="10,10,0,0" Stroke="Black" VerticalAlignment="Top" Width="166"/>
</Grid>
</Window>
Your thus not assuming Chrome sizes which might be different from different versions of Windows.
You should also get Snoop. It helps you debug such issues very easily, It shows a red border on a control when you hover on it with Shift+Ctrl, so you can actually see the Grid extend past the visible Window while showing the actual Element Layout of your UI
This code is showing the axis line in .2 increments, which is not so useful as we are showing
number of days for patients in this group. I can't see anything that would have causes the .2 perhaps you can see something or where else would i locate the error?
<Button x:Class="OTFDashboard.Common.Modules.MissedMedications.Views.MedicineTileView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"
xmlns:vc="clr-namespace:Visifire.Charts;assembly=WPFVisifire.Charts"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="300"
MinHeight="{StaticResource TileMinHeight}"
MinWidth="{StaticResource TileMinWidth}"
MaxHeight="{StaticResource TileMaxHeight}"
MaxWidth="{StaticResource TileMaxWidth}"
Command="{Binding Command}"
Template="{StaticResource TileControlTemplate}">
<StackPanel Orientation="Vertical"
dx:ThemeManager.ThemeName="Office2007Blue">
<vc:Chart x:Name="MedicineChart"
Watermark="False"
Width="Auto"
Height="Auto"
VerticalContentAlignment="Stretch"
HorizontalContentAlignment="Stretch"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
MinHeight="200"
MinWidth="{StaticResource ChartMinWidth}"
CornerRadius="15,15,15,15"
RenderTransformOrigin="0.5,0.5"
FontSize="8"
Background="Transparent">
<vc:Chart.PlotArea>
<vc:PlotArea Background="#00000000" />
</vc:Chart.PlotArea>
<vc:Chart.Titles>
<vc:Title Text="Number of patients who Missed Medications" />
</vc:Chart.Titles>
<vc:Chart.AxesX>
<vc:Axis IntervalType="Days"
ValueFormatString="MMM-d"
Interval="1">
<vc:Axis.AxisLabels>
<vc:AxisLabels Angle="0" />
</vc:Axis.AxisLabels>
</vc:Axis>
</vc:Chart.AxesX>
<vc:Chart.Series>
<vc:DataSeries RenderAs="Column"
DataSource="{Binding MedicineSource}"
XValueFormatString="MMM-d">
<vc:DataSeries.DataMappings>
<vc:DataMapping MemberName="XValue"
Path="Day" />
<vc:DataMapping MemberName="YValue"
Path="Count" />
</vc:DataSeries.DataMappings>
</vc:DataSeries>
</vc:Chart.Series>
</vc:Chart>
</StackPanel>
</Button>
I'm assuming you're using Microsoft's Chart Controls here.
Looks like you've set the Interval property correctly. But if you're talking about grid lines you need to use the MajorGrid, MinorGrid MajorTickMark and MinorTickMark properties.
Only other thought I have at the moment is to change your X-axis datatype to a double instead of DateTime and see if that helps.
Most of my knowledge of the charting controls comes from poking around in the samples code. Perhaps you can find a sample which is close to what you're trying to do.
ChartName.Series(seriesName).YValueType = ChartValueType.Int32
From - (Visual Studio 2010 Chart control: Make Y Axis an Integer value, not decimal)