design: 그래프 스타일링

prototype
HyungJune Kim 10 months ago
parent df682e6600
commit d0254a590e

@ -10,7 +10,8 @@
<Border>
<Grid>
<oxy:PlotView Name="pvChart" Model="{Binding Model}"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Padding="0"/>
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Padding="0"
Background="Transparent"/>
</Grid>
</Border>
</UserControl>

@ -6,7 +6,7 @@
xmlns:local="clr-namespace:SmartAquaViewer.View"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid Background="#243851">
<Grid Background="Transparent">
<ItemsControl ItemsSource="{Binding CCTVInfoList}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>

@ -14,7 +14,7 @@
<classes:InverseBoolConverter x:Key="InverseBoolConverter"/>
</UserControl.Resources>
<Grid Background="#243851">
<Grid Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="160"/>
<RowDefinition Height="350"/>

@ -14,7 +14,7 @@
<classes:InverseBoolConverter x:Key="InverseBoolConverter"/>
</UserControl.Resources>
<Grid Background="#243851">
<Grid Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="160"/>
<RowDefinition Height="350"/>

@ -18,17 +18,17 @@
</UserControl.Resources>
<Border>
<md:DrawerHost BottomDrawerBackground="#122136" IsBottomDrawerOpen="{Binding IsOpenMode}" OpenMode="Standard">
<Grid Background="#243851">
<md:DrawerHost BottomDrawerBackground="Transparent" IsBottomDrawerOpen="{Binding IsOpenMode}" OpenMode="Standard">
<Grid Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="70"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid>
<Grid.Background>
<!--<Grid.Background>
<ImageBrush ImageSource="/Resources/Images/top_bg.png" Stretch="Fill"/>
</Grid.Background>
<control:SegmentedControl x:Name="segmentedControl" Margin="20 10"
</Grid.Background>-->
<control:SegmentedControl x:Name="segmentedControl" Margin="15 10"
SelectedTab="{Binding SelectedTab, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
</Grid>
@ -36,7 +36,7 @@
Style="{StaticResource DataGridStyle}"
RowStyle="{StaticResource DataGridRowStyle}"
ColumnHeaderStyle="{StaticResource DataGridColumnHeaderStyle}"
Grid.Row="1" Margin="20 20 20 40"
Grid.Row="1" Margin="15 0 15 40"
ColumnWidth="*"
Background="Transparent"
HorizontalAlignment="Stretch">
@ -95,7 +95,7 @@
<DataGrid ItemsSource="{Binding WaterQualityList}" x:Name="dgFilter"
Style="{StaticResource DataGridStyle}" ColumnWidth="*"
Grid.Row="1" Margin="20 20 20 40"
Grid.Row="1" Margin="15 0 15 40"
Background="Transparent"
RowStyle="{StaticResource DataGridRowStyle}"
ColumnHeaderStyle="{StaticResource DataGridColumnHeaderStyle}">
@ -134,7 +134,7 @@
<DataGrid ItemsSource="{Binding WaterQualityList}" x:Name="dgSterilizer"
Style="{StaticResource DataGridStyle}" ColumnWidth="*"
Grid.Row="1" Margin="20 20 20 40"
Grid.Row="1" Margin="15 0 15 40"
Background="Transparent"
VerticalScrollBarVisibility="Auto"
RowStyle="{StaticResource DataGridRowStyle}"
@ -179,7 +179,7 @@
<ColumnDefinition Width="550"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Border Margin="20"
<Border Margin="15"
Background="#384659" BorderBrush="#404F63" BorderThickness="1" CornerRadius="10">
<Grid>
<Grid.RowDefinitions>
@ -332,41 +332,7 @@
</StackPanel>
</Grid>
<!--<Grid Margin="0 5 0 0">
<Grid.Style>
<Style TargetType="Grid">
<Setter Property="Visibility" Value="Collapsed"/>
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, ElementName=rbStatus}" Value="True">
<Setter Property="Visibility" Value="Visible"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Grid.Style>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="80"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock Text="Y축" VerticalAlignment="Center"
FontSize="20" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
<ComboBox ItemsSource="{Binding YFieldCandidates}"
SelectedItem="{Binding SelectedYField, Mode=TwoWay}"
Grid.Column="1"
DisplayMemberPath="Display" Margin="15 0 0 0"
Height="40" Style="{StaticResource ComboBoxStyle}"/>
</Grid>-->
<StackPanel Margin="0 5 0 0">
<!--<StackPanel.Style>
<Style TargetType="StackPanel">
<Setter Property="Visibility" Value="Collapsed"/>
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, ElementName=rbValue}" Value="True">
<Setter Property="Visibility" Value="Visible"/>
</DataTrigger>
</Style.Triggers>
</Style>
</StackPanel.Style>-->
<TextBlock Text="Y축 (복수 선택)" VerticalAlignment="Center"
FontSize="20" FontFamily="{StaticResource SCDream4}" Foreground="White"/>
<!-- SelectedItems 바인딩을 위한 간단 Behavior는 아래 3) 참고 -->
@ -514,8 +480,8 @@
</Grid>
</Border>
<Border Grid.Column="1" Margin="0 20 20 20"
Background="#384659" BorderBrush="#404F63" BorderThickness="1" CornerRadius="10">
<Border Grid.Column="1" Margin="0 15 15 15"
Background="#384659" CornerRadius="10">
<control:GraphControl x:Name="graphControl"
Margin="10" DataContext="{Binding GraphControlVM}"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>

