From 53b9fd38838f6400737d0e8fed72f9e599828cc1 Mon Sep 17 00:00:00 2001
From: hj615 <hj615@cuuva.com>
Date: Mon, 1 Dec 2025 10:23:59 +0900
Subject: [PATCH] =?UTF-8?q?design:=20Line=20=EA=B7=B8=EB=9E=98=ED=94=84=20?=
 =?UTF-8?q?&=20=EC=84=A4=EC=A0=95=EC=B9=B8=20=EB=94=94=EC=9E=90=EC=9D=B8?=
 =?UTF-8?q?=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 SmartAquaViewer/MainWindow.xaml               |   4 +-
 SmartAquaViewer/Resources/Generic.xaml        | 101 ++++++++-
 SmartAquaViewer/View/MonitoringView.xaml      | 208 ++++++++++++------
 .../ViewModel/GraphControlViewModel.cs        |  52 +++--
 .../ViewModel/MonitoringViewModel.cs          |   2 +
 5 files changed, 272 insertions(+), 95 deletions(-)

diff --git a/SmartAquaViewer/MainWindow.xaml b/SmartAquaViewer/MainWindow.xaml
index 615c8a6..5358c03 100644
--- a/SmartAquaViewer/MainWindow.xaml
+++ b/SmartAquaViewer/MainWindow.xaml
@@ -61,7 +61,7 @@
 
         <view:FileListView Grid.Row="1" Grid.RowSpan="2" x:Name="fileListView"/>
 
-        <Border Grid.Row="1" Grid.Column="1" Margin="16 12 16 0">
+        <Border Grid.Row="1" Grid.Column="1" Margin="24 12 24 0">
             <UniformGrid Columns="4">
                 <RadioButton x:Name="rdbtnMonitoing" GroupName="contentSwap" Content="모니터링" Tag="monitoring"
                              Style="{StaticResource RadioButtonTabStyle}" IsChecked="True" FontSize="30"
@@ -85,6 +85,6 @@
         </Border>
 
         <ContentControl x:Name="contentControl" Content="{Binding SelectedViewModel}"
-                        Grid.Row="2" Grid.Column="1" Margin="30 16 30 12"/>
+                        Grid.Row="2" Grid.Column="1" Margin="24 16 24 12"/>
     </Grid>
 </Window>
diff --git a/SmartAquaViewer/Resources/Generic.xaml b/SmartAquaViewer/Resources/Generic.xaml
index 53b4b38..d324955 100644
--- a/SmartAquaViewer/Resources/Generic.xaml
+++ b/SmartAquaViewer/Resources/Generic.xaml
@@ -281,7 +281,9 @@
             <Setter.Value>
                 <ControlTemplate TargetType="ComboBoxItem">
                     <Border x:Name="Bd"
-                            Background="{TemplateBinding Background}">
+                            Background="{TemplateBinding Background}"
+                            BorderThickness="0 1 0 0"
+                            BorderBrush="#264A60">
                         <ContentPresenter
                             Margin="{TemplateBinding Padding}"
                             HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
@@ -482,6 +484,32 @@
         </Setter>
     </Style>
 
+    <Style TargetType="ListBoxItem" x:Key="ListBoxItemStyle" BasedOn="{StaticResource MaterialDesignListBoxItem}">
+        <Setter Property="Background" Value="#1D3649"/>
+        <Setter Property="Padding" Value="0"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="HorizontalContentAlignment" Value="Left"/>
+
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="ListBoxItem">
+                    <Border x:Name="RootBorder"
+                        Background="{TemplateBinding Background}"
+                        CornerRadius="15"
+                        Margin="0 0 4 8">
+                        <ContentPresenter/>
+                    </Border>
+
+                    <ControlTemplate.Triggers>
+                        <Trigger Property="IsEnabled" Value="False">
+                            <Setter Property="Opacity" Value="0.6"/>
+                        </Trigger>
+                    </ControlTemplate.Triggers>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
+
     <Style x:Key="SquareCheckToggleButtonStyle" TargetType="ToggleButton">
         <!-- 기본 값들 -->
         <Setter Property="Background" Value="Transparent"/>
@@ -549,4 +577,75 @@
             </Setter.Value>
         </Setter>
     </Style>
