1

I have a world size of 100x100

I want to map this world size to screen size using this mapTo function

function mapTo(pos, from, to) {
  let n = pos / from;
  return n * to;
}

Now I want to show only a portion of this world scaled up to the screen size, let's call it view size of 10x10 now how should I map this world size of screen size with regards to view size?

I want to show 10x10 world units fit the whole screen.

I've tried to do:

let aWorldPosition = [0, 0];

let worldSize = [100, 100];
let viewSize = [10, 10];
let screenSize = [20, 20];


let r = mapTo(aWorldPosition, worldSize, viewSize);
r = mapTo(r, viewSize, screenSize);

but that doesn't work.

Also I want to be able to move the view so I can show portions of the world.

I've tried this and seems to be working but I don't know if it's correct:

let r = mapTo(aWorldPosition, viewSize, screenSize);

Here viewSize is in world coordinates.

eguneys
  • 247
  • 1
  • 8
  • I've seen this answer, but it doesn't address the scaling operation https://gamedev.stackexchange.com/questions/46228/implementing-a-camera-viewport-to-a-2d-game – eguneys Jul 11 '20 at 00:39
  • What results DO you get? Is this effectively a texture you are trying to position? – Weckar E. Jul 11 '20 at 15:37
  • I draw rectangles on canvas by specifying canvas coordinates like canvas.drawRect(0, 0); There is no texture. – eguneys Jul 11 '20 at 15:41
  • Okay. With the code you currently have, viewSize effectively doesn't do anything. You are first scaling from 100 to 10 (factor 0.1) and then from 10 to 20 (factor 2.0). That is the same as going from worldsize to screensize directly, as you can just multiply consecutive scale factors. Both net you 0.2. – Weckar E. Jul 11 '20 at 15:47
  • I suspect you want your first mapTo to function as a crop, and the second as a scaling, but that's not entirely clear. – Weckar E. Jul 11 '20 at 15:47
  • I kind of solved this problem see my edit please. – eguneys Jul 11 '20 at 15:51

0 Answers0