Тепловая карта¶

Контрол Heatmap (Eremex.AvaloniaUI.Charts.Heatmap) позволяет вам создать двумерную heat map, диаграмму, которая визуализирует данные с использованием цвета. Контрол рисует каждую точку данных на 2D-"карте" цветом, соответствующим значению в этой точке.

Контрол Heatmap является потомком Eremex.AvaloniaUI.Charts.ChartControl, который является базовым классом для всех контролов диаграмм, включая CartersianChart и PolarChart. Таким образом, он наследует специфическую функциональность, общую для всех контролов диаграммы. Функции контрола тепловой карты включают в себя:

Пользовательская цветовая кодировка
Раскрашивание в оттенках серого
Настройка осей X и Y
Перекрестие
Полосы и постоянные линии
Прокрутка и масштабирование с помощью мыши и клавиатуры
Экспортируйте результат раскрашивания данных в растровое изображение

heatmap-control

Демонстрационное приложение¶

Смотрите демонстрационное приложение контролов Eremex для получения примеров, демонстрирующих функции контрола Heatmap в действии.

Начало работы с контролом тепловой карты¶

Чтобы настроить контрол тепловой карты, предоставьте данные контролу и укажите поставщика цвета , который окрашивает значения точек данных в соответствии с определенной логикой. Вы также можете настроить оси для отображения значений осей и, например, постоянных линий.

Обратите внимание, что оси X и Y в контроле тепловой карты являются качественными. Аргументы этих осей имеют тип string. Значения точек данных на "карте" имеют двойной тип.

Предоставьте данные¶

Установите для свойства Heatmap.DataAdapter значение объекта Eremex.AvaloniaUI.Charts.HeatmapDataAdapter, чтобы предоставить данные в контрол тепловой карты. Класс HeatmapDataAdapter содержит следующие основные свойства, которые необходимо инициализировать:

public class HeatmapDataAdapter : ISeriesDataAdapter
{
    public IList<string> XArguments;
    public IList<string> YArguments;
    public double[,] Values;
    //...
}

XArguments — Список строк, которые задают аргументы оси X. Аргументы X должны быть уникальными.
YArguments — Список строк, которые задают аргументы оси Y. Аргументы Y должны быть уникальными.
Values — двумерный массив значений типа Double.

Ширина и высота массива Values должны соответствовать количеству элементов в списках XArguments и YArguments соответственно.

Массив Values может содержать значение Double.NaN для определенных точек. Эти точки не отображаются контролом тепловой карты, и пользователь может видеть фон контрола через эти точки.

Строки массива Values отображаются контролом Heatmap снизу вверх. Первая строка массива Values отображается внизу, а последняя строка - вверху. Подробности смотрите в примере ниже.

Используйте следующие методы для обновления данных для контрола тепловой карты во время выполнения программы:

HeatmapDataAdapter.UpdateValues(double[,] newValues) — Обновляет текущие значения (HeatmapDataAdapter.Values) значениями, указанными параметром newValues метода. Количество столбцов и строк в массиве newValues должно совпадать с количеством в массиве HeatmapDataAdapter.Values.
HeatmapDataAdapter.UpdateXArguments(IList<string> newArguments) — Обновляет текущие аргументы X (HeatmapDataAdapter.XArguments) новыми аргументами. Количество элементов в списке newArguments должно совпадать с количеством элементов в списке HeatmapDataAdapter.XArguments. Аргументы X должны быть уникальными.
HeatmapDataAdapter.UpdateYArguments(IList<string> newArguments) — Обновляет текущие аргументы Y (HeatmapDataAdapter.YArguments) новыми аргументами. Количество элементов в списке newArguments должно совпадать с количеством элементов в списке HeatmapDataAdapter.YArguments. Аргументы Y должны быть уникальными.

Пример - Предоставьте данные и используйте дефолтная отрисовка¶

Следующий пример предоставляет выборочные данные для контрола тепловой карты. Данные представляют собой двумерный массив, состоящий из трех строк и пяти столбцов.

Поставщик цвета контрола по умолчанию (HeatmapGrayscaleColorProvider) отображает минимальное значение черным цветом, а максимальное - белым. Остальные значения окрашены в пропорциональные оттенки серого.

heatmap-grayscale-example