+
+    <Style x:Key="CircleCheckToggleButtonStyle" TargetType="ToggleButton">
+        <!-- 기본 값들 -->
+        <Setter Property="Background" Value="Transparent"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="Padding" Value="0"/>
+        <Setter Property="Foreground" Value="#999999"/>
+        <!-- 기본 숫자색: 회색 -->
+
+        <Setter Property="Template">
+            <Setter.Value>
+                <ControlTemplate TargetType="ToggleButton">
+                    <StackPanel Orientation="Horizontal"
+                                HorizontalAlignment="Left" VerticalAlignment="Center">
+
+                        <!-- 네모 체크박스 부분 -->
+                        <Border x:Name="CheckBoxBorder"
+                                Width="18"
+                                Height="18"
+                                Background="Transparent"
+                                BorderBrush="#264A60"
+                                BorderThickness="1.5"
+                                CornerRadius="9"
+                                Margin="0 6 8 6">
+
+                            <!-- 체크 표시 -->
+                            <Path x:Name="CheckMark"
+                                  Stroke="White"
+                                  StrokeThickness="2"
+                                  Data="M3,9 L7,13 L14,4"
+                                  Stretch="Uniform"
+                                  SnapsToDevicePixels="True"
+                                  Visibility="Collapsed"/>
+                        </Border>
+
+                        <!-- 숫자(컨텐츠) -->
+                        <ContentPresenter x:Name="contentPresenter"
+                                          VerticalAlignment="Center"
+                                          TextElement.Foreground="{TemplateBinding Foreground}"
+                                          TextElement.FontSize="12"
+                                          TextElement.FontFamily="{StaticResource SCDream2}"/>
+                    </StackPanel>
+
+                    <ControlTemplate.Triggers>
+                        <!-- 체크 되었을 때 -->
+                        <Trigger Property="IsChecked" Value="True">
+                            <Setter TargetName="CheckBoxBorder"
+                                    Property="Background"
+                                    Value="#325C80"/>
+                            <!-- 파란 배경 -->
+                            <Setter TargetName="CheckBoxBorder"
+                                    Property="BorderBrush"
+                                    Value="#325C80"/>
+                            <Setter TargetName="CheckMark"
+                                    Property="Visibility"
+                                    Value="Visible"/>
+                            <Setter Property="Foreground" Value="White"/>
+                            <!-- 숫자 흰색 -->
+                        </Trigger>
+
+                        <!-- 마우스 오버 효과 약간 -->
+                        <Trigger Property="IsMouseOver" Value="True">
+                            <Setter TargetName="CheckBoxBorder"
+                            Property="BorderBrush"
+                            Value="#3A6C90"/>
+                        </Trigger>
+                    </ControlTemplate.Triggers>
+                </ControlTemplate>
+            </Setter.Value>
+        </Setter>
+    </Style>
 </ResourceDictionary>
\ No newline at end of file
diff --git a/SmartAquaViewer/View/MonitoringView.xaml b/SmartAquaViewer/View/MonitoringView.xaml
index af83e39..6904c7e 100644
--- a/SmartAquaViewer/View/MonitoringView.xaml
+++ b/SmartAquaViewer/View/MonitoringView.xaml
@@ -563,13 +563,13 @@
                                 <StackPanel>
                                     <Grid Margin="24 24 24 16">
                                         <Grid.ColumnDefinitions>
-                                            <ColumnDefinition Width="80"/>
+                                            <ColumnDefinition Width="110"/>
                                             <ColumnDefinition/>
                                         </Grid.ColumnDefinitions>
                                         <TextBlock Text="그래프" VerticalAlignment="Center"
                                                    FontSize="18" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
 
-                                        <ComboBox Margin="15 0 0 0" Height="40" Grid.Column="1"
+                                        <ComboBox Margin="15 0 0 0" Height="35" Grid.Column="1"
                                                   Style="{StaticResource ComboBoxStyle}"
                                                   FontFamily="{StaticResource SCDream3}"
                                                   ItemsSource="{Binding GraphTypes}"
@@ -577,14 +577,14 @@
                                                   helper:ComboBoxHelper.SelectFirstOnItemsChange="True"
                                                   IsEditable="False" IsTextSearchEnabled="False"/>
                                     </Grid>
-                                    <Grid Margin="15 0 15 10">
+                                    <Grid Margin="24 0 24 16">
                                         <Grid.ColumnDefinitions>
