сложность показа разных цветов маркера в php - PullRequest
Новая
       37

сложность показа разных цветов маркера в php

0 голосов
/ 07 декабря 2018

Мне сложно показать разные цвета маркеров.это различие цвета маркера основано на значении из базы данных.

это кодирование для отображения карт и маркеров 

<script src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY"
  type="text/javascript">
</script> 
<script type="text/javascript">
  var map;
  function init(){
    map = new google.maps.Map(document.getElementById('maps'), {
      zoom: 10,
      center: new google.maps.LatLng(-7.320795, 112.731386),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    <?php foreach($get_data->result() as $row) {
      $nilai = $row->nilai;
      if($nilai >= 0 && $nilai <=50) {?>
        var icons = {
          info: {
            icon: '<?php echo base_url("assets/marker_merah.png");?>'
          }
        };
      <?php }elseif($nilai >= 51 && $nilai <=69){ ?>
        var icons = {
          info: {
            icon: '<?php echo base_url("assets/marker_hijau.png");?>'
          }
        };
      <?php }elseif($nilai >= 70) { ?>
        var icons = {
          info: {
            icon: '<?php echo base_url("assets/marker_biru.png");?>'
          }
        };
      <?php }
    } ?>

    var features = [
    <?php foreach($get_data->result() as $row){ ?>
      {
        position: new google.maps.LatLng(<?php echo $row->lat;?>,<?php echo $row->long;?>),
        type: 'info',
        title : '<?php echo $row->nama;?>'
      },
    <?php } ?>
    ];

    // Create markers.
    features.forEach(function(feature) {
      var marker = new google.maps.Marker({
        position: feature.position,
        icon: icons[feature.type].icon,
        title: feature.title,
        map: map
      });
    });
  }
 google.maps.event.addDomListener(window, 'load', init);
</script>

Я хочу вызвать красные маркеры для значений 0-50,зеленый для значений 51-69 и синий для значений 70 и выше.

после запуска приведенного выше кода я обнаружил, что все маркеры являются только зелеными, а красные и синие маркеры не отображаются.

Пожалуйста, помогите мне.

Ответы [ 2 ]

0 голосов
/ 08 декабря 2018

Xenomena права, вы просто заменяете друг друга ... я думаю, вы получите код от

https://developers.google.com/maps/documentation/javascript/custom-markers Вы должны внимательно следить за тем, чтобы там был многомерный массив. 

     var icons = {
      parking: {
        icon: iconBase + 'parking_lot_maps.png'
      },
      library: {
        icon: iconBase + 'library_maps.png'
      },
      info: {
        icon: iconBase + 'info-i_maps.png'
      }
    };

Итак, мой ответ: 

        var icons = {
      info1: {
        icon: 'icons/blue.png'
      },
      info2: {
        icon: 'icons/white.png'
      },
      info3: {
        icon: 'icons/red.png'
      }
    };

Это делает многомерный массив для значка, затем я делаю свои собственные данные долготы в массиве get_lang, и данные nilai в массиве get_data: 

foreach($get_lat as $i=>$row){ ?>
  {
    position: new google.maps.LatLng(<?php echo $row[0];?>,<?php echo $row[1];?>),
<?php
  if($get_data[$i] <50) {?>
    type: 'info1',
  <?php } elseif ($get_data[$i] >= 51 && $get_data[$i] <=69){ ?>
    type: 'info2',
  <?php } else { ?>
    type: 'info3',
  <?php } ?>
    title : "<?php echo $row[0];?>"
  },
<?php } ?>
];

Предложение, в следующий раз, когда вы публикуете свой код, вам также нужно опубликовать свой пример ввода.

Полный код работ:

https://pastebin.com/dWj5wjTE

Надеюсь, эта помощь.

0 голосов
/ 08 декабря 2018

Вы выполняете следующий цикл <?php foreach($get_data->result() as $row) { два раза в своем коде.

Первый раз, когда он генерирует в JavaScript что-то похожее на 

var icons = {
   info: {
        icon: 'assets/marker_hijau.png'
   }
};

var icons = {
    info: {
        icon: 'assets/marker_merah.png>'
    }
};

var icons = {
    info: {
        icon: 'assets/marker_biru.png>'
    }
};

var icons = {
    info: {
        icon: 'assets/marker_merah.png>'
    }
};

Итак, вы просто переопределяете то же самоепеременная несколько раз, и очевидно, что JavaScript будет использовать последнее значение, которое вы присвоили icons переменной.

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

Iпереписал бы ваш код на что-то похожее на 

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"
  type="text/javascript">
</script> 
<script type="text/javascript">
  var map;
  function init(){
    map = new google.maps.Map(document.getElementById('maps'), {
      zoom: 10,
      center: new google.maps.LatLng(-7.320795, 112.731386),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var features = [
    <?php foreach($get_data->result() as $row) { 
      $nilai = $row->nilai; ?>
      {
        position: new google.maps.LatLng(<?php echo $row->lat;?>,<?php echo $row->long;?>),
        type: 'info',
        <?php if($nilai >= 0 && $nilai <=50) {?>
            icon: '<?php echo base_url("assets/marker_merah.png");?>',
        <?php } elseif($nilai >= 51 && $nilai <=69) { ?>
            icon: '<?php echo base_url("assets/marker_hijau.png");?>',
        <?php } elseif($nilai >= 70) { ?>
            icon: '<?php echo base_url("assets/marker_biru.png");?>',
        <?php } ?>
        title : '<?php echo $row->nama;?>'
      },
    <?php } ?>
    ];

    // Create markers.
    features.forEach(function(feature) {
      var marker = new google.maps.Marker({
        position: feature.position,
        icon: feature.icon,
        title: feature.title,
        map: map
      });
    });
  }
 google.maps.event.addDomListener(window, 'load', init);
</script>

Надеюсь, это поможет!

...