javascript - MVC asp.net 中 Google Map Api 上的多个标记

Question

我正在使用 Asp.net MVC 开发一个 Web 应用程序，我需要在 Google Maps Api JavaScript 上添加多个标记。

在 View 中，我调用一个模型，它是车辆对象的列表。

<script>



function initMap() {

    var myLatLng = { lat: 48.584715, lng: 7.748556 };

    // Create a map object and specify the DOM element
    // for display.
    var map = new google.maps.Map(document.getElementById('carte'), {
        center: myLatLng,
        zoom: 14
    });

    // Create a marker and set its position.

    @foreach(var item in Model){
         <text>
              var marker = new google.maps.Marker({
              map: map,
              position: { lat: @item.VehicleLocation.Latitude, lng: @item.VehicleLocation.Longitude },
              title: 'Hello World!'
        </text>
        }

}</script>

我使用 @foreach block 为列表中的每个对象放置一个标记。

没有这个@foreach部分，我们可以看到 map 。但是当我输入@foreach时， map 没有显示。

我不明白这个问题

如何解决？

Answer 1

由于您未关闭 google.maps.Marker(...) 调用，因此引发语法错误。

@foreach(var item in Model){
     <text>
        var marker = new google.maps.Marker({
          map: map,
          position: { lat: @item.VehicleLocation.Latitude, lng: @item.VehicleLocation.Longitude },
          title: 'Hello World!'
        });
    </text>
}

注意结束 });