-                                            <ColumnDefinition Width="80"/>
+                                            <ColumnDefinition Width="110"/>
                                             <ColumnDefinition/>
                                         </Grid.ColumnDefinitions>
                                         <TextBlock Text="X축" VerticalAlignment="Center"
-                                                   FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
-                                        <ComboBox Margin="15 0 0 0" Height="40" Grid.Column="1"
+                                                   FontSize="18" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
+                                        <ComboBox Margin="15 0 0 0" Height="35" Grid.Column="1"
                                                   Style="{StaticResource ComboBoxStyle}"
                                                   FontFamily="{StaticResource SCDream3}"
                                                   ItemsSource="{Binding XFieldCandidates}"
@@ -592,38 +592,46 @@
                                                   DisplayMemberPath="Display"/>
                                     </Grid>
 
-                                    <StackPanel Margin="15 0" Style="{StaticResource VisibleWhenTank}">
-                                        <TextBlock Text="수조 (복수 선택)" VerticalAlignment="Center"
-                                                   FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
-
-                                        <Border CornerRadius="10" Margin="0 5 0 10">
-                                            <ListBox ItemsSource="{Binding TankGroups}"
-                                                     SelectionMode="Extended"
-                                                     helper:MultiSelectBehavior.SelectedDictionary="{Binding SelectedWaterTanks}"
-                                                     helper:MultiSelectBehavior.KeyPath="Key"
-                                                     helper:MultiSelectBehavior.ValuePath="Value"
-                                                     FontSize="16" FontWeight="Bold"
-                                                     FontFamily="{StaticResource SCDream5}"
-                                                     Style="{StaticResource MaterialDesignChoiceChipListBox}"
-                                                     ItemContainerStyle="{StaticResource TransparentListBoxItemStyle}"
-                                                     Background="Transparent">
-
-                                                <ListBox.ItemTemplate>
-                                                    <DataTemplate>
-                                                        <ToggleButton Content="{Binding Key}"
-                                                                      Focusable="False"
-                                                                      IsChecked="{Binding IsSelected,
-                                                                                  RelativeSource={RelativeSource AncestorType=ListBoxItem}}"
-                                                                      Style="{StaticResource SquareCheckToggleButtonStyle}"
-                                                                      Margin="0 0 20 0"/>
-                                                    </DataTemplate>
-                                                </ListBox.ItemTemplate>
-
-                                            </ListBox>
-                                        </Border>
-                                    </StackPanel>
+                                    <Grid Margin="24 0 24 16" Style="{StaticResource VisibleWhenTank}">
+                                        <Grid.ColumnDefinitions>
+                                            <ColumnDefinition Width="110"/>
+                                            <ColumnDefinition/>
+                                        </Grid.ColumnDefinitions>
+                                        <TextBlock VerticalAlignment="Center" Padding="0"
+                                                    Foreground="White">
+                                            <Run Text="수조" FontSize="18" FontFamily="{StaticResource SCDream4}"/>
+                                            <LineBreak/>
+                                            <Run Text="(복수 선택 가능)" FontSize="14" Foreground="#767676"/>
+                                        </TextBlock>
+
+                                        <ListBox ItemsSource="{Binding TankGroups}"
+                                                 Grid.Column="1" Margin="15 0 0 0"
+                                                 VerticalAlignment="Center"
+                                                 SelectionMode="Extended"
+                                                 helper:MultiSelectBehavior.SelectedDictionary="{Binding SelectedWaterTanks}"
+                                                 helper:MultiSelectBehavior.KeyPath="Key"
+                                                 helper:MultiSelectBehavior.ValuePath="Value"
+                                                 FontSize="16" FontWeight="Bold"
+                                                 FontFamily="{StaticResource SCDream5}"
+                                                 Style="{StaticResource MaterialDesignChoiceChipListBox}"
+                                                 ItemContainerStyle="{StaticResource TransparentListBoxItemStyle}"
+                                                 Background="Transparent">
+
+                                            <ListBox.ItemTemplate>
+                                                <DataTemplate>
+                                                    <ToggleButton Content="{Binding Key}"
+                                                                    Focusable="False"
+                                                                    IsChecked="{Binding IsSelected,
+                                                                                RelativeSource={RelativeSource AncestorType=ListBoxItem}}"
+                                                                    Style="{StaticResource SquareCheckToggleButtonStyle}"
+                                                                    Margin="0 0 20 0"/>
+                                                </DataTemplate>
+                                            </ListBox.ItemTemplate>
+
+                                        </ListBox>
+                                    </Grid>
 