@ -21,7 +21,7 @@ namespace SmartAquaViewer.ViewModel
private void InitializeGraph()
{
Model.TextColor = OxyColors.Black;
Model.TextColor = OxyColors.LightGray;
}
public void SetTankLineGraph(
@ -40,10 +40,10 @@ namespace SmartAquaViewer.ViewModel
{
Position = AxisPosition.Bottom,
Title = xField.Display,
StringFormat = "MM-dd\nHH:mm",
StringFormat = "HH:mm:ss",
IntervalType = DateTimeIntervalType.Minutes,
MajorGridlineStyle = LineStyle.Solid,
MinorGridlineStyle = LineStyle.Dot
MinorGridlineStyle = LineStyle.Dot,
}
: new LinearAxis
{
@ -126,7 +126,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = "수조",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);
}
@ -146,7 +145,7 @@ namespace SmartAquaViewer.ViewModel
StringFormat = "HH:mm:ss",
IntervalType = DateTimeIntervalType.Minutes,
MajorGridlineStyle = LineStyle.Solid,
MinorGridlineStyle = LineStyle.Dot
MinorGridlineStyle = LineStyle.Dot,
};
var yAxis = new LinearAxis
{
@ -193,7 +192,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = dataType == DataType.Energy ? "전력 소비량" : "온실가스 배출량",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);
@ -230,7 +228,7 @@ namespace SmartAquaViewer.ViewModel
var yAxis = new LinearAxis
{
Position = AxisPosition.Left,
Title = yField.Display,
Title = yField!.Display,
MajorGridlineStyle = LineStyle.Solid,
MinorGridlineStyle = LineStyle.Dot
};
@ -389,7 +387,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = "수조",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);
@ -419,7 +416,7 @@ namespace SmartAquaViewer.ViewModel
: new LinearAxis
{
Position = AxisPosition.Bottom,
Title = xAxisField.Display
Title = xAxisField.Display,
};
var yAxis = new LinearAxis
{
@ -523,18 +520,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = "수조",
TextColor = OxyColors.Black
});
Model.Legends.Clear();
Model.IsLegendVisible = showLegends;
Model.Legends.Add(new Legend
{
LegendPlacement = LegendPlacement.Outside,
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = "수조",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);
@ -623,34 +608,9 @@ namespace SmartAquaViewer.ViewModel
Model.Axes.Add(new LinearAxis
{
Position = AxisPosition.Left,
Title = "값"
Title = "값",
});
//var series = new StairStepSeries
//{
// MarkerType = showMarker ? MarkerType.Circle : MarkerType.None,
//};
//int i = 0;
//foreach (var r in collection.OrderBy(r => r.RecordedTime))
//{
// string? rawValue = ResolveStatus(r, yAxisField.Name);
// if (rawValue != null)
// {
// double y = MapDeviceStatus(rawValue);
// series.Points.Add(new DataPoint(i, y));
// }
// else
// {
// double? uvPower = ResolveUvPowerPerId(r, yAxisField.Name);
// if (uvPower.HasValue)
// {
// series.Points.Add(new DataPoint(i, uvPower.Value));
// }
// }
// i++;
//}
foreach (var field in yAxisFields)
{
var series = new StairStepSeries
@ -691,7 +651,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = "수조",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);
@ -778,7 +737,6 @@ namespace SmartAquaViewer.ViewModel
LegendPosition = LegendPosition.RightTop,
LegendOrientation = LegendOrientation.Vertical,
LegendTitle = dataType == DataType.Energy ? "전력 소비량" : "온실가스 배출량",
TextColor = OxyColors.Black
});
Model.InvalidatePlot(true);

@ -55,15 +55,15 @@ namespace SmartAquaViewer.ViewModel
SelectedViewModel = new MonitoringViewModel(); // Default view
//더미데이터 생성 및 파일로 저장
for (int i = 1; i <= 10; i++)
{
DateTime date = new(2025, 8, i);
var dataList = WaterQualityVO.GetSampleData(date, date, 24);
var jsonStr = JsonConvert.SerializeObject(dataList, Formatting.Indented);
//for (int i = 1; i <= 10; i++)
//{
// DateTime date = new(2025, 8, i);
// var dataList = WaterQualityVO.GetSampleData(date, date, 24);
// var jsonStr = JsonConvert.SerializeObject(dataList, Formatting.Indented);
string fileName = date.ToString("yyyy-MM-dd") + ".json";
File.WriteAllText(fileName, jsonStr);
}
// string fileName = date.ToString("yyyy-MM-dd") + ".json";
// File.WriteAllText(fileName, jsonStr);
//}
}
private void SwapView(object obj)

Loading…
Cancel
Save