Bing Map Установка ширины задвижки сдвигает штифт от местоположения карты

Question

Я использую карты Bing для отображения точек карты на карте мира.

Проблема, с которой я столкнулась, это если текст метки (MapPoints [i] .city) более 9 символов (ширина защёлкивания, 60), это усечение текста.

Если я увеличиваю ширину от 60 до 160. Метка отображается полностью, но точка-метр перемещается влево от фактического местоположения.

Я пробовал разные комбинации, но это не помогает. Я хочу показать полный ярлык, но не хочу, чтобы кнопка отходила от фактического местоположения на карте.

Как это сделать?

Благодаря

img = MapPoints[i].group + '.png'; 
var pushpin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(parseFloat(MapPoints[i].lat), parseFloat(MapPoints[i].lon)) 
     , { 
      icon: img, 
      height: 50, width: 60, text: MapPoints[i].city, typeName: 'clrval' 

     }); 

    pushpin.Title = MapPoints[i].name; 
    pushpin.description = MapPoints[i].desc; 
    pushpin.cityID = MapPoints[i].cityID; 
    pushpin.city = MapPoints[i].city; 
    pushpin.typeName = 'clr'; 

dataLayer.push (канцелярской);

Класс CSS выглядит следующим образом

.clrval div { color: blue !important; 
left: 5px !important; 
text-shadow: 1px 0px white, -1px 0px white, 0px -1px white, 0px 1px white; 
font: 12px arial,sans-serif !important; 
} 

Answer 1

Мы можем добавить узловую свойство к Pushpin следующим якорь: новый Microsoft.Maps.Point (12,36) «12,36 указывает размер значка кнопки используется.»

var pushpin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(parseFloat(MapPoints[i].lat), parseFloat(MapPoints[i].lon)) 
     , { 
      icon: img, 
      height: 50, width: eval("widthval"), text: MapPoints[i].city, typeName: 'clrval', anchor: new Microsoft.Maps.Point(12, 36) 
      , textOffset:(0,0) 


     }); 

Если мы установим свойство привязки, оно не будет отходить от местоположения на BingMaps.

Answer 2

Я не слишком опыт работы с JS, но не могли бы вы просто смещение штифта, так что сидит на правильном месте?

Answer 3

Вы можете отрегулировать положение Определяя полями:

a.clrval img{ 
    margin-left: 8px; 
    margin-top: 4px; 
}