JS script to visualize the placement of photovoltaic panels on the roof

We will commission a script using Javascript ( I think using the Canvas library, but other proposals will also be considered).

The script is to be used to visualize the placement of photovoltaic panels on the roof.

The script will later be used by us in existing software and properly ostilized, so the visual side is not important here.

Operation of the script:

1. In the first step, the user imports a photo of the roof in any perspective ( from Google Maps, a photo from a drone or a photo taken from the ground ). This photo is set as the background of our canvas

2 The next point is to scale our photo ( that is, to determine the length and width ) and to determine the perspective (the slope of the roof plane in the photo in the X and Y axis). To do this, we draw a rectangular area and enter the length of its edges in mm and the angle of the X and Y slope in degrees. The user will rely, for example, on the fact that he knows the dimension of the tiles and will mark an area of 5 x tiles.

... and many more points to work on