Cómo renderizar texto en .NET en el mismo tamaño que los navegadores proporciona CSS para el texto

Question

Estoy intentando crear una función " guardar página web como mapa de bits " en un sitio web y tengo algunos problemas para representar el texto en el tamaño correcto en el lado del servidor.

La configuración de tamaño de fuente para el texto en el cliente es:

.textDiv
{
    font-family: Verdana;
    font-size:16px;
}

Si intento representar esto en el servidor con

float emSize = 16;
g.DrawString("mytext", new Font("Verdana", emSize), Brushes.Black, x, y);

El texto será aproximadamente un 20% más grande en el servidor.

La documentación para la nueva Fuente () dice que el segundo argumento (el tamaño de fuente) debe especificarse en puntos em. ¿Qué es exactamente un punto em?

Si especifico el tamaño de fuente: 16em en el navegador, el texto se vuelve ENORME. Si especifico el tamaño de fuente: 1em en el navegador, el texto tendrá alrededor de 14 píxeles de tamaño, pero si pongo 1 como argumento en el servidor, el texto se convierte en una línea delgada.

Entonces, ¿cómo puedo convertir del navegador px o em a .net px / em.

Answer 1

En realidad, los documentos dicen " em-size " ;, no " em-point " (" El tamaño de em, en puntos, de la nueva fuente "). Le pide que especifique el tamaño en puntos. Hay 72 puntos por pulgada. Debe calcular el DPI de la pantalla del usuario y el DPI del lienzo en el que está dibujando y multiplicar el tamaño de 16 píxeles por la diferencia en esa relación.

por ejemplo

(CSS_Font_Size_Pixels * Canvas_DPI) / (User_Screen_DPI * 72) = Equivalent_Point_Size

Puede ahorrarse una operación matemática utilizando la sobrecarga del constructor de fuentes que toma una unidad gráfica y especifica píxeles. De esta manera, el tamaño apropiado sería:

(CSS_Font_Size_Pixels  / User_Screen_DPI) * Canvas_DPI

Answer 2

Estoy un poco confundido porque estás usando dos unidades de medida diferentes en tu pregunta. Trataré de explicar ambos:

PX

Esta es la altura en píxeles. Esto debería ser tan fácil como configurar la Fuente:

new Font("Verdana", 16F);

EM

Esto será mucho más difícil de controlar, porque es un múltiplo de la altura de su línea. Por ejemplo, si 1em = 14px, entonces 16em = (14 * 16) px. Será difícil de replicar a menos que conozca la altura de su línea.

También el documento dice lo siguiente

  

El tamaño de em, en puntos, de la nueva fuente.

Por lo tanto, se define en PX o píxeles para el constructor que está utilizando. Podría probar este constructor, pero EM es realmente una implementación de navegador / CSS que se ajusta dinámicamente de acuerdo con la pantalla, casi como vectores. Donde el objeto Font es un mapa de bits que trabaja la cantidad de píxeles para dibujar.

http://msdn.microsoft.com/en-us/library /ms141986.aspx