Skip to content

Commit

Permalink
fix: Scaling problem on non-responsive webpage
Browse files Browse the repository at this point in the history
  • Loading branch information
Thor-x86 committed May 19, 2021
1 parent 8840ccf commit 3030728
Show file tree
Hide file tree
Showing 2 changed files with 11 additions and 4 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "compodraw",
"version": "1.0.0",
"version": "1.0.1",
"description": "Compose with JSX or XML then draw to Canvas API",
"main": "build/compodraw.js",
"types": "types/index.d.ts",
Expand Down
13 changes: 10 additions & 3 deletions src/renderer/draw.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,19 @@ import { Instruct } from "../interfaces";
*
* @param composed Typically a group of instructions
* @param canvasDOM Targeted canvas element
* @param isResponsive Set to false if canvas behaves weird
*/
export function draw(composed: Instruct, canvasDOM: HTMLCanvasElement): void {
export function draw(
composed: Instruct,
canvasDOM: HTMLCanvasElement,
isResponsive: boolean = true
): void {
if (!canvasDOM) return;

canvasDOM.width = canvasDOM.clientWidth * window.devicePixelRatio;
canvasDOM.height = canvasDOM.clientHeight * window.devicePixelRatio;
if (isResponsive) {
canvasDOM.width = canvasDOM.clientWidth * window.devicePixelRatio;
canvasDOM.height = canvasDOM.clientHeight * window.devicePixelRatio;
}

if (typeof canvasDOM.getContext === "function") {
const canvasCtx = canvasDOM.getContext("2d");
Expand Down

0 comments on commit 3030728

Please sign in to comment.