Как поместить значки внутри изображения, переместить значки только внутри изображения с помощью мыши и сохранить их расположение внутри изображения?

Question

для проекта, я пытаюсь предоставить пользовательский интерфейс, в котором пользователь может расположить датчики на ноге, а затем сохранить положение датчиков на изображении, чтобы отобразить их позже: При выполнении, поэтому я создаю 5 изображений, по одному на датчик, и изображение отображения стопы, но я понятия не имею, как разместить значок датчиков на изображении, а затем сохранить их положение внутри изображения. У меня есть следующий код:

<p>Put on the foot mapping the sensors position</p>
                      <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/circle-1.png")}
                          class="inner-image"
                          width="40em"
                          height="40em"
                          />
                           <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/circle-2.png")}
                          class="inner-image"
                          width="40em"
                          height="40em"
                          />
                           <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/circle-3.png")}
                          class="inner-image"
                          width="40em"
                          height="40em"
                          />
                           <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/circle-4.png")}
                          class="inner-image"
                          width="40em"
                          height="40em"
                          />
                           <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/circle-5.png")}
                          class="inner-image"
                          width="40em"
                          height="40em"
                          />
                      <img
                          alt="foot_mapping"
                          src={require("assets/img/theme/foot.png")}
                          width="80%"
                          height="80%"
                        />

Я попробовал внутреннее изображение, но безуспешно и не нашел других ресурсов по этой проблеме. Заранее спасибо:)