//Create an array that contains 3 rows with 5 values in each row
double[,] values = new double[,] 
{
    {1, 2, 3, 4, 5}, // values rendered at the bottom
    {6, 7, 8, 9, 10},
    {11, 12, 13, 14, 15}, // values rendered at the top
};
List<string> xArgs = new List<string>() { "A", "B", "C", "D", "E" };
List<string> yArgs = new List<string>() { "I", "II", "III" };

HeatmapDataAdapter dataAdapter = new HeatmapDataAdapter(xArgs, yArgs, values);
heatMap1.DataAdapter = dataAdapter;

Раскрашивание значений точек данных¶

Поставщики цветов используются для раскрашивания точек данных в контроле тепловой карты. Для каждой точки данных контрол запрашивает цвет для определенного значения у поставщика цвета (свойство Heatmap.ColorProvider).

Доступны следующие поставщики цветов:

HeatmapGrayscaleColorProvider (по умолчанию) — позволяет отображать значения в оттенках серого.
HeatmapRangeColorProvider — Позволяет окрашивать точки данных произвольным способом, связывая пользовательские цвета с определенными значениями.

При необходимости вы можете создать свой собственный поставщик цветов, реализовав интерфейс IHeatmapColorProvider.

Раскрашивание в оттенках серого¶

Контрол тепловой карты по умолчанию использует раскраску точек данных в оттенках серого. Раскраска в оттенках серого реализована HeatmapGrayscaleColorProvider. Чтобы использовать этот поставщик цветов, вы можете оставить свойство Heatmap.ColorProvider неназначенным или явно присвоить свойству Heatmap.ColorProvider значение объекта HeatmapGrayscaleColorProvider.

Объект HeatmapGrayscaleColorProvider отображает минимальное значение во всех точках данных черным цветом, а максимальное значение - белым. Другие значения, находящиеся между минимальным и максимальным значениями, отображаются пропорциональными оттенками серого.

Пример - Раскрашивание в оттенках серого¶

Следующий пример привязывает контрол тепловой карты к выборке данных и отображает точки данных с использованием поставщика цветов по умолчанию (HeatmapGrayscaleColorProvider). В коде также показано, как изменить заголовки осей.

heatmap-grayscale-gradient-spot-example

xmlns:mxc="https://schemas.eremexcontrols.net/avalonia/charts"

<mxc:Heatmap DataAdapter="{Binding DataAdapter}">
    <mxc:Heatmap.AxisX>
        <mxc:HeatmapAxisX Title="Parameter A">
        </mxc:HeatmapAxisX>
    </mxc:Heatmap.AxisX>
    <mxc:Heatmap.AxisY>
        <mxc:HeatmapAxisY Title="Parameter B">
        </mxc:HeatmapAxisY>
    </mxc:Heatmap.AxisY>
</mxc:Heatmap>

public partial class MainWindowViewModel : ViewModelBase
{
    [ObservableProperty]
    HeatmapDataAdapter dataAdapter;

    public MainWindowViewModel()
    {
        double[,] values = new double[,]
        {
            {148, 169, 185, 199, 213, 223, 228, 233}, // values rendered at the bottom
            {161, 182, 196, 207, 216, 222, 224, 223},
            {162, 181, 191, 198, 205, 208, 208, 205},
            {150, 163, 172, 177, 179, 177, 174, 168},
            {126, 132, 136, 142, 143, 140, 135, 127},
            {95, 97, 101, 105, 107, 104, 101, 98} // values rendered at the top
        };

        List<string> xArgs = new List<string>() { "1", "2", "3", "4", "5", "6", "7", "8" };
        List<string> yArgs = new List<string>() { "10", "20", "30", "40", "50", "60"};

        dataAdapter = new HeatmapDataAdapter(xArgs, yArgs, values);
    }
}

Пользовательская раскраска¶

Чтобы произвольным способом раскрасить точки данных в контроле тепловой карты, назначьте объект HeatmapRangeColorProvider свойству Heatmap.ColorProvider. HeatmapRangeColorProvider позволяет привязывать пользовательские цвета к определенным значениям (значениям перехода). Чтобы рассчитать цвета для значений, которые находятся между двумя значениями перехода, HeatmapRangeColorProvider использует градиент между цветами, назначенными этим значениям перехода.

При указании значений перехода вы можете указать абсолютные или нормализованные величины.

На следующей картинке показано, как HeatmapRangeColorProvider создает цветовые градиенты между образцами абсолютных значений перехода. В этом примере определены три значения перехода:

Значение 1 связано с бирюзовым цветом
Значение 6 связано с желтым цветом
Значение 10 связано с фиолетовым цветом

