2011-01-19 6 views
0

GoogleマップAPIを使用してウェディングウェブサイトを作成することで、javascriptを教えています。私はドキュメントとcopypastaの実験を通してたくさんのことを理解しましたが、これをどうやって行うのか分かりません。私がしたいのは、アイコン情報を含む外部XMLファイルです(アイコンを含むスプライトイメージの名前とオフセット)、マップマーカーを作成するときにアクセスできる配列に格納します。たとえば、受信用のマーカーを作成してアイコン「パーティー」を割り当てることができます。グーグルマップ、次のようなもので、実際の目印を作成する際に、jQueryを使用したGMaps APIの配列へのXMLの解析

 jQuery.get("markericons.xml", {}, function(data) { 
     jQuery(data).find("markericon").each(function() { 
      var icon = jQuery(this); 
      var name = icon.attr("name"); 
      var url = 'images/icons/mapsprites.png'; 
      var size = new google.maps.Size(32, 37); 
      var origin = new google.maps.Point(parseInt(icon.attr("x")),parseInt(icon.attr("y"))); 
      var anchor = new google.maps.Point((origin.x+16),origin.y); 
      var icon = new google.maps.MarkerImage(url, size, origin, anchor); 
     }); 
    }); // how to store this in an array so that I can access elements by name later? 

そして:ここで私が持っているコードは、アイコンファイルを読み込むため、これまでだ

   var marker = new google.maps.Marker({ 
       position: latlng, 
       map: map, 
       icon: icon.name=="party", // pseudo-code... how to do this? 
       title: title 
      }); 

私はまだですプログラミングのnoobので、私は助けていただければ幸いです。ありがとう!

答えて

1

あなたは(あなたがそれを可能にする方法アクセスに応じて、あなたの.each()または.get()方法の外にJSONオブジェクトを持っている必要があります私は.get()の外に推測していますので、この例ではこれを使用します)、.each()の変数からJSONオブジェクトを作成します。今

var storage = {} 
jQuery.get("markericons.xml", {}, function(data) { 
    jQuery(data).find("markericon").each(function() { 
     var icon = jQuery(this), 
      name = icon.attr("name"); 
     storage[name] = { 
      url: 'images/icons/mapsprites.png', 
      size: new google.maps.Size(32, 37), 
      origin: new google.maps.Point(parseInt(icon.attr("x")),parseInt(icon.attr("y"))), 
      anchor: new google.maps.Point((origin.x+16),origin.y), 
      icon: new google.maps.MarkerImage(url, size, origin, anchor) 
     }; 
    }); 
}); 

、あなたは名前でGoogleマップのものにアクセスすることができます。

// for this purpose, let's say `name` is "reception": 
console.log(storage.reception) 
// => prints out { url: ..., size: ..., origin: ..., anchor: ..., icon: ... } 

また、あなたのオリジナルのJSで、あなたはiconが2回宣言していたので、私はあなたがしたいものをあまりにもわからないんだけどそれでやってください。

+0

私はこの仕事をすることができると思う、ありがとう!私はそれが初めて属性を取得するために使用するXMLノードを保持しているので、2回宣言されると思います。 2回目にgoogle.maps.MarkerImageオブジェクトを保持するように再定義します。この例では明確に説明されていませんでしたが、私はそれを...から振り払いました。 – Chris4d

+0

問題はありません。変数名を変更してそれらをユニークにすることを検討したいかもしれません。あなたが最初の 'icon'を2回以上使っていないならば、これを行うこともできます:' var name = jQueryr(this).attr( 'name'); ' – hellatan