-1
私はGoogleマップで働いていると私はこのようになりますマーカーの配列を持っている:jquery CSSの色はすべてのセレクタで変更されていますが、font-sizeは変更されていませんか?
var locations = [
[{
id: 1,
lat: 51.5239935252832,
lng: 5.137663903579778,
content: 'Kids Jungalow (5p)'
}],
[{
id: 2,
lat: 51.523853342911906,
lng: 5.1377765563584035,
content: 'Kids Jungalow (5p)'
}],
[{
id: 3,
lat: 51.5237298485607,
lng: 5.137969675407476,
content: 'Kids Jungalow (5p)'
}],
[{
id: 4,
lat: 51.52355628836575,
lng: 5.138066234932012,
content: 'Kids Jungalow (5p)'
}],
[{
id: 5,
lat: 51.52340275379578,
lng: 5.138211074218816,
content: 'Kids Jungalow (5p)'
}],
[{
id: 6,
lat: 51.523199152806626,
lng: 5.138382735595769,
content: 'Kids Jungalow (5p)'
}],
[{
id: 7,
lat: 51.5229955509073,
lng: 5.138511481628484,
content: 'Kids Jungalow (5p)'
}],
[{
id: 8,
lat: 51.52280529912936,
lng: 5.138543668136663,
content: 'Kids Jungalow (5p)'
}],
[{
id: 9,
lat: 51.523596340777075,
lng: 5.138463201866216,
content: 'Kids Jungalow (5p)'
}],
[{
id: 700,
lat: 51.523372714362736,
lng: 5.1386992362595265,
content: 'Kids Jungalow (5p)'
}],
[{
id: 101,
lat: 51.52329594683302,
lng: 5.138838711128301,
content: 'Kids Jungalow Giraffe'
}]
Iループはマーカーの配列を谷と、このようなすべての位置にHTMLのマーカーをセットより:
for (i = 0; i < locations.length; i++) {
var myLatLng = new google.maps.LatLng({
lat: locations[i][0].lat,
lng: locations[i][0].lng
});
var number = locations[i][0].id;
var marker_html = '<div id="' + number + '"><div class="rich-marker"><span class="number-id">' + number + '</span></div></div>';
var marker = new RichMarker({
position: myLatLng,
map: map,
flat: true,
anchor: RichMarkerPosition.MIDDLE,
content: marker_html
});
}
私はこのようなズームレベル18のクラスnumber-id
のCSSスタイルを変更したいたより:
map.addListener('zoom_changed', function() {
// Limit the zoom level
if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel);
// for loop door locaties
for (i = 0; i < locations.length; i++) {
setMarkerSize(i);
}
});
function setMarkerSize(i) {
var infobox = locations[i][0].infobox;
var id = locations[i][0].id;
if (map.getZoom() === 18) {
$('.rich-marker').css({ 'display' : 'block', 'width' : '20px', 'height' : '20px' });
$('.number-id').css({ 'display' : 'block', 'font-size' : '12px'});
if (id >= 100) {
console.log(id);
console.log($('[data-id="' + id + '"]'));
$('#' + id).find('.number-id').css('font-size', '10px');
$('#' + id).find('.number-id').css('color', 'red');
}
infobox.setOptions({ pixelOffset: new google.maps.Size(-93, -22) });
}
}
色があります100以上のすべてを変更するが、フォントサイズは配列内の最後のオブジェクトに対してのみ変更されている
'IF(ID> = 100){'ここでどこから来る 'id'の値はありますか? – dreamweiver
@dreamweiver申し訳ありませんが、 – Sreinieren
がループ内で構築されていないので、その値はif内部で定数なので、セレクタ '$( '#' + id).find( '。number-id')'は'id> = 100'のすべての要素にCSSが適用される方法はないことを意味しています。 – dreamweiver