-                                    <Grid Margin="15 0">
+                                    <Grid Margin="24 0">
                                         <Grid.Resources>
                                             <Style TargetType="FrameworkElement">
                                                 <Setter Property="Visibility" Value="Collapsed"/>
@@ -670,17 +678,17 @@
                                         <StackPanel Style="{StaticResource VisibleWhenLine}">
                                             <Grid Style="{StaticResource VisibleWhenLine}">
                                                 <Grid.ColumnDefinitions>
-                                                    <ColumnDefinition Width="80"/>
+                                                    <ColumnDefinition Width="110"/>
                                                     <ColumnDefinition/>
                                                 </Grid.ColumnDefinitions>
                                                 <TextBlock Text="Y축" VerticalAlignment="Center" Style="{StaticResource VisibleWhenLine}"
-                                                           FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
+                                                           FontSize="18" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
                                                 <ComboBox ItemsSource="{Binding YFieldCandidates}"
                                                           SelectedItem="{Binding SelectedYField, Mode=TwoWay}"
                                                           Grid.Column="1"
                                                           FontFamily="{StaticResource SCDream3}"
                                                           DisplayMemberPath="Display" Margin="15 0 0 0"
-                                                          Height="40" Style="{StaticResource ComboBoxStyle}"/>
+                                                          Height="35" Style="{StaticResource ComboBoxStyle}"/>
                                             </Grid>
                                         </StackPanel>
 
@@ -688,16 +696,16 @@
                                         <StackPanel Style="{StaticResource VisibleWhenStep}">
                                             <Grid Margin="0 5 0 10">
                                                 <Grid.ColumnDefinitions>
-                                                    <ColumnDefinition Width="100"/>
+                                                    <ColumnDefinition Width="110"/>
                                                     <ColumnDefinition/>
                                                 </Grid.ColumnDefinitions>
                                                 <TextBlock Text="필드 종류" VerticalAlignment="Center"
-                                                           FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
-                                                <StackPanel Orientation="Horizontal" Grid.Column="1" HorizontalAlignment="Center">
+                                                           FontSize="18" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
+                                                <StackPanel Orientation="Horizontal" Grid.Column="1" HorizontalAlignment="Left" Margin="15 0">
                                                     <RadioButton x:Name="rbStatus" Content="전원/상태" 
                                                                  FontFamily="{StaticResource SCDream3}"
                                                                  GroupName="strpPlot" Margin="0 0 30 0"
-                                                                 Foreground="White" FontSize="20"
+                                                                 Foreground="White" FontSize="16"
                                                                  Style="{StaticResource MaterialDesignUserForegroundRadioButton}"
                                                                  IsChecked="{Binding SelectedKind, Mode=TwoWay,
                                                                                      Converter={StaticResource EnumEqualsConverter},
@@ -705,7 +713,7 @@
                                                     <RadioButton x:Name="rbValue" Content="센서 값" 
                                                                  FontFamily="{StaticResource SCDream3}"
                                                                  GroupName="strpPlot" Grid.Column="1" 
-                                                                 Foreground="White" FontSize="20"
+                                                                 Foreground="White" FontSize="16"
                                                                  Style="{StaticResource MaterialDesignUserForegroundRadioButton}"
                                                                  IsChecked="{Binding SelectedKind, Mode=TwoWay,
                                                                                      Converter={StaticResource EnumEqualsConverter},
@@ -713,21 +721,40 @@
                                                 </StackPanel>
                                             </Grid>
 
-                                            <StackPanel Margin="0 5 0 0">
-                                                <TextBlock Text="Y축 (복수 선택)" VerticalAlignment="Center" 
-                                                           FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
+                                            <Grid Margin="0 5 0 0">
+                                                <Grid.ColumnDefinitions>
+                                                    <ColumnDefinition Width="110"/>
+                                                    <ColumnDefinition/>
+                                                </Grid.ColumnDefinitions>
+                                                <TextBlock VerticalAlignment="Top" Foreground="White">
+                                                    <Run Text="Y축" FontSize="18" FontFamily="{StaticResource SCDream4}"/>
+                                                    <LineBreak/>
+                                                    <Run Text="(복수 선택 가능)" FontSize="14" Foreground="#767676"/>
+                                                </TextBlock>
                                                 <!-- SelectedItems 바인딩을 위한 간단 Behavior는 아래 3) 참고 -->