heatmap-transitionvalues-gradient

Пример - Пользовательская раскраска¶

В следующем примере используется HeatmapRangeColorProvider для раскрашивания точек данных контрола тепловой карты в соответствии с пользовательскими правилами цвета. Код определяет цвета для представления абсолютных значений перехода: 95, 110, 150, 210 и 233. Цвета для других значений рассчитываются в соответствии с градиентом между цветами, присвоенными соседним значениям перехода.

heatmap-customcolorization-example

xmlns:mxc="https://schemas.eremexcontrols.net/avalonia/charts"

<mxc:Heatmap DataAdapter="{Binding DataAdapter}" ColorProvider="{Binding ColorProvider}">
    <mxc:Heatmap.AxisX>
        <mxc:HeatmapAxisX Title="Parameter A">
        </mxc:HeatmapAxisX>
    </mxc:Heatmap.AxisX>
    <mxc:Heatmap.AxisY>
        <mxc:HeatmapAxisY Title="Parameter B">
        </mxc:HeatmapAxisY>
    </mxc:Heatmap.AxisY>
</mxc:Heatmap>

public partial class MainWindowViewModel : ViewModelBase
{
    [ObservableProperty]
    HeatmapDataAdapter dataAdapter;

    [ObservableProperty]
    HeatmapRangeColorProvider colorProvider = new HeatmapRangeColorProvider();

    public MainWindowViewModel()
    {
        HeatmapRangeStop[] colorRanges = new HeatmapRangeStop[]
        {
            new() { Value = 95, Color = Color.FromRgb(0,102,101) },
            new() { Value = 110, Color = Color.FromRgb(1,210,207) },
            new() { Value = 150, Color = Color.FromRgb(0,155,105)},
            new() { Value = 210, Color = Color.FromRgb(81,206,68)},
            new() { Value = 233, Color = Color.FromRgb(213,248,0) }
        };
        colorProvider.AddRange(colorRanges);

        double[,] values = new double[,]
        {
            {148, 169, 185, 199, 213, 223, 228, 233}, // values rendered at the bottom
            {161, 182, 196, 207, 216, 222, 224, 223},
            {162, 181, 191, 198, 205, 208, 208, 205},
            {150, 163, 172, 177, 179, 177, 174, 168},
            {126, 132, 136, 142, 143, 140, 135, 127},
            {95, 97, 101, 105, 107, 104, 101, 98}    // values rendered at the top
        };

        List<string> xArgs = new List<string>() { "1", "2", "3", "4", "5", "6", "7", "8" };
        List<string> yArgs = new List<string>() { "10", "20", "30", "40", "50", "60"};

        dataAdapter = new HeatmapDataAdapter(xArgs, yArgs, values);
    }
}

Цвета для значений, выходящих за пределы граничных значений перехода¶

Как правило, объект HeatmapRangeColorProvider должен включать цвета для минимальных и максимальных значений всего диапазона значений. Это гарантирует, что цветовые градиенты, построенные объектом HeatmapRangeColorProvider, охватывают все значения, переданные в контрол Heatmap. В противном случае значения за пределами значений граничного перехода окрашиваются в те же цвета, что и значения граничного перехода.

На следующей картинке показано, как HeatmapRangeColorProvider вычисляет цвета, когда определенные значения выходят за пределы минимального и максимального значений перехода.

heatmap-transitionvalues-beyond-gradient

Нормализованные значения перехода¶

Если вы не знаете минимальных и максимальных абсолютных значений для всего диапазона данных, вы можете указать значения перехода, используя нормализованные величины. Установите для свойства HeatmapRangeColorProvider.IsNormalizedValues значение true, чтобы включить нормализацию значений для объекта HeatmapRangeColorProvider. В этом режиме укажите значения перехода в диапазоне между 0 и 1, где 0 и 1 представляют собой минимальное и максимальное значения соответственно. Нормализованное значение 0.5 представляет собой абсолютное значение в середине диапазона данных (minimum + (maximum-minimum)/2).

Пример - Раскрасьте точки данных, если минимум и максимум заранее не известны¶

В следующем примере используется объект HeatmapRangeColorProvider для раскрашивания точек данных с использованием нормализованных значений перехода. Свойству HeatmapRangeColorProvider.IsNormalizedValues присвоено значение true, чтобы включить нормализацию значений. Значения перехода указаны в нормализованных величинах: 0, 0,3, 0,7 и 1, где значения 0 и 1 представляют собой минимальное и максимальное значения диапазона данных.

