Я работаю с аспирантом на стажировке. Мне дали задание создать экран (веб-страницу или приложение). Таким образом, в начале на экране будут пустые черные квадраты, но как только кто-то пьет воду, человек, который следит за ним, вводит ее в систему, и встречаются два черных квадрата. Пересечение будет пропорционально количеству забираемой воды, а площадь пересечения будет принимать цвет, назначенный этому человеку, например, желтый для человека A, зеленый для человека B и так далее. Я приложил картинку для лучшего понимания.
Я не работал над такой программой раньше. Я знаю c ++ и немного javascript и HTML. Мне сказали, что это можно сделать при обработке, но я не слышал об этом раньше. Я сделал несколько видео на YouTube, но я не очень понимаю, как это сделать, какой подход и как это сделать. Было бы замечательно, если бы кто-нибудь мог мне рассказать об этом. Эталонное изображение