简体   繁体   中英

How to show two or more markers on a Google map with javascript

I have written this code to show map and mark with javascript code in the asp.net web page:

<script src="http://maps.googleapis.com/maps/api/js"></script>
   <script>
       var myCenter;
       var center;
       var isButtonClick = false;
       function initialize(x, y) {
           var mapProp = {
               center: new google.maps.LatLng(x, y),

               zoom: 5,
               mapTypeId: google.maps.MapTypeId.ROADMAP
           };
           myCenter: center;
           var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
           var marker = new google.maps.Marker({
               position: new google.maps.LatLng(x, y),
               animation: google.maps.Animation.BOUNCE
           });
           marker.setMap(map);

       }
       google.maps.event.addDomListener(window, 'load', function () { if (!isButtonClick) initialize(0, 0) });
    </script>


and write this code in the asp button click event to send value to java script function:

Page.ClientScript.RegisterStartupScript(this.GetType(), "beh", "isButtonClick=true;initialize(35.878987,46.279637);", true);

every thing works! But I want to send two or more position or value to javascript function, for example send this value:

45.123321,35.123345
35.123321,45.123321
45.123456,34.123454

and mark all point on the map. How can I do this?Notice:Up value must send with asp button event to function,i have down code:

String[,] myArr = new String[4, 1];
            myArr[0, 0] = "45.123321";
            myArr[1, 0] = "35.454345";
            myArr[2, 0] = "20.123321";


how can i send up array to function?

function initialize(markersData) {
           var mapProp = {
               center: new google.maps.LatLng(x, y),

               zoom: 5,
               mapTypeId: google.maps.MapTypeId.ROADMAP
           };
           myCenter: center;
           var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
          for(var i=0;i<markersData.length;i++){
          var marker = new google.maps.Marker({
               position: new google.maps.LatLng(markersData[i,0], markersData[i,1]),
               animation: google.maps.Animation.BOUNCE
           });
           marker.setMap(map);
          }
       }


initialize(markersData);

in C# decalre you array like this

// ... Create 2D array of strings.
float[,] markersData= new flaot[,]
{
   {45.123321,35.123345},
   {35.123321,45.123321},
   {45.123456,41.123454}
};

    Page.ClientScript.RegisterStartupScript(this.GetType(), "beh", "isButtonClick=true;initialize(markersData);", true);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM