I've got a web page that allows the user to create a canvas that can be as much as 50,000 pixels on a side (they're maps).

I draw everything on a canvas, scaled to the user's viewport. Unfortunately, you can't print a canvas; you have to convert it to an image and print that (at least, that's what I understand). I'd like to print something the size of the user's paper, but am at a loss to how to figure out that size, or even proportions so I can create a scaled view.

So, to print a map, I have to draw a new canvas, convert that to an image, and pop up a print window with that image as the sole contents. How do I set the dimensions of this new canvas to those of the printer? What are the dimensions of the printable area of a page for the user, and how can I create a window with those proportions?

Thanks for any thoughts.

Member Avatar for LastMitch

So, to print a map, I have to draw a new canvas, convert that to an image, and pop up a print window with that image as the sole contents.

Used Photoshop. Drawing canvas online you convert to an image then upload it to Photoshop/Illustrator or Indesign then you print it out.

How do I set the dimensions of this new canvas to those of the printer? What are the dimensions of the printable area of a page for the user, and how can I create a window with those proportions?

You need javascript or jQuery not CSS. I don't think I ever seen any CSS code will set dimension on a printer.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.