heatmap-normalizedvalues-example

double[,] values = new double[,]
{
    {-5, -4, -3, -2, -1, 0}, // values rendered at the bottom
    {1, 2, 3, 4, 5, 6}       // values rendered at the top
};

List<string> xArgs = new List<string>();

for (int i=1; i <= values.GetLength(1); i++)
{
    xArgs.Add((i*10).ToString());
}

List<string> yArgs = new List<string>() { "p1", "p2" };


HeatmapRangeColorProvider colorProvider = new HeatmapRangeColorProvider();
colorProvider.IsNormalizedValues = true;
HeatmapRangeStop[] colorRanges = new HeatmapRangeStop[]
{
    new() { Value = 0, Color = Colors.Pink },
    new() { Value = 0.3, Color = Colors.Purple},
    new() { Value = 0.7, Color = Colors.Orange },
    new() { Value = 1, Color = Colors.Green},
};
colorProvider.AddRange(colorRanges);

heatmap.ColorProvider = colorProvider;
heatmap.DataAdapter = new HeatmapDataAdapter(xArgs, yArgs, values);

Оси¶

Контрол тепловой карты содержит две оси, X и Y. Аргументы для этих осей предоставляются при вызове конструктора HeatmapDataAdapter с помощью параметров xArguments и yArguments.

double[,] values = new double[,] 
{
    {1, 2, 3, 4, 5}, // values rendered at the bottom
    {6, 7, 8, 9, 10},
    {11, 12, 13, 14, 15}, // values rendered at the top
};
List<string> xArgs = new List<string>() { "A", "B", "C", "D", "E" };
List<string> yArgs = new List<string>() { "I", "II", "III" };
//...
HeatmapDataAdapter dataAdapter = new HeatmapDataAdapter(xArgs, yArgs, values);
heatmap.DataAdapter = dataAdapter;

Оси контрола являются качественными, что означает, что их значения имеют строковый тип.
Количество элементов в списке yArguments должно соответствовать количеству строк в двумерном массиве данных (HeatmapDataAdapter.Values).
Количество элементов в списке xArguments должно соответствовать количеству столбцов в двумерном массиве данных (HeatmapDataAdapter.Values).

Вы можете настроить свойства axis, указав объекты Heatmap.AxisX и Heatmap.AxisY.

Следующий код задает названия для осей.

xmlns:mxc="https://schemas.eremexcontrols.net/avalonia/charts"

<mxc:Heatmap ...>
    <mxc:Heatmap.AxisX>
        <mxc:HeatmapAxisX Title="Axis X">
        </mxc:HeatmapAxisX>
    </mxc:Heatmap.AxisX>
    <mxc:Heatmap.AxisY>
        <mxc:HeatmapAxisY Title="Axis Y">
        </mxc:HeatmapAxisY>
    </mxc:Heatmap.AxisY>
</mxc:Heatmap>

Масштаб по оси¶

Вы можете использовать свойства AxisX.ScaleOptions и AxisY.ScaleOptions для настройки опций отображения оси. Эти свойства относятся к типу QualitativeScaleOptions.

В следующем примере опция масштабирования GridSpacing устанавливается равной 2, чтобы отображать каждую вторую метку и основную галочку и пропускать метки и галочки между ними.

heatmap-scale-gridspacing-example

<mxc:HeatmapAxisX >
    <mxc:HeatmapAxisX.ScaleOptions>
        <mxc:QualitativeScaleOptions GridSpacing="2" />
    </mxc:HeatmapAxisX.ScaleOptions>
</mxc:HeatmapAxisX>

Метки оси формата¶

Свойство ScaleOptions.LabelFormatter позволяет указать объект, который форматирует значения отображения оси произвольным способом. Вы можете реализовать пользовательский форматировщик меток на основе функции/выражения, используя объект Eremex.AvaloniaUI.Charts.FuncLabelFormatter.

В следующем примере реализован пользовательский форматировщик меток для значений оси.

heatmap-custom-label-formatter

<mxc:Heatmap Grid.Row="1" Name="heatmap">
    <mxc:Heatmap.AxisX>
        <mxc:HeatmapAxisX Title="Parameter A">
            <mxc:HeatmapAxisX.ScaleOptions>
                <mxc:QualitativeScaleOptions LabelFormatter="{Binding CustomLabelFormatter}" />
            </mxc:HeatmapAxisX.ScaleOptions>
        </mxc:HeatmapAxisX>
    </mxc:Heatmap.AxisX>
