# How to draw 3D box layout according to inches

I need to draw a box like this and scale width, height and length according to certain dimensions in inches like 17x10x4"

I know how to draw lines

``````function drawlines(canvas, context){

context.beginPath();
context.moveTo(188, 130);
context.bezierCurveTo(140, 10, 388, 10, 388, 170);
context.lineWidth = 5;
// line color
context.strokeStyle = "black";
context.stroke();
}
``````

can you help me please

so, find the points you need to draw lines between, and draw lines there.

Your drawing looks like a cube, where all edges would be the same length.

Iâ€™m guessing that may be part of the problem, of which I see two.

One is the units. Monitors donâ€™t really do â€śinchesâ€ť reliably. Iâ€™d probably â€śscaleâ€ť them to pixels.

The other is knowing how to use the pythagorean theorem.

and then thereâ€™s the question of canvas size, and offsets, and drawing capacity, and negative dimension size, andâ€¦

Or we could ask why the user wants to draw an arbitrarily sized box, because that seems an odd use case.

Itâ€™s not possible to do simple scaling on this drawing, because scale is applied in two dimensions (the dimensions of the canvas), and your measurements are in three (the pseudo-measurements of the solid). So youâ€™d have to redraw the lines any time the dimensions changed.

2 Likes

Is the intention to draw an isometric projection of a 3d solid, or is perspective an issue as well?