Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Можно ли с помощью JavaScript определить точки X и Y на картинке? (https://javascript.ru/forum/misc/58815-mozhno-li-s-pomoshhyu-javascript-opredelit-tochki-x-i-y-na-kartinke.html)

javascript_pupil 12.10.2015 14:00

Можно ли с помощью JavaScript определить точки X и Y на картинке?
 
Можно ли на JavaScript сделать выделение нужного фрагмента на заданной картинке и определить точки координат X и Y в пикселях (или процентах) на изображении?

Это необходимо для кадрирования картинки. Буду признателен за любые советы по теме.

ruslan_mart 12.10.2015 14:06

Можно, с помощью canvas.

laimas 12.10.2015 14:08

Цитата:

Сообщение от Ruslan_xDD
Можно, с помощью canvas.


Не обязательно на нем, и для старых браузеров такое "обрезание" можно сделать.

guru_nemo 12.10.2015 14:31

Вставь картинку в div а на него повесь событие, и отслеживай перемещение курсора.

ruslan_mart 12.10.2015 14:36

Если я правильно понял, то так: http://jsfiddle.net/q7dw6p6q/

Или объясните подробнее.

javascript_pupil 12.10.2015 18:13

Учитывая, что для кадрирования требуется прямоугольник, нам потребуется для этого знать координаты 2 точек, это, например: левый верхний угол (x, y) и правый нижний (x, y). В фотошопе это называется "Инструмент Прямоугольная область". Эта функция и требуется, чтобы от этого самого фотошопа избавиться. Поддержка старых браузеров не требуется.

В идеале эта рамка могла бы быть видимой (если это возможно), но это не обязательно. Надо, чтобы точки можно было каким-то образом выбрать (щелчком?) и получить x и y в обычный input type="text". Как-то так.

Ruslan_xDD, как я понял из примера, точки уже заданы, а их должен иметь возможность выбирать пользователь. Например, уши от кота на той фотке. :)

рони 12.10.2015 18:26

javascript_pupil,
http://odyniec.net/projects/imgareaselect/

javascript_pupil 12.10.2015 18:45

рони, да, это именно то, что требуется. Только один минус - это jQuery. :( Ну и то, что пример делает только квадраты.

Выбрать две точки - это настолько сложная задача, что требуются километры кода jQuery?

рони 12.10.2015 18:55

Цитата:

Сообщение от javascript_pupil
Ну и то, что пример делает только квадраты.

не понял

laimas 12.10.2015 19:03

Цитата:

Сообщение от javascript_pupil
Только один минус - это jQuery


Это называется cropp image плагины и их как собак ... не только под JQ.
http://www.hotscripts.com/blog/javas...pping-scripts/


Часовой пояс GMT +3, время: 00:57.