</mxc:Heatmap>

public partial class MainWindowViewModel : ViewModelBase
{
    // ...
    [ObservableProperty] FuncLabelFormatter customLabelFormatter = new(o => String.Format("val: {0}", o));
}

Свойства осей¶

В следующем списке обобщены свойства отображения и поведения осей контрола тепловой карты:

ConstantLines и ConstantLinesSource — Позволяет рисовать постоянные линии для определенных значений. Смотрите Постоянные линии и полоски .
EnableZooming — Позволяет пользователю изменять масштаб оси с помощью колесика мыши и клавиатуры.
EnableScrolling — Позволяет пользователю прокручивать ось с помощью операции перетаскивания мыши и горячих клавиш.
InterlacingColor - цвет, используемый для чередования полосовых линий (когда включена опция ShowInterlacing).
MinorCount — Указывает количество второстепенных отметок и линий сетки.
Position — Определяет позицию оси. Доступные опции включают: Near (ось X отображается внизу, а ось Y отображается у левого края диаграммы) и Far (ось X отображается вверху, а ось Y отображается у правого края диаграммы).
ShowAxisLine — Определяет видимость линии оси.
ShowInterlacing — Указывает, следует ли рисовать чередующиеся полосовые линии между основными линиями сетки. Смотрите ShowMajorGridlines для получения дополнительной информации.
ShowLabels — Определяет видимость меток, соответствующих основным отметкам.
ShowMajorGridlines — Определяет видимость линий сетки, соответствующих основным отметкам. Основные и второстепенные линии сетки отображаются за цветными точками данных. Линии сетки видны в следующих случаях:
- в позициях, где точки данных отображаются с использованием полупрозрачных цветов.
- в позициях, где точки данных не отображаются (например, когда значение точки данных равно Double.NaN).
ShowMajorTickmarks — Определяет видимость основных отметок.
ShowMinorGridlines — Определяет видимость линий сетки, соответствующих второстепенным отметкам. Смотрите ShowMajorGridlines для получения дополнительной информации.
ShowMinorTickmarks — Определяет видимость второстепенных меток.
ShowTitle — Определяет видимость заголовка оси (свойство Title).
Strips и StripsSource — позволяет заполнять диапазоны между определенными значениями. Смотрите Постоянные линии и полоски .
Thickness — Толщина линии оси.
Title — Возвращает или задает заголовок для оси.
TitlePosition — Получает или устанавливает позицию заголовка оси.

Перекрестие¶

Перекрестие - это пара тонких вертикальных и горизонтальных линий (линий аргументов и значений), которые позволяют пользователю видеть точные значения осей и точек данных в текущей позиции курсора. Перекрестие появляется при наведении курсора на область данных и следует за указателем мыши.

chart-crosshair-heatmap

Используйте свойство Heatmap.CrosshairOptions, чтобы настроить свойства отображения перекрестия или отключить эту функцию.

Отключите перекрестие¶

Свойство CrosshairOptions.ShowCrosshair позволяет отключить перекрестие.

<mxc:Heatmap x:Name="heatmap1" >
    <mxc:Heatmap.CrosshairOptions>
        <mxc:CrosshairOptions ShowCrosshair="False" />
    </mxc:Heatmap.CrosshairOptions>
    <!-- ... -->
</mxc:Heatmap>

Постоянные линии и полоски¶

Контрол тепловой карты позволяет использовать постоянные линии и полоски для обозначения определенных значений и диапазонов значений для горизонтальной и вертикальной осей.

Постоянные линии¶

Постоянная линия - это линия, проведенная перпендикулярно оси, которая отмечает определенное значение оси. Чтобы создать постоянные линии, используйте коллекцию ConstantLines или источник ConstantLinesSource объектов HeatmapAxisX и HeatmapAxisY.

В следующем примере создаются постоянные линии для осей X и Y, чтобы отметить значения осей "H" и "V" соответственно.

heatmap-constantline-example