-                                                <Border CornerRadius="10" Background="White" Margin="0 5">
+                                                <Border CornerRadius="10"
+                                                        Margin="15 0 0 0" Grid.Column="1">
                                                     <ListBox ItemsSource="{Binding YFieldCandidates}"
-                                                             DisplayMemberPath="Display"
                                                              SelectionMode="Extended"
                                                              helper:MultiSelectBehavior.SelectedItems="{Binding SelectedYFields, Mode=OneWay}"
                                                              Height="Auto" Background="White"
                                                              FontSize="14" FontWeight="Bold"
                                                              FontFamily="{StaticResource SCDream5}"
-                                                             Style="{StaticResource MaterialDesignFilterChipListBox}"/>
+                                                             Style="{StaticResource MaterialDesignFilterChipListBox}"
+                                                             ItemContainerStyle="{StaticResource ListBoxItemStyle}">
+                                                        <ListBox.ItemTemplate>
+                                                            <DataTemplate>
+                                                                <ToggleButton Content="{Binding Display}"
+                                                                              Focusable="False"
+                                                                              IsChecked="{Binding IsSelected,
+                                                                                          RelativeSource={RelativeSource AncestorType=ListBoxItem}}"
+                                                                              Style="{StaticResource CircleCheckToggleButtonStyle}"
+                                                                              Margin="12 0"/> 
+                                                            </DataTemplate>
+                                                        </ListBox.ItemTemplate>
+                                                    </ListBox>
                                                 </Border>
-                                            </StackPanel>
+                                            </Grid>
                                         </StackPanel>
 
                                         <!-- SCATTER: 단일 Y + 옵션 -->
@@ -741,7 +768,7 @@
                                                            FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
                                                 <ComboBox ItemsSource="{Binding YFieldCandidates}"
                                                           SelectedItem="{Binding SelectedYField}"
-                                                          DisplayMemberPath="Display" Height="40"
+                                                          DisplayMemberPath="Display" Height="35"
                                                           Grid.Column="1" Grid.ColumnSpan="3" Margin="15 0 0 0"
                                                           FontFamily="{StaticResource SCDream3}"
                                                           Style="{StaticResource ComboBoxStyle}"/>
@@ -792,7 +819,7 @@
                                                            FontSize="20" FontFamily="{StaticResource SCDream5}" Foreground="White"/>
                                                 <ComboBox ItemsSource="{Binding YFieldCandidates}"
                                                           SelectedItem="{Binding SelectedYField}"
-                                                          DisplayMemberPath="Display" Height="40"
+                                                          DisplayMemberPath="Display" Height="35"
                                                           Grid.Column="1" Margin="15 0 0 0"
                                                           FontFamily="{StaticResource SCDream3}"
                                                           Style="{StaticResource ComboBoxStyle}"/>
@@ -819,14 +846,18 @@
                                     </Grid>
                                 </StackPanel>
 
-                                <StackPanel Orientation="Horizontal" Grid.Row="1" Margin="15 0">
-                                    <CheckBox Content="범례 표시" IsChecked="{Binding ShowLegends}"
-                                              FontSize="20" FontFamily="{StaticResource SCDream4}" Foreground="White"
-                                              Margin="0 0 15 0" VerticalContentAlignment="Center"
+                                <StackPanel Orientation="Horizontal" Grid.Row="1">
+                                    <CheckBox IsChecked="{Binding ShowLegends}"
+                                              FontSize="16" FontFamily="{StaticResource SCDream4}" Foreground="#264A60"
+                                              Margin="24 0 4 0" VerticalContentAlignment="Center"
                                               Style="{StaticResource MaterialDesignUserForegroundCheckBox}"/>
