I’m attempting to export a heatmap to .png using the SciChartSurface.ExportToFile() method. The problem is the corresponding HeatmapColorMap is not included in this exported image.
Is there a way to render the image and include the HeatmapColorMap as an overlay?
- Chris Favaro asked 6 years ago
- You must login to post comments
Only if the HeatmapColorMap is a child of the SciChartSurface.
You can do this by hosting it inside a BoxAnnotation.
Try this code:
<Window x:Class="WpfApp23.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:local="clr-namespace:WpfApp23"
xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.Resources>
<s:GradientStopsToLinearGradientBrushConverter x:Key="ColorsToLinearGradientBrushConverter"/>
</Grid.Resources>
<s:SciChartSurface x:Name="sciChart">
<s:SciChartSurface.RenderableSeries>
<s:FastUniformHeatmapRenderableSeries x:Name="heatmapSeries" Opacity="0.9">
<s:FastUniformHeatmapRenderableSeries.ColorMap>
<s:HeatmapColorPalette Maximum="200">
<s:HeatmapColorPalette.GradientStops>
<GradientStop Offset="0" Color="DarkBlue" />
<GradientStop Offset="0.2" Color="CornflowerBlue" />
<GradientStop Offset="0.4" Color="DarkGreen" />
<GradientStop Offset="0.6" Color="Chartreuse" />
<GradientStop Offset="0.8" Color="Yellow" />
<GradientStop Offset="1" Color="Red" />
</s:HeatmapColorPalette.GradientStops>
</s:HeatmapColorPalette>
</s:FastUniformHeatmapRenderableSeries.ColorMap>
</s:FastUniformHeatmapRenderableSeries>
</s:SciChartSurface.RenderableSeries>
<s:SciChartSurface.XAxis>
<s:NumericAxis DrawMajorBands="True" />
</s:SciChartSurface.XAxis>
<s:SciChartSurface.YAxis>
<s:NumericAxis DrawMajorBands="True" />
</s:SciChartSurface.YAxis>
<s:SciChartSurface.Annotations>
<s:BoxAnnotation X1="0" X2="1" Y1="0" Y2="1" CoordinateMode="Relative" Background="Transparent">
<s:BoxAnnotation.Template>
<ControlTemplate>
<Border x:Name="PART_BoxAnnotationRoot"
Margin="{TemplateBinding Margin}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<s:HeatmapColorMap
HorizontalAlignment="Right"
VerticalAlignment="Stretch"
Background="{Binding ElementName=sciChart, Path=Background}"
Foreground="{Binding ElementName=sciChart, Path=Foreground}"
ColorMap="{Binding ElementName=heatmapSeries, Path=ColorMap.GradientStops, Converter={StaticResource ColorsToLinearGradientBrushConverter}}"
Minimum="{Binding ElementName=heatmapSeries, Path=ColorMap.Minimum, Mode=TwoWay}"
Maximum="{Binding ElementName=heatmapSeries, Path=ColorMap.Maximum, Mode=TwoWay}"
TextFormatting="0.00"
Opacity="0.8"
BorderBrush="#777"
BorderThickness="1"
Orientation="Vertical" />
</Border>
</ControlTemplate>
</s:BoxAnnotation.Template>
</s:BoxAnnotation>
</s:SciChartSurface.Annotations>
</s:SciChartSurface>
<Button Margin="40" Content="Export me!" Click="OnExportClick" HorizontalAlignment="Left" VerticalAlignment="Top"/>
</Grid>
</Window>
Code behind
using System;
using System.Diagnostics;
using System.Windows;
using SciChart.Charting.Model.DataSeries;
using SciChart.Charting.Model.DataSeries.Heatmap2DArrayDataSeries;
using SciChart.Core;
namespace WpfApp23
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
heatmapSeries.DataSeries = CreateSeries(0, 300, 200, 0, 100);
}
private IDataSeries CreateSeries(int index, int width, int height, double cpMin, double cpMax)
{
var random = new Random(Environment.TickCount << index);
double angle = Math.PI * 2 * index / 30;
int w = width, h = height;
var data = new double[h, w];
for (int x = 0; x < w; x++)
for (int y = 0; y < h; y++)
{
var v = (1 + Math.Sin(x * 0.04 + angle)) * 50 + (1 + Math.Sin(y * 0.1 + angle)) * 50 * (1 + Math.Sin(angle * 2));
var cx = w / 2; var cy = h / 2;
var r = Math.Sqrt((x - cx) * (x - cx) + (y - cy) * (y - cy));
var exp = Math.Max(0, 1 - r * 0.008);
var zValue = (v * exp + random.NextDouble() * 50);
data[y, x] = (zValue > cpMax) ? cpMax : zValue;
}
return new UniformHeatmapDataSeries<int, int, double>(data, 0, 1, 0, 1);
}
private void OnExportClick(object sender, RoutedEventArgs e)
{
sciChart.ExportToFile("C:/dev/test.png", ExportType.Png, false);
Process.Start("C:/dev/test.png");
}
}
}
This is tested as working in SciChart WPF v5.1
Best regards,
Andrew
- Andrew Burnett-Thompson answered 6 years ago
-
Wonderful! This is exactly what I was looking for. Thank you.
-
Using BoxAnnotation will only help in drawing HeaMapColorMap within plotting area. I do not want to obstruct the plot area. I want to have this ColoMap outside of plot area, next to Y-Axis. Any ideas how to implement it?
-
@Ammar Anwar Khan, i can suggest you to use WPF RenderTargetBitmap on a parent container for both SciChartSurface and HeatmapColorMap. I believe that should be Grid, and then save it to file. http://ericsink.com/wpf3d/3_Bitmap.html
- You must login to post comments
Please login first to submit.