c# - transferencia - Trazando el mapa de calor 2D

resuelva la ecuacion de calor

Question

Tengo un cuadro en el que quiero trazar un mapa de calor; los únicos datos que tengo son humedad y temperatura, que representan un punto en el gráfico.

¿Cómo obtengo el tipo rectangular de mapa de calor en la tabla en c #?

Lo que quiero es similar a la imagen a continuación:

Lo que realmente quiero es una región rectangular en el gráfico que se traza en diferentes colores en función del punto que obtengo de la lista de puntos y formar la colorida sección del gráfico.

Answer 1

Puede elegir al menos tres formas de crear un gráfico con rectángulos coloreados que conforman un mapa de calor.

Aquí hay un ejemplo que usa / abusa de DataGridView . Si bien no lo sugeriría, la publicación contiene una función útil que crea listas de colores agradables para usar en su tarea.

Luego está la opción de dibujar el gráfico utilizando los métodos GDI +, a saber, Graphics.FillRectangle . Esto no es nada difícil, pero una vez que quiera obtener esos buenos extras que ofrece un control Chart, como escalar, ejes, información sobre herramientas, etc., la obra se suma ... ¡Vea a continuación!

Así que echemos un vistazo a la opción tres: Usar el control Chart desde el espacio de nombres DataVisualization .

Supongamos primero que ha creado una lista de colores:

List<Color> colorList = new List<Color>();

Y que ha logrado proyectar sus datos en una matriz 2D de índices int que apuntan a la lista de colores:

int[,] coloredData = null;

A continuación tienes que elegir un ChartType para tu Series S1 Realmente solo hay uno que pueda ayudarte:

S1.ChartType = SeriesChartType.Point;

Los puntos se muestran por Markers . Queremos que los DataPoints no se muestren realmente como uno de los MarkerTypes estándar.

Square estaría bien, si quisiéramos mostrar cuadrados; pero para los rectángulos no funcionará bien: incluso si los dejamos superponer, todavía habrá puntos en los bordes que tienen un tamaño diferente porque no se superponen por completo.

Así que usamos un marcador personalizado al establecer MarkerImage de cada punto en un mapa de bits de un tamaño y color adecuados.

Aquí hay un bucle que agrega los DataPoints a nuestra Series y establece que cada uno tenga una MarkerImage :

for (int x = 1; x < coloredData.GetLength(0); x++)
    for (int y = 1; y < coloredData.GetLength(1); y++)
    {
        int pt = S1.Points.AddXY(x, y);
        S1.Points[pt].MarkerImage = "NI" +  coloredData[x,y];

    }

Esto requiere algunas explicaciones: para establecer un MarkerImage que no está en una ruta en el disco, debe residir en la colección de Chart''s Images . Esto significa que debe ser de tipo NamedImage . Cualquier imagen servirá, pero debe tener una cadena de nombre única para identificarla en NamedImagesCollection . Elegí los nombres para ser ''NI1'', ''NI2'' ...

Obviamente necesitamos crear todas esas imágenes; aquí hay una función para hacer eso:

void createMarkers(Chart chart, int count)
{
    // rough calculation:
    int sw = chart.ClientSize.Width / coloredData.GetLength(0);
    int sh = chart.ClientSize.Height / coloredData.GetLength(1);

    // clean up previous images:
    foreach(NamedImage ni in chart1.Images) ni.Dispose();
    chart.Images.Clear();

    // now create count images:
    for (int i = 0; i < count; i++)
    {
        Bitmap bmp = new Bitmap(sw, sh);
        using (Graphics G = Graphics.FromImage(bmp))
            G.Clear(colorList[i]);
        chart.Images.Add(new NamedImage("NI" + i, bmp));
    }
}

Queremos que todos los marcadores tengan al menos aproximadamente el tamaño correcto; así que, cuando el tamaño cambie, lo configuramos nuevamente:

void setMarkerSize(Chart chart)
{
    int sx = chart1.ClientSize.Width / coloredData.GetLength(0);
    int sy = chart1.ClientSize.Height / coloredData.GetLength(1);
    chart1.Series["S1"].MarkerSize = (int)Math.Max(sx, sy);
}

A esto no le importan demasiado los detalles como InnerPlotPosition , es decir, el área real a dibujar; así que aquí hay un espacio para el refinamiento ...!

Llamamos esto cuando configuramos el gráfico, pero también al cambiar el tamaño :

private void chart1_Resize(object sender, EventArgs e)
{
    setMarkerSize(chart1);
    createMarkers(chart1, 100);
}

Echemos un vistazo al resultado usando algunos testdata baratos:

Como puede ver, el cambio de tamaño funciona bien ...

Aquí está el código completo que configuró mi ejemplo:

private void button6_Click(object sender, EventArgs e)
{
    List<Color> stopColors = new List<Color>()
    { Color.Blue, Color.Cyan, Color.YellowGreen, Color.Orange, Color.Red };
    colorList = interpolateColors(stopColors, 100);

    coloredData = getCData(32, 24);
    // basic setup..
    chart1.ChartAreas.Clear();
    ChartArea CA = chart1.ChartAreas.Add("CA");
    chart1.Series.Clear();
    Series S1 = chart1.Series.Add("S1");
    chart1.Legends.Clear();
    // we choose a charttype that lets us add points freely:
    S1.ChartType = SeriesChartType.Point;

    Size sz = chart1.ClientSize;

    // we need to make the markers large enough to fill the area completely:
    setMarkerSize(chart1);
    createMarkers(chart1, 100);

    // now we fill in the datapoints
    for (int x = 1; x < coloredData.GetLength(0); x++)
        for (int y = 1; y < coloredData.GetLength(1); y++)
        {
            int pt = S1.Points.AddXY(x, y);
            //  S1.Points[pt].Color = coloredData[x, y];

            S1.Points[pt].MarkerImage = "NI" +  coloredData[x,y];
        }
}

Algunas notas sobre limitaciones:

• El punto siempre se ubicará en la parte superior de cualquier cuadrícula. Si realmente los necesita, tendrá que dibujarlos en la parte superior de uno de los eventos de Paint .

• Las etiquetas que se muestran se refieren a los índices enteros de la matriz de datos. Si desea mostrar los datos originales, una forma sería agregar CustomLabels a los ejes. ¡Vea aquí para ver un ejemplo !

Esto debería darle una idea de lo que puede hacer con un control Chart ; para completar su confusión aquí, es cómo dibujar esos rectángulos en GDI + utilizando los mismos colores y datos:

Bitmap getChartImg(float[,] data, Size sz, Padding pad) 
{
    Bitmap bmp = new Bitmap(sz.Width , sz.Height);
    using (Graphics G = Graphics.FromImage(bmp))
    {
        float w = 1f * (sz.Width - pad.Left - pad.Right) / coloredData.GetLength(0);
        float h = 1f * (sz.Height - pad.Top - pad.Bottom) / coloredData.GetLength(1);
        for (int x = 0; x < coloredData.GetLength(0); x++)
            for (int y = 0; y < coloredData.GetLength(1); y++)
            {
                using (SolidBrush brush = new SolidBrush(colorList[coloredData[x,y]]))
                    G.FillRectangle(brush, pad.Left + x * w, y * h - pad.Bottom, w, h);
            }

    }
    return bmp;
}

El mapa de bits resultante parece familiar:

Eso fue simple; pero agregar todos los extras en el espacio reservado por el relleno no será tan fácil ...