-                                    <CheckBox Content="마커 표시" IsChecked="{Binding ShowMarkers}"
-                                              FontSize="20" FontFamily="{StaticResource SCDream4}" Foreground="White"
-                                              Margin="0 0 15 0" VerticalContentAlignment="Center">
+                                    <TextBlock Text="범례" VerticalAlignment="Center" Margin="0 0 12 0"
+                                               FontSize="16" FontFamily="{StaticResource SCDream3}"
+                                               Foreground="#999999" />
+                                    
+                                    <CheckBox IsChecked="{Binding ShowMarkers}"
+                                              FontSize="16" FontFamily="{StaticResource SCDream4}" Foreground="#264A60"
+                                              Margin="0 0 4 0" VerticalContentAlignment="Center">
                                         <CheckBox.Style>
                                             <Style TargetType="CheckBox" BasedOn="{StaticResource MaterialDesignUserForegroundCheckBox}">
                                                 <Setter Property="Visibility" Value="Collapsed"/>
@@ -841,9 +872,27 @@
                                             </Style>
                                         </CheckBox.Style>
                                     </CheckBox>
+                                    <TextBlock Text="마커" VerticalAlignment="Center" Margin="0 0 12 0"
+                                               FontSize="16" FontFamily="{StaticResource SCDream3}"
+                                               Foreground="#999999">
+                                        <TextBlock.Style>
+                                            <Style TargetType="TextBlock">
+                                                <Setter Property="Visibility" Value="Collapsed"/>
+                                                <Style.Triggers>
+                                                    <DataTrigger Binding="{Binding SelectedGraphType}" Value="LINE">
+                                                        <Setter Property="Visibility" Value="Visible"/>
+                                                    </DataTrigger>
+                                                    <DataTrigger Binding="{Binding SelectedGraphType}" Value="STEP">
+                                                        <Setter Property="Visibility" Value="Visible"/>
+                                                    </DataTrigger>
+                                                </Style.Triggers>
+                                            </Style>
+                                        </TextBlock.Style>
+                                    </TextBlock>
+
                                     <CheckBox Content="회귀선" IsChecked="{Binding ShowRegression}"
-                                              FontSize="20" FontFamily="{StaticResource SCDream4}" Foreground="White"
-                                              Margin="0 0 15 0" VerticalContentAlignment="Center">
+                                              FontSize="16" FontFamily="{StaticResource SCDream4}" Foreground="#264A60"
+                                              Margin="0 0 4 0" VerticalContentAlignment="Center">
                                         <CheckBox.Style>
                                             <Style TargetType="CheckBox" BasedOn="{StaticResource MaterialDesignUserForegroundCheckBox}">
                                                 <Setter Property="Visibility" Value="Collapsed"/>
@@ -855,20 +904,37 @@
                                             </Style>
                                         </CheckBox.Style>
                                     </CheckBox>
+                                    <TextBlock Text="회귀선" VerticalAlignment="Center" Margin="0 0 12 0"
+                                               FontSize="16" FontFamily="{StaticResource SCDream3}"
+                                               Foreground="#999999">
+                                        <TextBlock.Style>
+                                            <Style TargetType="TextBlock">
+                                                <Setter Property="Visibility" Value="Collapsed"/>
+                                                <Style.Triggers>
+                                                    <DataTrigger Binding="{Binding SelectedGraphType}" Value="SCATTER">
+                                                        <Setter Property="Visibility" Value="Visible"/>
+                                                    </DataTrigger>
+                                                </Style.Triggers>
+                                            </Style>
+                                        </TextBlock.Style>
+                                    </TextBlock>
                                 </StackPanel>
 
-                                <StackPanel Orientation="Horizontal" Margin="15 0" Grid.Row="1" HorizontalAlignment="Right">
-                                    <Button Content="그래프 생성" FontFamily="{StaticResource SCDream5}"
-                                            Style="{StaticResource MaterialDesignFlatLightBgButton}"
-                                            FontWeight="Bold" Command="{Binding DrawGraphCommand}"/>
-                                </StackPanel>
+                                <Button Content="그래프 생성" Grid.Row="1" HorizontalAlignment="Right"
+                                        FontFamily="{StaticResource SCDream3}"
+                                        Foreground="White" FontSize="16"
+                                        Background="#325C80" BorderBrush="Transparent"
+                                        Style="{StaticResource MaterialDesignFlatLightBgButton}"
+                                        Width="120" Height="38"
+                                        Margin="0 0 24 24" Padding="20 0"
+                                        Command="{Binding DrawGraphCommand}"/>
                             </Grid>
                         </Border>
 
