powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Нарисовать стрелку в таблице
7 сообщений из 7, страница 1 из 1
Нарисовать стрелку в таблице
    #39768069
Maksimka-27
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Добрый день!

Нужна помощь в реализации.

Есть таблица формата:
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
<table>
	<tr>
		<th></th><th>1</th><th>2</th><th>3</th><th>4</th>		
	</tr>
	<tr>
		<td>Строка</td><td>c1</td><td></td><td></td><td></td>
	</tr>
	<tr>
		<td>Строка</td><td></td><td>c2</td><td></td><td></td>
	</tr>
	<tr>
		<td>Строка</td><td></td><td></td><td>c3</td><td></td>
	</tr>
	<tr>
		<td>Строка</td><td></td><td></td><td></td><td>c4</td>
	</tr>	
</table>



В зависимости от содержания нужно динамически нарисовать стрелку (например) от ячейки c3 к c1.
На картинке - как это нарисовано в Екселе.

Подскажите, в какую сторону копать?
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39768074
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Maksimka-27,

таблица position:absolute в div, стрелка(кртинка png c прозрачностью, или svg) position:absolute в том же div
определить координаты нужных ячеек и поместить в нужное место +z-index
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39769475
Maksimka-27
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Начал копаться там, где ни разу не был, и вот засада - картинка рисуется не там.

Код: javascript
1.
2.
3.
4.
5.
var yy = document.getElementById(se1).getBoundingClientRect(); // левая верхняя ячейка куда указывает стрелка
svg.style.position = "absolute";
svg.style.left = yy.right; // не ошибка, картинка справа ячейки
svg.style.top = yy.top;
....


Причем в Хроме, при изменении масштаба страницы (плюс перезагрузка), картинка "гуляет". - чем меньше масштаб, тем больше удаляется вправо (и вниз).

Где неправильно посмотрел?
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39769498
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Maksimka-27,

тут https://jsfiddle.net/ сделай вариант, что б было что видеть
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39769785
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Maksimka-27,

https://jsfiddle.net/jyg4v1nt/
тонкости координат конца и начала стрелки сам определишь
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39769904
Maksimka-27
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
Проблема снялась.
Проблема была в том, что скрипт поместил в файл chtml, на который накатывался шаблон, в результате скрипт был не в конце.

Проблема решена.
...
Рейтинг: 0 / 0
Нарисовать стрелку в таблице
    #39769908
Maksimka-27
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Гость
вадя, Спасибо!

У меня примерно то же самое https://jsfiddle.net/eLtov38u/1/
Как выше писал, проблема крылась в том, куда попал скрипт на реальной странице
...
Рейтинг: 0 / 0
7 сообщений из 7, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Нарисовать стрелку в таблице
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]