Question

google cluster marker无法使用getJSON工作。

我尝试使用以下链接中的代码：https://googlemaps.github.io/js-marker-clusterer/examples/simple_example.html

下面是我的代码片段。

    val mapped: TypedString[Int] :: TypedString[Boolean] :: HNil =
               convert[Int :: Boolean :: HNil](list)

data2.json

的内容

      import shapeless._

      trait TypedTrait {
        type TYPE
      }

      case class TypedString[U](value: String) extends TypedTrait {
        type TYPE = U
      }

      trait Convert[I <: HList, O <: HList] { def apply(i: I): O }

      object Convert extends LowPriorityConvertInstances {
        implicit val convertHNil: Convert[HNil, HNil] = new Convert[HNil, HNil] {
          def apply(i: HNil): HNil = i
        }

        implicit def convertHConsTS[TS, T <: HList, TO <: HList](implicit
                                                                  c: Convert[T, TO]
                                                                 ): Convert[String :: T, TypedString[TS] :: TO] =
          new Convert[String :: T, TypedString[TS] :: TO] {
            def apply(i: String :: T): TypedString[TS] :: TO = TypedString[TS](i.head) :: c(i.tail)
          }
      }

      sealed class LowPriorityConvertInstances {
        implicit def convertHCons[H, T <: HList, TO <: HList](implicit
                                                              c: Convert[T, TO]
                                                             ): Convert[H :: T, H :: TO] = new Convert[H :: T, H :: TO] {
          def apply(i: H :: T): H :: TO = i.head :: c(i.tail)
        }
      }


      class PartiallyAppliedConvert[O <: HList] {
        def apply[I <: HList](i: I)(implicit c: Convert[I, O]): O = c(i)
      }

      def convert[O <: HList]: PartiallyAppliedConvert[O] =
        new PartiallyAppliedConvert[O]

      val list = "Hello" :: "world" :: HNil

      val mapped: TypedString[Int] :: TypedString[String] :: HNil =
         convert[TypedString[Int] :: TypedString[String] :: HNil](list)

Answer 1

$ .getJSON是异步的。您需要在其回调函数中将标记添加到clusterer。您当前的代码会向context Menu添加一个空数组，然后在回调函数运行时填充数组（在将其添加到clusterer之后为时已太晚）。一种选择是在创建markerCluster时将每个标记添加到其中：

markerCluster

Answer 2

使用下面的代码来修复它

function initialize() {
    $.getJSON("http://example.com/data2.json", function( data ) {
        var center = new google.maps.LatLng(37.4419, -122.1419);
        var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 3,
            center: center,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });
        var markers = [];
        var infowindow;
        var markerImage = new google.maps.MarkerImage("chart.png",new google.maps.Size(24, 32));

          $.each( data, function( key, val ) {
            var dataDealers = val;
            var latLng = new google.maps.LatLng(dataDealers.field_latitude,dataDealers.field_longitude);
            var marker = new google.maps.Marker({
                position: latLng,
                icon: markerImage
            });



            google.maps.event.addListener(marker,"click",function(){
                if(infowindow)infowindow.close();
                infowindow=new google.maps.InfoWindow({content:"<h2>"+dataDealers.title+"</h1><p>"+dataDealers.body+"</p>"});
                infowindow.open(map,marker);
            });
            markers.push(marker);

          });
          var markerCluster = new MarkerClusterer(map, markers, {imagePath: 'm'});
    });
  }
  google.maps.event.addDomListener(window, 'load', initialize);

谷歌群集标记使用getJSON无法正常工作

2 个答案: