Real size WPF controls for printing

e.Graphics.PageUnit = GraphicsUnit.Millimeter;
e.Graphics.PageScale = 3f;
e.Graphics.DrawImage(pictureBox1.Image, new Rectangle(0, 0, 50, 50));

const pageSizes = {
   a4 : {
      portrait : {
          inch : {
             width : 8.27,
             height : 11.69,
          },
          mm : {
             width : 210,
             height : 297,
          }
      },
      landscape : {
          inch : {
             height : 8.27,
             width : 11.69,
          },
          mm : {
             width : 297,
             height : 210,
          }
      },
}

const DPI = 300;  // need to have a selected dots per unit in this case inches
const units = "inch";
const pageLayout = "portrait";
const printOn = "a4";
// incase you are using mm you need to convert
const sizeWidth = 2;  // canvas intended print size in units = "inch"
const sizeHeight = 2;
var canvas = document.createElement("canvas");
canvas.width = DPI * sizeWidth;
canvas.height = DPI * sizeHeigth;

canvas.style.width = ((sizeWidth / pageSizes[printOn][pageLayout][unit].width) * 100) + "%";

canvas.style.height = Math.round((sizeHeight / pageSizes[printOn][pageLayout][unit].width) * innerWidth) + "px";

document.body.appendChild(canvas);

 const border = { // in inches
     top : 0.4,
     bottom : 0.4,
     left : 0.4,
     right : 0.4,
 }

canvas.style.width = ((sizeWidth / (pageSizes.a4.portrait.width - border.left - border.right) * 100) + "%";

canvas.style.height = Math.round((sizeHeight / (pageSizes.a4.portrait.width  - border.left - border.right)) * innerWidth * (1 - (border.left - border.right) / pageSizes.a4.portrait.width)  ) + "px";