Как поставить цифры на маркеры Google Map API? - PullRequest
0 голосов
/ 23 июля 2011

Я использую API GoogleMap в своем проекте, где положение определенного транспортного средства отображается с использованием данных в БД, я уже реализовал это, МОЙ вопрос, возможно ли получить цифры на маркерах, кроме транспортного средства A был в 100 местах от 1 до 2 декабря, я хотел бы иметь номера от 1 до 100, показывающие его путь. Это функция создания маркера моего API Google:

    function createMarker(point, IMEI, Velocity, Ora, Data) {   
      var marker = new GMarker(point, iconBlue); 
      var html = "<b>" + "Ora: " + "</b>" + Ora + "<br/>" + "<b>" + "Data: " + "</b>"+ Data + "<br/>" + "<b>" + "Velocità: " + "</b>" + Velocity + " km/h" ; 
      GEvent.addListener(marker, 'click', function() {
        marker.openInfoWindowHtml(html); });
      return marker;
     }

Это код, чей вывод используется googmapsapi.html, вывод представляет собой простой xml-файл с количеством тегов "markers", содержащих такую ​​информацию, как long, lat, date и time, может ли этот список быть использованы как-то, чтобы получить цифры?

         // Opens a connection to a MySQL server
$connection=mysql_connect ("localhost","root","alphabravo");
if (!$connection) {
    die('Not connected : ' . mysql_error());
                    }

// Set the active MySQL database
$db_selected = mysql_select_db("tracciasat", $connection);
if (!$db_selected) {
    die ('Can\'t use db : ' . mysql_error());
            }

// Select all the rows in the markers table
//$query = "SELECT * FROM sessione WHERE 1";
$query = "SELECT * FROM sessione WHERE Dat BETWEEN '$_GET[strt]' AND '$_GET[end]' AND IMEI = '$_GET[id]'";
$result = mysql_query($query);
if (!$result) {
    die('Invalid query: ' . mysql_error());
                }

header("Content-type: text/xml");

// Start XML file, echo parent node
echo '<markers>';

    // Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
     echo '<marker ';
     echo 'IMEI="' . parseToXML($row['IMEI']) . '" ';
    echo 'Velocity="' . parseToXML($row['Velocity']) . '" ';
    echo 'Ora="' . parseToXML($row['Ora']) . '" ';
       echo 'Data="' . parseToXML($row['Dat']) . '" ';
    echo 'lat="' . $row['Latitudine'] . '" ';
         echo 'lng="' . $row['Longitudine'] . '" ';
               //echo 'type="' . $row['type'] . '" ';
                 echo '/>';
                                                                }

          // End XML file
                        echo '</markers>';

          }

Я хотел бы добавить код, касающийся Icon, в моем случае это blueIcon:

       var iconBlue = new GIcon(); 
iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconBlue.iconSize = new GSize(12, 20);
iconBlue.shadowSize = new GSize(22, 20);
iconBlue.iconAnchor = new GPoint(6, 20);
iconBlue.infoWindowAnchor = new GPoint(5, 1);

Спасибо за ваше время!

Ответы [ 4 ]

1 голос
/ 24 июля 2011

Хорошо, ребята, перейдя по ссылке @ChristopheCVB, я справился! Дайте мне поделиться кодом, если кто-то нужен в будущем

Этот код в основном создает 1000 значков с написанными на них номерами от 1 до 1000. Нужен файл javascript mapiconmaker.js, так что либо скачайте его, либо сложите вместе с другими файлами сайта,

                 type="text/javascript"></script>
         <script src="mapiconmaker.js" language="text/javascript"></script>
   <script type="text/javascript">

  //<![CDATA[
    var customIcons = [1000];
    for(var j=0;j<1000;j++){
    var iconOptions = {};
  iconOptions.primaryColor = "#0000FF";
  iconOptions.strokeColor = "#000000";
iconOptions.label = j.toString().replace();
 iconOptions.labelColor = "#000000";
 iconOptions.addStar = false;
   iconOptions.starPrimaryColor = "#FFFF00";
 iconOptions.starStrokeColor = "#0000FF";
   customIcons[j]  = MapIconMaker.createLabeledMarkerIcon(iconOptions);
      }

Впоследствии я использую эти маркеры, когда функция javascript googlemap api отображает карту и когда она назначает маркеры для каждого местоположения, код которого находится здесь:

            GDownloadUrl("second.php?strt="+ysdate+"/"+msdate+"/"+dsdate+"&end="+yedate+"/"+medate+"/"+dedate+"&id="+ide, function(data) {
                var xml = GXml.parse(data);
                var markers = xml.documentElement.getElementsByTagName("marker");
                for (var i = 0; i < markers.length; i++) {
                var IMEI = markers[i].getAttribute("IMEI");
                var Velocity = markers[i].getAttribute("Velocity");
                var Ora = markers[i].getAttribute("Ora");
                var Data = markers[i].getAttribute("Data");
                var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                        parseFloat(markers[i].getAttribute("lng")));
                var marker = createMarker(point, IMEI, Velocity, Ora, Data, i);

                map.addOverlay(marker);

              }
            });
          }
        }

        function createMarker(point, IMEI, Velocity, Ora, Data, i) {    
              var marker = new GMarker(point, customIcons[i]); 
              var html = "<b>" + "Ora: " + "</b>" + Ora + "<br/>" + "<b>" + "Data: " + "</b>"+ Data + "<br/>" + "<b>" + "Velocità: " + "</b>" + Velocity + " km/h" ; 
              GEvent.addListener(marker, 'click', function() {
                marker.openInfoWindowHtml(html); });
              return marker;
             }

Я новичок в этом сайте, но мне очень нравится дух бесплатной и быстрой помощи от экспертов, я, безусловно, внесу свой вклад, поскольку время уйдет, по крайней мере, обратно в то, что я получаю. Спасибо всем!

1 голос
/ 23 июля 2011

Проверьте следующий URL, чтобы настроить значки маркеров:

http://groups.google.com/group/Google-Maps-API/web/examples-tutorials-custom-icons-for-markers?pli=1

0 голосов
/ 23 июля 2011

Нет необходимости создавать собственный маркер, потому что у Goolge есть Google Chart Api: http://code.google.com/intl/de/apis/chart. Я использую его для создания нумерованных иконок в моих приложениях.Это избавляет меня от головной боли.

0 голосов
/ 23 июля 2011

Я почти уверен, что API не поддерживает нумерацию маркеров. Я могу думать о двух неудовлетворительных альтернативах.

  1. Установите zIndex, а затем отобразите zIndex в качестве заголовка маркера.
  2. Используйте setIcon, чтобы изменить MarkerImage на нумерованный рисунок.

У меня обычно есть лучшие ответы, чем этот. Я думаю, что у меня выходной.

...