cyber,
1. Начальные координаты точки считай от левого верхнего угла пойнтера - до левого верхнего угла карты(если отсутствуют маргины для пойнтера |
Цитата:
.point_on_map {
width: 20px;
height: 34px;
background-image:url([url]http://www.google.com/mapfiles/marker.png);[/url]
}
а то непонятно смещение на -40 px в лево и на -124 в высоту |
Цитата:
![]() |
Цитата:
|
если бы проблема была в этом смещение было бы в пару раз меньши
|
cyber,
1. Считаю нужно добивацо ясности во всём 2. Покажи реальный подсчет координаты пойнтера? 3. Где начальные неизменяемые установки для заострённого края(от краёв картинки карты) при максимальном масштабе ? ,которые в дальнейшем множацо на zoom. |
Цитата:
нет разницы чей вариант использовать твой или мой результаты одинаковы
function setNewPosition (zoom, width, height) {
points.each(function(index, element) {
var left = parseInt($(this).css('left'));
var top = parseInt($(this).css('top'));
if (zoom) {
left *= width / zooming.width();
top *= height / zooming.height();
} else {
left /= zooming.width() / width;
top /= zooming.height() / height;
}
$(this).css({
left:left+'px',
top: top +'px'
});
});
}
я только что провел эксперемент, взял обьект на карте измерял расстояние до него при исходном размере , рассчитал по той формуле что и для точек и получилось что считает правильно, потом проверил линейкой(плагин линейка:)) при макс зуме и совпали координаты(с не большую погрешностью).Значит дело все таки в самих точках |
ты прав дело в точка, чем меньше точка тем меньше смещение
|
насчет твоей идеи с margin , проще тогда уже отнимать от позиции точки чем ставить margin , но это не помогает.
не хрина не помогает |
все мои нервы сдали!!!
теперь точка будет нарисована и координаты буду до нее расчитыватся=) |
Цитата:
Имхо - разделяй и властвуй - чем те маргины мешают, не участвующие в скрипте ? |
тем что я уже пробывал, эффекта 0!
|
cyber,
ща я тьву рожу элемент |
Цитата:
|
Нууу ты опять стер демку - ну где я найду элементы ??
"тьву"?=) - это типо - тебе (Или Вам) |
эм..
я не стирал , щас пере залью |
|
Цитата:
|
т.е с мини окружением?
|
cyber,
ну он по моему в линке <a стоял ? |
ты об этом?
.point_on_map {
width: 20px;
height: 34px;
background-image:url([url]http://www.google.com/mapfiles/marker.png);[/url]
}
.map a {
position:absolute;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
}
<a href="#" class="point_on_map" style="left:20%; top:30%;"></a> <a href="#" class="little_point" style="left: 435px; top: 384px;"></a> <a href="#" class="point_on_map" style="left: 427px; top: 356px; "></a> |
:dance:
<style type="text/css">
.point_on_map {
width: 0px;
height: 0px;
position:absolute;
display:block;
*!*
border:1px blue solid;
*/!*
}
.point_on_map img{
margin:-34px 0 0 -10px!important;
position:absolute;
border:0 none transparent;
}
</style>
<br>
<a href="#" class="point_on_map" style="left: 435px; top: 384px;"><img src="http://www.google.com/mapfiles/marker.png" /></a>
|
теперь точка уежает, не много меньше и в низ
|
cyber,
Поставь точку в начало картинки карты позицию left:2px; top:2px; Отслеживай left: точки (выводи знчение в input тext |
2px не получится ты же сам поставил margin - 34
|
|
|
ахахха, я понял, сместилась ссылка а картинка осталась на месте?!
|
cyber,
Поменяй css - по-ходу глюк с анимацией в css
<style>
*{margin:0; padding:0;}
.wrapper .zooming-map,.zooming-map > img{
position:absolute;
width:100%;
height:100%;
}
.wrapper .zooming-map,.zooming-map {
position:absolute;z-index:100;
transition-duration: 0.06s;
-webkit-transition-duration: 0.06s;
-moz-transition-duration: 0.06s;
-o-transition-duration: 0.06s;
-ms-transition-duration: 0.06s;/* IE9+ */
}
.point_on_map {
width: 0px;
height: 0px;
position:absolute;
display:block;
border:1px red solid;
}
.point_on_map img{
margin:-34px 0 0 -10px!important;
position:absolute;
border:0 none transparent;
}
.map{
width:1800px;
height:1000px;
overflow:hidden;
/*margin:10px;*/
border:1px solid black;
}
.map .wrapper{
width:1600px;
height:1000px;
cursor: move;
}
.little_point {
position:absolute;
width:5px;
height:5px;
background-color:#000;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
}
</style>
|
неа, вторая точка как двигалась так и двигается
|
Т.е при такой задержке в Анимации - Ти неправильно считываешь координаты, пойнтера - поскольку их нун считывать не из Dom - а создавать массив предыдущей позиции
Чего бы не было при проставке координат пойнтеров при максимальном размере карты и чисто домножении на zoom |
Цитата:
|
заменил, и до меня дошло в чем проблема она не в css и не в js .
я не учел один фактор, что зум считает с учетом того что изображение тоже будет зумится если увеличивать точки вместе с картинкой то все станет ясно =) ![]() левый угол именно в той точке где всегда оказывалась картинка |
Цитата:
и на следующем шаге - зуммить от запомненного |
Цитата:
к примеру : текущий размер лефт = 1600, топ = 1000 зум - 1.5 1600* 1.5 = 2400 1000* 1.5= 1500 запомнили эти 2 значения в итоге zooming.width() == 2400 zooming.height() = 1500 |
нужно просто расчитывать координаты точек с учетом того что они зумтся
|
пошел я спать, завтра до пилю.
спокойной ночи=) |
Цитата:
карочь - делай как заешь - я и спойнтерами независимую штуку рассказал (посколь координата константа - zoom текущий) И с зуммом, запоминая ширину картинки на предыдущем шаге... Хотя конечно свои идеи интересней |
а ну так я добавлю transitionEnd и пока оно не наступит
|
Цитата:
|
| Часовой пояс GMT +3, время: 06:38. |