하아찡
[C#/WPF] Chart - 2 본문
추가내역
- 거래량 추가
이전에는 XAML코드를 수정하지않아서 올리지않았는데 거래량 추가를 하기위해 Grid와 Canvas를 추가하여가지고 Xaml코트를 첨부함
아래 코드가 현재 적용된 Xaml코드.
<UserControl x:Class="Upbit.Views.Chart"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
xmlns:prism="http://prismlibrary.com/"
xmlns:conv="clr-namespace:Upbit.Converter"
xmlns:local="clr-namespace:Upbit"
prism:ViewModelLocator.AutoWireViewModel="True">
<UserControl.Resources>
<conv:MultipleHeightConverter x:Key="MultipleHeightConverter"/>
<conv:MultipleYConverter x:Key="MultipleYConverter"/>
<conv:CandleMarginConverter x:Key="CandleMarginConverter"/>
<conv:CandleGridXWidthConverter x:Key="CandleGridXWidthConverter"/>
<conv:ChartYAxisConverter x:Key="ChartYAxisConverter"/>
<Style TargetType="Line" x:Key="HoverLine">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Stroke" Value="Blue"/>
</Trigger>
</Style.Triggers>
</Style>
<Style TargetType="Button" x:Key="BtnTickType">
<Setter Property="Width" Value="30"/>
<Setter Property="Height" Value="30"/>
</Style>
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="1*"/>
<RowDefinition Height="{Binding GridVolumeHeight}"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="80" />
</Grid.ColumnDefinitions>
<Grid Grid.Row="0" Grid.Column="0" HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<ComboBox ItemsSource="{Binding ListTickMin}" SelectedIndex="0" x:Name="ComboMin" Visibility="{Binding VisibleComboBoxMin}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="SelectionChanged">
<i:InvokeCommandAction Command="{Binding CommandSelectedMin}" CommandParameter="{Binding ElementName=ComboMin }" />
</i:EventTrigger>
</i:Interaction.Triggers>
</ComboBox>
<Button Style="{StaticResource BtnTickType}" VerticalAlignment="Center" HorizontalAlignment="Center" Content="{Binding Lang.LMin}" Command="{Binding CommandSelectedTickType}" CommandParameter="minutes"/>
<Button Style="{StaticResource BtnTickType}" VerticalAlignment="Center" HorizontalAlignment="Center" Content="{Binding Lang.LDay}" Command="{Binding CommandSelectedTickType}" CommandParameter="days"/>
<Button Style="{StaticResource BtnTickType}" VerticalAlignment="Center" HorizontalAlignment="Center" Content="{Binding Lang.LWeek}" Command="{Binding CommandSelectedTickType}" CommandParameter="weeks"/>
<Button Style="{StaticResource BtnTickType}" VerticalAlignment="Center" HorizontalAlignment="Center" Content="{Binding Lang.LMonth}" Command="{Binding CommandSelectedTickType}" CommandParameter="months"/>
</StackPanel>
</Grid>
<!-- 캔들 정보 확인 -->
<Grid Grid.Row="1" Grid.Column="0" HorizontalAlignment="Right">
<StackPanel Orientation="Horizontal">
<Label Content="{Binding PrintCursor}" Width="Auto"/>
<Label Content="{Binding TestNum}" Width="Auto"/>
<Label Content="{Binding PrintOp}" Width="Auto"/>
<Label Content="{Binding PrintTp}" Width="Auto"/>
<Label Content="{Binding PrintHp}" Width="Auto"/>
<Label Content="{Binding PrintLp}" Width="Auto"/>
<Label Content="{Binding PrintTime}" Width="Auto"/>
<!--Label Content="{Binding Model.PPrice, Converter={StaticResource DoubleStringConverter} ,ConverterParameter='커서값 '}" Width="Auto" Height="30"/-->
</StackPanel>
</Grid>
<!--ChartSideCursor -->
<Grid Grid.Row="1" Grid.Column="1" Grid.RowSpan="3" x:Name="MyGridYSide" ClipToBounds="true">
<Canvas>
<ItemsControl ItemsSource="{Binding PrintChartYAxis}" >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style TargetType="ContentPresenter">
<Setter Property="Canvas.Left" Value="{Binding X}"/>
<Setter Property="Canvas.Top" Value="{Binding Y}"/>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Width="{Binding ElementName=MyGridYSide,Path=ActualWidth}" >
<Polygon Points="10,0 0,8, 10,16" StrokeThickness="0" Fill="{Binding BackColor}" VerticalAlignment="Center" />
<TextBlock Width="{Binding ElementName=MyGridYSide,Path=ActualWidth}" Height="16" Text="{Binding CursorValue}" Foreground="{Binding Color}" Background="{Binding BackColor}" Padding="5,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Stretch" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Canvas>
</Grid>
<Grid Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="2" x:Name="MyGridXSide" ClipToBounds="true">
<Canvas>
<ItemsControl ItemsSource="{Binding PrintChartXAxis}" >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style TargetType="ContentPresenter">
<Setter Property="Canvas.Left" Value="{Binding X}"/>
<Setter Property="Canvas.Top" Value="{Binding Y}"/>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" VerticalAlignment="Center" Width="auto" >
<Polygon Points="10,0 0,8, 10,16" StrokeThickness="0" Fill="{Binding BackColor}" VerticalAlignment="Center" />
<TextBlock Width="auto" Height="16" Text="{Binding CursorValue}" Foreground="{Binding Color}" Background="{Binding BackColor}" Padding="5,0,0,0" VerticalAlignment="Center" HorizontalAlignment="Stretch" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Canvas>
</Grid>
<Grid Grid.Row="2" Grid.Column="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" x:Name="mygrid" Background="Transparent">
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseDown">
<i:InvokeCommandAction Command="{Binding DataContext.CommandMouseDown,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" PassEventArgsToCommand="True" />
</i:EventTrigger>
<i:EventTrigger EventName="MouseUp">
<i:InvokeCommandAction Command="{Binding DataContext.CommandMouseUp,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" CommandParameter="{Binding ElementName=mygrid}"/>
</i:EventTrigger>
<i:EventTrigger EventName="MouseMove">
<i:InvokeCommandAction Command="{Binding DataContext.CommandMouseMove,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" PassEventArgsToCommand="True" />
</i:EventTrigger>
<i:EventTrigger EventName="MouseLeave">
<i:InvokeCommandAction Command="{Binding DataContext.CommandMouseLeave,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" CommandParameter="{Binding ElementName=mygrid}"/>
</i:EventTrigger>
<i:EventTrigger EventName="MouseWheel">
<i:InvokeCommandAction Command="{Binding DataContext.CommandMouseWheel,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" PassEventArgsToCommand="True"/>
</i:EventTrigger>
</i:Interaction.Triggers>
<Canvas x:Name="mycanvas" ClipToBounds="True" >
<ItemsControl ItemsSource="{Binding HorLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ElementName=mycanvas,Path=ActualWidth}" Y1="{Binding FromY}" Y2="{Binding ToY}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding VerLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ToX}" Y1="{Binding FromY}" Y2="{Binding ElementName=mycanvas,Path=ActualHeight}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}">
</Line>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintChartXAxis}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line X1="{Binding X}" X2="{Binding X}" Y1="{Binding Y}" Y2="{Binding ElementName=mycanvas,Path=ActualHeight}" Stroke="{Binding BackColor}" StrokeThickness="1"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintTick}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas >
</Canvas>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style TargetType="ContentPresenter">
<Setter Property="Canvas.Left">
<Setter.Value>
<MultiBinding Converter="{StaticResource CandleGridXWidthConverter}">
<Binding Path="DataContext.TickWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="X" />
</MultiBinding>
</Setter.Value>
</Setter>
<Setter Property="Canvas.Top">
<Setter.Value>
<MultiBinding Converter="{StaticResource MultipleYConverter}">
<Binding Path="DataContext.MaxPrice" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="HP" />
<Binding Path="DataContext.ChartTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
</MultiBinding>
</Setter.Value>
</Setter>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid >
<Rectangle VerticalAlignment="Top" Width="{Binding DataContext.TickWidth,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" Fill="{Binding Colors}" StrokeThickness="0">
<Rectangle.Height>
<MultiBinding Converter="{StaticResource MultipleHeightConverter}">
<Binding Path="DataContext.ChartTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Candle" />
</MultiBinding>
</Rectangle.Height>
<Rectangle.Margin>
<MultiBinding Converter="{StaticResource CandleMarginConverter}">
<Binding Path="CandleStartPoint" />
<Binding Path="DataContext.ChartTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
</MultiBinding>
</Rectangle.Margin>
</Rectangle>
<Rectangle Width="1" Fill="{Binding Colors}">
<Rectangle.Height>
<MultiBinding Converter="{StaticResource MultipleHeightConverter}">
<Binding Path="DataContext.ChartTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Tail" />
</MultiBinding>
</Rectangle.Height>
</Rectangle>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintChartYAxis}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line X1="{Binding X}" X2="{Binding ElementName=mycanvas,Path=ActualWidth}" Y1="{Binding Y,Converter={StaticResource ChartYAxisConverter}}" Y2="{Binding Y,Converter={StaticResource ChartYAxisConverter}}" Stroke="{Binding BackColor}" StrokeThickness="1"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Canvas>
</Grid>
<Grid Grid.Row="3">
<Canvas x:Name="myvolumecanvas" ClipToBounds="True" >
<ItemsControl ItemsSource="{Binding HorLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ElementName=myvolumecanvas,Path=ActualWidth}" Y1="{Binding FromY}" Y2="{Binding ToY}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding VerLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ToX}" Y1="{Binding FromY}" Y2="{Binding ElementName=myvolumecanvas,Path=ActualHeight}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}">
</Line>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintTick}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas >
</Canvas>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style TargetType="ContentPresenter">
<Setter Property="Canvas.Left">
<Setter.Value>
<MultiBinding Converter="{StaticResource CandleGridXWidthConverter}">
<Binding Path="DataContext.TickWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="X" />
</MultiBinding>
</Setter.Value>
</Setter>
<Setter Property="Canvas.Top">
<Setter.Value>
<MultiBinding Converter="{StaticResource MultipleYConverter}">
<Binding Path="DataContext.MaxVolume" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Volume" />
<Binding Path="DataContext.VolumeTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
</MultiBinding>
</Setter.Value>
</Setter>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid >
<Rectangle VerticalAlignment="Top" Width="{Binding DataContext.TickWidth,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" Fill="{Binding Colors}" StrokeThickness="0">
<Rectangle.Height>
<MultiBinding Converter="{StaticResource MultipleHeightConverter}">
<Binding Path="DataContext.VolumeTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Volume" />
</MultiBinding>
</Rectangle.Height>
</Rectangle>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintChartXAxis}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line X1="{Binding X}" X2="{Binding X}" Y1="{Binding Y}" Y2="{Binding ElementName=mycanvas,Path=ActualHeight}" Stroke="{Binding BackColor}" StrokeThickness="1"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Canvas>
</Grid>
</Grid>
<i:Interaction.Triggers>
<i:EventTrigger EventName="SizeChanged">
<i:InvokeCommandAction Command="{Binding CommandGridLines}" CommandParameter="{Binding ElementName=mygrid}" />
</i:EventTrigger>
<i:EventTrigger EventName="Loaded">
<i:InvokeCommandAction Command="{Binding CommandGridLines}" CommandParameter="{Binding ElementName=mygrid}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</UserControl>
거래량을 추가한 Grid와 캔버스 코드는 아래 Xaml로 보기편하게 따로 다시작성함.
<Grid Grid.Row="3">
<Canvas x:Name="myvolumecanvas" ClipToBounds="True" >
<ItemsControl ItemsSource="{Binding HorLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ElementName=myvolumecanvas,Path=ActualWidth}" Y1="{Binding FromY}" Y2="{Binding ToY}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding VerLine}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line Style="{StaticResource HoverLine}" X1="{Binding FromX}" X2="{Binding ToX}" Y1="{Binding FromY}" Y2="{Binding ElementName=myvolumecanvas,Path=ActualHeight}" Stroke="{Binding LineColor}" StrokeThickness="{Binding LineThickness}">
</Line>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintTick}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas >
</Canvas>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style TargetType="ContentPresenter">
<Setter Property="Canvas.Left">
<Setter.Value>
<MultiBinding Converter="{StaticResource CandleGridXWidthConverter}">
<Binding Path="DataContext.TickWidth" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="X" />
</MultiBinding>
</Setter.Value>
</Setter>
<Setter Property="Canvas.Top">
<Setter.Value>
<MultiBinding Converter="{StaticResource MultipleYConverter}">
<Binding Path="DataContext.MaxVolume" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Volume" />
<Binding Path="DataContext.VolumeTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
</MultiBinding>
</Setter.Value>
</Setter>
</Style>
</ItemsControl.ItemContainerStyle>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Grid >
<Rectangle VerticalAlignment="Top" Width="{Binding DataContext.TickWidth,RelativeSource={RelativeSource Mode=FindAncestor,AncestorType=UserControl}}" Fill="{Binding Colors}" StrokeThickness="0">
<Rectangle.Height>
<MultiBinding Converter="{StaticResource MultipleHeightConverter}">
<Binding Path="DataContext.VolumeTickHeight" RelativeSource="{RelativeSource Mode=FindAncestor, AncestorType=UserControl}" />
<Binding Path="Volume" />
</MultiBinding>
</Rectangle.Height>
</Rectangle>
</Grid>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<ItemsControl ItemsSource="{Binding PrintChartXAxis}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line X1="{Binding X}" X2="{Binding X}" Y1="{Binding Y}" Y2="{Binding ElementName=mycanvas,Path=ActualHeight}" Stroke="{Binding BackColor}" StrokeThickness="1"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Canvas>
</Grid>기존 차트를 출력하는 Candle값에 대부분 데이터가 들어가있어가지고 해당 데이터를 캔버스에 그려주는 방식만 변경해주면 되는부분이였어가지고 금방함.
그러려면 해당 부분을 출력하는 캔버스를 이해해야하는데 간단하게 설명하자면
몸통 -> 시가(OP)와 종가(TP)를 표시
꼬리 -> 고가(HP)와 저가(LP)를 표시
로 설명하겠습니다.
제가 만든 방식은 Canvas에 X, Y축을 사용해서 각 캔들의 위치를 정해줬습니다.
몸통과 꼬리는 하나의 Grid에 묶여서 출력됨으로 꼬리를 기준으로 Y축을 정해준 후 몸통은 Margin을 사용해서 띄워주는 방식으로 사용했습니다.
X축은 해당 캔들이 몇 번째 위치에 있는지를 표시하기위해 사용했고.
Y축은 차트처럼 보일라면 위 아래 차이가 있어야하기때문에 꼬리를 기준으로잡고 Canvas에 Y축을 지정해줬습니다.
Y축 위치를 정해줄때는
(최고가 - 캔들 고가) * 캔버스비율(캔버스 크기 / ( 최고가 - 최저가)) 를 사용해서 Y축을 구해준다음,
몸통은 위에서 설명했듯이 Margin을 사용하는데 Margin중에서도 Top만 사용함.
Margin.Top은 캔들의 시작점을 구하는데 해당 시작점은 (고가 - (시가보다 종가가 클경우 종가로 아닐경우 시가로))
구하여 띄워주는 방식을 사용하였음.
이러한 방식을 사용해서 차트를 만들었고
거래량은 해당 캔들에서 꼬리를 출력을 제거하고 거래량을 가지고 몸통만 만들어서 출력해주면되서
Canvas.Top부분 값을 위에 전체Xaml과 거래량Xaml따로 올린코드를 비교해보면 차트쪽은 고가(HP)를 사용하였고 거래량쪽은 거래량(Volume)을 사용하여 해당부분만 변경해주고 Margin을 사용할필요가없어서 제거해주면 거래량 Canvas끝!
너무 두서없이 적었는데 전에 작업된 내용들이 워낙많아가지고 해당 코드와 같이 블로그에 올리면 해당링크를 다시 남겨드리겠습니다.
그리고 해당 그리드를 나눠둔 Grid.RowDefinitions를 확인해보면 아래와같은 코드로 작성하였는데.
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="1*"/>
<RowDefinition Height="{Binding GridVolumeHeight}"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>Row -> 1*사이즈는 Chart를 그려주는 캔버스가 존재하고
Row -> GridVolumeHeight사이즈는 거래량을 표시해주는 영역 사이즈 입니다. 해당 영역을 변수로 지정한 이유는 추후 거래량 Row사이즈를 변경할수있게 하기위해 변수로 미리 지정해둠.
- Chart Row는 변수로 지정하지 않은 이유는 1*이면 영역사이즈를 자동으로 변경됨으로 딱히 변수로 지정할 필요가 없어보였임.
추가 수정사항.
- 거래량 Row를 변경할수있는 Event를 추가.
반응형
'C# > 코인프로그램 - 진행상황' 카테고리의 다른 글
| 업비트 서버 점검시 프로그램 먹통되는 버그 발생. (1) | 2023.12.04 |
|---|---|
| [C#/WPF] Chart - 3 (2) | 2023.11.26 |
| [C#/WPF] Chart - 1 (2) | 2023.11.23 |
| [C#/WPF] WPF MVVM 패턴으로 작업중인 프로그램 Prism프레임워크 사용으로 변경... (0) | 2023.11.21 |
| 오랜만에 다시 작업 (0) | 2023.05.13 |
'C#/코인프로그램 - 진행상황' Related Articles
more