<mxc:Heatmap Name="heatmap">
    <mxc:Heatmap.AxisX>
        <mxc:HeatmapAxisX Title="Parameter A">
            <mxc:HeatmapAxisX.ConstantLines>
                <mxc:ConstantLine AxisValue="H" ShowTitle="True" Title="Level H" Color="DimGray" ShowBehind="False" />
            </mxc:HeatmapAxisX.ConstantLines>
        </mxc:HeatmapAxisX>
    </mxc:Heatmap.AxisX>
    <mxc:Heatmap.AxisY>
        <mxc:HeatmapAxisY Title="Parameter X">
            <mxc:HeatmapAxisY.ConstantLines>
                <mxc:ConstantLine AxisValue="V" ShowTitle="True" Title="Level V" Color="DimGray" ShowBehind="False" />
            </mxc:HeatmapAxisY.ConstantLines>
        </mxc:HeatmapAxisY>
    </mxc:Heatmap.AxisY>            
</mxc:Heatmap>

Установите для опции ConstantLine.ShowBehind значение false, чтобы рисовать постоянные линии над цветными точками данных. В противном случае они отображаются за точками данных и видны в следующих случаях:

в позициях, где точки данных отображаются с использованием полупрозрачных цветов.
в позициях, где точки данных не отображаются (например, когда значение точки данных равно Double.NaN).

Полоски¶

Полоса - это продолжение постоянной линии. Полоски используются для выделения диапазонов значений осей. Они всегда отображаются за цветными точками данных.

Для создания полос используйте коллекцию Strips или исходный код StripsSource для объектов HeatmapAxisX и HeatmapAxisY.

<mxc:Heatmap.AxisY>
    <mxc:HeatmapAxisY Title="Parameter">
        <mxc:HeatmapAxisY.Strips>
            <mxc:Strip AxisValue1="W" AxisValue2="V" Color="Gray" />
        </mxc:HeatmapAxisY.Strips>
    </mxc:HeatmapAxisY>
</mxc:Heatmap.AxisY>

Полоски видны в следующих случаях:

в позициях, где точки данных отображаются с использованием полупрозрачных цветов.
в позициях, где точки данных не отображаются (например, когда значение точки данных равно Double.NaN).

Прокрутка и масштабирование¶

Разрешить операции прокрутки и масштабирования¶

Операции прокрутки и масштабирования включены по умолчанию. Следующие опции позволяют отключить эти операции для осей X и/или Y:

Axis.EnableZooming
Axis.EnableScrolling

<!-- Disable scroll and zoom operations for the X axis -->
<mxc:Heatmap.AxisX>
    <mxc:HeatmapAxisX EnableZooming="False" EnableScrolling="False"/>
</mxc:Heatmap.AxisX>
<!-- Disable scroll and zoom operations for the Y axis -->
<mxc:Heatmap.AxisY>
    <mxc:HeatmapAxisY EnableZooming="False" EnableScrolling="False"/>
</mxc:Heatmap.AxisY>

Прокрутка и масштабирование по пользователям¶

Прокрутите тепловую карту (по осям X и Y одновременно).¶

Перетащите область данных с помощью мыши

или
Нажмите Ctrl+клавиши со стрелками для прокрутки с помощью клавиатуры.

Увеличьте тепловую карту¶

Прокрутите колесико мыши по области данных

или
Нажмите Ctrl+"+", чтобы увеличить изображение, и Ctrl+"-", чтобы уменьшить масштаб.

heatmap-zoom-and-scroll

Прокрутка по оси X или Y¶

Перетащите курсор мыши в пределах соответствующей области оси.

Масштабирование по оси X или Y¶

Прокрутите колесико мыши в пределах соответствующей области оси.

heatmap-zoom-and-scroll-XY

Увеличение масштаба в определенном регионе¶

Нажмите и удерживайте клавишу SHIFT в области данных, а затем перетащите курсор, чтобы выделить нужный прямоугольник.

Увеличение диапазона значений на оси¶

Нажмите и удерживайте клавишу SHIFT в области оси, а затем перетащите курсор, чтобы выбрать нужный диапазон.

heatmap-zoom-into-rectangle

Экспорт¶

Вы можете использовать метод Heatmap.Export для экспорта рендеринга контрола в объект WriteableBitmap. Полученное растровое изображение содержит цветные точки данных. Размер растрового изображения соответствует размеру данных контрола тепловой карты, заданного массивом Heatmap.DataAdapter.Values.

В следующем примере рендеринг контрола тепловой карты сохраняется в файл картинки.

WriteableBitmap bitmap = heatmap.Export();
bitmap.Save("exported-heatmap.png");

^* Эта страница была создана автоматически с помощью сервиса машинного перевода Яндекс Переводчик.