2016-05-31 20 views
0

私は多角形を描画する単純なマップを持っています。次に、ユーザーがポリゴンをクリックし、そのポリゴン(たとえば、ポリゴンのカスタムIDなど)のハンドルを取得する場合にキャプチャします。iOSのti.mapでポリゴンをクリックする方法を教えてください。

私はポリゴンを追加するには、このようなコードを使用する:pointsは、緯度/経度オブジェクトの配列である

var poly = Map.createPolygon({ 
     points : points, 
     id : 'poly', 
     fillColor : '#55ec858f', 
     strokeColor : 'black', 
     strokeWidth : 2 
    }); 
    mapView.addPolygon(poly); 

。私は、クリックハンドラ登録している:

mapView.addEventListener('click',clickHandler); 

を...、次のように定義されています。私はポリゴン内をクリックしたら、クリックハンドラがトリガされる

function clickHandler(e){ 
    console.log("click: id=" + e.source.id + ", source=" + JSON.stringify(e.source)); 
    console.log("click: clicksource=" + e.clicksource + ", latitude=" + e.latitude + ", longitude=" + e.longitude); 
} 

(まあ、より正確に、それがトリガーされますどこでもをクリックしてください)。これは問題ありません。しかし、iOSでは、ユーザーがクリックしたポリゴンを特定できません。出力は次のようになります。

[INFO] : click: id=poly, source={"fillColor":"#55ec858f","strokeColor":"black","points":[{"latitude":55.563299,"longitude":11.157998},{"latitude":55.562731,"longitude":11.157987},{"latitude":55.562719,"longitude":11.158029},{"latitude":55.562648,"longitude":11.158027},{"latitude":55.562153,"longitude":11.157851},{"latitude":55.561301,"longitude":11.157834},{"latitude":55.561088,"longitude":11.157913},{"latitude":55.560212,"longitude":11.157896},{"latitude":55.560106,"longitude":11.157935},{"latitude":55.559751,"longitude":11.157928},{"latitude":55.559515,"longitude":11.157882},{"latitude":55.559267,"longitude":11.157731},{"latitude":55.559184,"longitude":11.15775},{"latitude":55.559018,"longitude":11.15783},{"latitude":55.558899,"longitude":11.157953},{"latitude":55.558686,"longitude":11.157928},{"latitude":55.558604,"longitude":11.157864},{"latitude":55.558391,"longitude":11.157859},{"latitude":55.558143,"longitude":11.157834},{"latitude":55.557694,"longitude":11.157804},{"latitude":55.557233,"longitude":11.15769},{"latitude":55.556985,"longitude":11.157623},{"latitude":55.556678,"longitude":11.157513},{"latitude":55.556266,"longitude":11.157317},{"latitude":55.556041,"longitude":11.157291},{"latitude":55.555828,"longitude":11.157245},{"latitude":55.555592,"longitude":11.157157},{"latitude":55.555144,"longitude":11.156961},{"latitude":55.554779,"longitude":11.156786},{"latitude":55.554507,"longitude":11.156677},{"latitude":55.554401,"longitude":11.156675},{"latitude":55.554366,"longitude":11.156632},{"latitude":55.554385,"longitude":11.156451},{"latitude":55.554447,"longitude":11.155964},{"latitude":55.554525,"longitude":11.155484},{"latitude":55.554621,"longitude":11.155014},{"latitude":55.554733,"longitude":11.154556},{"latitude":55.554862,"longitude":11.154111},{"latitude":55.555005,"longitude":11.153681},{"latitude":55.555164,"longitude":11.153268},{"latitude":55.555337,"longitude":11.152873},{"latitude":55.555524,"longitude":11.152498},{"latitude":55.555724,"longitude":11.152145},{"latitude":55.555936,"longitude":11.151815},{"latitude":55.556159,"longitude":11.151509},{"latitude":55.556393,"longitude":11.151228},{"latitude":55.556636,"longitude":11.150974},{"latitude":55.556887,"longitude":11.150747},{"latitude":55.557147,"longitude":11.150549},{"latitude":55.557412,"longitude":11.150379},{"latitude":55.557684,"longitude":11.15024},{"latitude":55.557959,"longitude":11.150131},{"latitude":55.558238,"longitude":11.150053},{"latitude":55.55852,"longitude":11.150006},{"latitude":55.558802,"longitude":11.14999},{"latitude":55.559084,"longitude":11.150006},{"latitude":55.559366,"longitude":11.150053},{"latitude":55.559645,"longitude":11.150131},{"latitude":55.55992,"longitude":11.15024},{"latitude":55.560192,"longitude":11.150379},{"latitude":55.560457,"longitude":11.150549},{"latitude":55.560717,"longitude":11.150747},{"latitude":55.560968,"longitude":11.150974},{"latitude":55.561211,"longitude":11.151228},{"latitude":55.561445,"longitude":11.151509},{"latitude":55.561668,"longitude":11.151815},{"latitude 
[INFO] : click: clicksource=polygon, latitude=55.55844486621942, longitude=11.154376566410065 

id私は、関連するデータを取得する(といくつかのより多くのユーザに示すことができて、本当に十分です:Androidのオン

[INFO] : click: id=undefined, source={"horizontalWrap":true,"visible":true,"mapType":1,"rotateEnabled":false,"region":{"longitudeDelta":0.010248234495520592,"latitudeDelta":0.009999999776482582,"longitude":11.154247283935547,"latitude":55.55887985229492}} 
[INFO] : click: clicksource=polygon, latitude=55.55712556278878, longitude=11.154479577247997 

は私が欲しいものを手に入れますエリアの詳細)。

私はポリゴンにイベントハンドラを追加しようとしました - (私は上記の例のようにグローバルイベントリスナーを使用したいと本当に)が、それは動作しません。

私はまだ試していない唯一のことは、GPSポイントに基づいて私が内部にあるポリゴンを計算しようとしていることだと思います...私はそのような幾何学的計算には本当にうまくいかないので、可能であれば道;-)

いいアイデアはありますか?

ありがとうございます!

編集:

プラットフォームを言及するのを忘れた...

Appc CLI 5.1.0 
Studio: 4.4.0 
ti.map: 2.3.6 (Android) 
ti.map: 2.5.2 (iOS) 

/ジョン・

答えて

0

あなたは私e.shape.title

を使用することができますそれは次のようになります:

map.addEventListener('click', function(e) { Ti.API.info('You clicked ' + JSON.stringify(e.shape.title)); });

私はe.shapeで利用可能なものを覚えてすることはできませんが、私はあなたがあなたのポリゴンを識別するためのID、または他の何かを見つけることができる必要がありますね。

+0

ありがとうございます!それは動作します。ポリゴンに自分のプロパティを追加することができますので、右のハンドルを取得するのは簡単です:-)私はこの問題を回避する別の解決策を見つけました。ジオデータを扱うために 'Turf'を使い、ポイントがポリゴンの1つに入っているかどうかを調べるために使っています。しかし、これはきれいです;-) –

関連する問題