A
A
Alexey Ivanov2019-01-23 10:19:46
JavaScript
Alexey Ivanov, 2019-01-23 10:19:46

How to implement the location of the element, in the picture?

Good afternoon! Can you please tell me how to implement this functionality?
- A person uploads a picture to the site
- Selects himself and / or a friend in the picture and adds a full name (like the functionality of an insta when you mark a user on a photo)
- Downloads a picture with captions
5c48158a55d85822301568.jpeg

Answer the question

In order to leave comments, you need to log in

2 answer(s)
S
Somewhere Intech, 2019-01-23
@ivanovav27

After uploading a photo to the site, it is displayed to the user. He, in turn, draws a rectangle on it (marks the face) and adds a caption below (or somewhere else). You can draw a rectangle on the photo using JS. The img parent has a CSS position relative property, img and all overlays on it are absolute. The rectangle can be drawn with a normal DIV with a border and for beauty border-radius, for example, moved and scaled using the top left width height CSS properties. Of course, you can also get confused with canvas if you need a more interesting UI.

D
Dima, 2019-01-23
Dolgoter @SpiderPigAndCat

img map
https://www.image-maps.com/jsfiddle.net/jsWdj

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question