-                        <Border Grid.Column="1" Margin="0 15 15 15"
-                                Background="#384659" CornerRadius="10">
+                        <Border Grid.Column="1" Margin="0 16 12 16" CornerRadius="5"
+                                Background="#152935" BorderBrush="#325C80" BorderThickness="1">
                             <control:GraphControl x:Name="graphControl"
-                                                  Margin="10" DataContext="{Binding GraphControlVM}"
+                                                  Margin="16 12" DataContext="{Binding GraphControlVM}"
                                                   HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
                         </Border>
                     </Grid>
diff --git a/SmartAquaViewer/ViewModel/GraphControlViewModel.cs b/SmartAquaViewer/ViewModel/GraphControlViewModel.cs
index 3e16899..ef0c08e 100644
--- a/SmartAquaViewer/ViewModel/GraphControlViewModel.cs
+++ b/SmartAquaViewer/ViewModel/GraphControlViewModel.cs
@@ -21,7 +21,21 @@ namespace SmartAquaViewer.ViewModel
 
         private void InitializeGraph()
         {
-            Model.TextColor = OxyColors.LightGray;
+            Model.TextColor = OxyColors.White;
+            Model.PlotAreaBorderColor = OxyColors.White;
+            Model.PlotAreaBorderThickness = new OxyThickness(1);
+            Model.Padding = new OxyThickness(0);
+        }
+
+        private void ApplyCommonAxisSettings(Axis axis, string title, AxisPosition position)
+        {
+            axis.Position = position;
+            axis.Title = title;
+            axis.TitleFontSize = 14;
+            axis.FontSize = 12;
+            axis.MajorGridlineStyle = LineStyle.Solid;
+            axis.MajorGridlineColor = OxyColor.Parse("#767676");
+            axis.TickStyle = TickStyle.None;
         }
 
         public void SetTankLineGraph(
@@ -35,30 +49,26 @@ namespace SmartAquaViewer.ViewModel
 
             bool xIsTime = string.Equals(xField!.Name, "RecordedTime", StringComparison.OrdinalIgnoreCase);
 
-            Axis xAxis = xIsTime
-                ? new DateTimeAxis
+            Axis xAxis;
+
+            if (xIsTime)
+            {
+                xAxis = new DateTimeAxis
                 {
-                    Position = AxisPosition.Bottom,
-                    Title = xField.Display,
                     StringFormat = "HH:mm:ss",
-                    IntervalType = DateTimeIntervalType.Minutes,
-                    MajorGridlineStyle = LineStyle.Solid,
-                    MinorGridlineStyle = LineStyle.Dot,
-                }
-                : new LinearAxis
-                {
-                    Position = AxisPosition.Bottom,
-                    Title = xField.Display,
-                    MajorGridlineStyle = LineStyle.Solid,
-                    MinorGridlineStyle = LineStyle.Dot
+                    IntervalType = DateTimeIntervalType.Minutes
                 };
-            var yAxis = new LinearAxis
+            }
+            else
             {
-                Position = AxisPosition.Left,
-                Title = yField!.Display,
-                MajorGridlineStyle = LineStyle.Solid,
-                MinorGridlineStyle = LineStyle.Dot
-            };
+                xAxis = new LinearAxis();
+            }
+
+            ApplyCommonAxisSettings(xAxis, xField.Display, AxisPosition.Bottom);
+
+            var yAxis = new LinearAxis();
+            ApplyCommonAxisSettings(yAxis, yField!.Display, AxisPosition.Left);
+            yAxis.AxisTitleDistance = 10;
 
             Model.Axes.Add(xAxis);
             Model.Axes.Add(yAxis);
diff --git a/SmartAquaViewer/ViewModel/MonitoringViewModel.cs b/SmartAquaViewer/ViewModel/MonitoringViewModel.cs
index 53fdbdf..50bab53 100644
--- a/SmartAquaViewer/ViewModel/MonitoringViewModel.cs
+++ b/SmartAquaViewer/ViewModel/MonitoringViewModel.cs
@@ -19,6 +19,8 @@ namespace SmartAquaViewer.ViewModel
         public string? Display { get; init; } // UI 표시명 (예: "DO (mg/L)")
         public Type? DataType { get; init; }  // typeof(double), typeof(DateTime) 등
         public StepFieldKind Kind { get; init; }
+
+        public override string? ToString() => Display;
     }
 
     /// <summary>