Planetary.jsの位置に画像を配置

Question

プラグイン@ planetaryjs.com（& d3）を使用して、地球儀をスクリーンに描画しています。 チュートリアルでは、キャンバスコマンドを使用して特定の場所に "ping"を追加する方法を紹介します...

しかし、私は特定のlat/lngに画像を追加したいと思います。だから、それは惑星と一緒に回転しているようです...

残念ながら私は迷っています - 私はSVGとPNG画像をインポートしようとしましたが、それらを '2d'惑星と共に回転する。

誰でもこの機能を利用するためのプラグインまたは開始点を提案できますか？

Answer 1

私は、何も存在しない、ちょうどこのような何かのために、すべてのウェブ上で探していたので、私はそれはまだgithubの上で更新されているが、基本的な骨子があるplanetary.js

で直接動作するプラグインを作りましたこの。 主なplanet.projection（）を使用して、lat、lngを投影座標に変換します。

ここでは基本的な使い方を示します。上記

var coords = planet.projection([(object.lng), object.lat]) 
var img = new Image() 
img.src = "/char.png"; 

var geoangle = d3.geo.distance([object.lng, object.lat],[- 
planet.projection.rotate()[0], -planet.projection.rotate()[1]]); 

//geo angle = radians (around 90 degrees) 
if (geoangle > 1.57079632679490) 
{ 
    //Behind Sphere > 90 degrees 
} else { 
    context.drawImage(img, coords[0] ,coords[1], 50 ,50) 
} 

私が作ったプラグインからの抜粋であり、Iは、本質的にすでに存在し、その代わりにオブジェクト/画像を作成するためにコードを変更し、「ピング」プラグインをコピーしました。

ギブスレポへのリンク：https://github.com/Sheaffy/planetary.js-add-objects-plugin