問題タブ [panoramas]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
4987 参照

algorithm - 360度の球体パノラマから立方体パノラマへの変換アルゴリズム(擬似コードまたは少なくとも完全なロジックが必要)

だから私たちはウィキペディアからそのような画像 代替テキストを取り 、将来のキューブまたはキューブのようなもののためにそれをマッピングしようとする ことができます代替テキスト 代替テキスト

そして、上下のように歪むよりも 代替テキスト

一部の人は、半分だけ気を散らすことをし、それを埋めるために試みるよりもうまくいくと思うかもしれません 代替テキスト

それはありません=(そしてコンテンツを意識した塗りつぶしはその正方形を塗りつぶすのに役立ちません=(

しかし、そのような立方体のパノラマをレンダリングしようとすると、見栄えが悪くなります。

私が想像できるもう1つの方法は、3Dパノラマを球体にレンダリングし、それを立方体にスナップショット/投影することです...しかし、簡単な数学操作でそれを書き留める方法がわかりません(ここでのアイデアはレンダリングエンジンを使用しないことです)しかし、可能な限り数学的にそれを行うために)

0 投票する
1 に答える
707 参照

jquery - .draggable()とさまざまなサイズの画像の変更に関する問題

小さいdivの画像(.draggable)をドラッグできるようにしながら、jQueryで「ズーム」機能(大きい画像をロード)を実行しようとしています。しかし、私はわずかな問題にぶつかりました。

最大ズーム(最初の画像よりも高さが約300px +、幅が1600px +の3番目の画像)に到達し、右下隅に移動してズームアウトを開始すると、その状態に陥ります。画像自体が小さくなり、白い空きスペースができているのを見ると、コーナーが表示されます。その後、画像は(いわば)ドラッグできなくなります。

しかし、置き換えている画像に.css({'left': '0px'、'top': '0px'})を追加すると、左上に戻り、必要なものをすべてドラッグできます。しかし、明らかに私はズームインしたい場所にとどまりたいと思っています。

(投稿の下のコード) "containment:[data]"を "containment:" parent "に変更すると、ズームインおよびズームアウトした特定の領域に「滞在」できますが、それでも隅に落ちたときの白い空の領域(ただし、画像をもう一度ドラッグすることはできます)と、それが滑らかなパノラマではなくなったという犠牲を払って、もう端にスナップしたような感じになります。

これを回避する簡単な方法はありますか?そして、これはとにかく私の種類の問題に対する良い解決策ですか、それともこの種のものを達成するためのより良い方法がありますか?.animate()を使用して、1つの画像を大きくしようとしましたが、最終的には同じ問題が発生します。

-

どんな種類の入力にも感謝します。

注文どおり、デモ:http: //miyao.eu/zoomzoom/

0 投票する
2 に答える
328 参照

algorithm - 仮想パノラマ シーンを事前にレンダリングする方法はありますか?

写真のようにリアルな仮想シーンをタブレットに配置して、ユーザーがタブレットを回転させたときに、タブレットが仮想世界へのウィンドウであるかのように表示したいと考えています。

事前にレンダリングされたシーンは写真のようにリアルにレンダリングできますが、リアルタイム レンダリングには「コンピュータで作成された外観」があります。1 つのシーンで、POV を回転させることはできるが、空間内で平行移動させることはできないと仮定すると、事前にレンダリングされた仮想パノラマ シーンが没入型の印象を与える可能性はありますか?
視点を回転させると何らかの歪みが生じるため、これは簡単ではないと思います。この種の歪みは、Starwalk などのアプリでは簡単ですが、写真では困難です。誰かが私に方向性を指摘できますか?

一方向のみの動きを制限するのは非常に簡単ですが、ユーザーには完全な 3D 体験をしてもらいたいと思います。

0 投票する
0 に答える
2254 参照

c# - 正距円筒図法のパ​​ノラマをレンダリングしようとしています

経度 360 度、緯度 120 度の正距円筒パノラマ ソース画像があります。

ビューポートの幅と高さ、および経度の回転を指定して、これをレンダリングできる関数を書きたいと思います。高さが完全に120度になるように、出力画像を作成したいと思います。

誰かがポインタを持っていますか?ターゲット座標からソースに変換する方法について、数学に頭を悩ませることはできません。

ありがとう

スリップ

これまでの私のコードは次のとおりです:- (ac# 2.0 コンソール アプリを作成し、system.drawing に ref を追加します)

私が使用しているソース画像

このコードを使用すると、ターゲット イメージの幅を 120 度に設定したときに期待どおりの結果が得られます。以下のように、水平線などの正しい曲率が表示されます。実際の正距円筒図法で試してみると、商用ビューアーがレンダリングしたように見えます。 120度×120度の正しい出力

しかし、出力画像を広くすると、すべてうまくいきません。幅 150 度、高さ 120 度の画像で示されているように、中央の上部と下部に無効なピクセルが見られます。

ここに画像の説明を入力

コマーシャルの視聴者が行うように見えるのは、一種のズームインです。つまり、中央の画像は 120 度の高さであり、したがって、側面ではより多くが切り取られます。したがって、マゼンタはありません (つまり、無効なソース ピクセルはありません)。

しかし、私は数学でそれを行う方法について頭を悩ませることができません。

これは宿題ではなく、趣味のプロジェクトです。したがって、なぜ私は何が起こっているのかを理解していないのです!. また、コードの深刻な非効率性をご容赦ください。適切に動作するようになったら最適化します。

再度、感謝します

0 投票する
1 に答える
940 参照

c# - パノラマと画像の配列

ですから、私は助けが必要なコーディングの問題を抱えており、簡単に言えば、これで何をしているのかわかりません。参考までに、ジェスチャーリスナーでツールキットを使用していません。

BigImageCenter、BigImageLeft、BigImageRightの3つのパノラマアイテムを含むパノラマページがあります。

私のアプリケーションには、アプリと一緒にダウンロードされる画像の束があります。このパノラマページの目標は、ページの下部にスクロールビューアを設定して、アプリに付属する画像のリスト全体を小さなサムネイルで表示し、ページの上部をパノラマアイテムにすることです。画像を左または右にフリックすると、リストが整然と進みます(または左にフリックした場合は戻ります)。

また、下部のスクロールビューアでサムネイルの1つをタップすると、現在のパノラマ画像がそのサムネイル画像に置き換えられます。パノラマページを左または右にフリックすると、そのサムネイル画像の配列に-1または+1が表示されます。

ページに最初に表示される画像はBigImageCenterです。

3つのパノラマアイテムを使用する必要はなく、1つで解決できる可能性があります。ただし、1つでテストする場合は、サムネイルをクリックしてパノラマを左右にスワイプして画像を変更した後、次の画面に読み込まれる画像は、変更される前は常に同じ画像です(次の画像を動的に変更するための配列をコーディングしていないため、意味があります)。

ただし、次のいずれかを実行する方法がわかりません。

1)パノラマアイテムの最初の画像がXに設定されている配列を作成します。2)ユーザーが配列の-1または+1に左または右にフリックしたかどうかを確認します。3)サムネイル画像を設定して、現在のパノラマ画像を置き換えます。タップしてから、配列をそのサムネイル画像の位置にスローします。

パノラマコントロールとサムネイルスクロールビューアの両方のXAMLは次のとおりです。

....など

今、私はいくつかのことをしましたが、私が望む方法ではありません:

MouseLeftButtonUp = "smallImage_Tap"は、「BigImageCenter」のパノラマアイテムを長方形の現在のimage.fillに変更する関数です。ビュー内の現在のピボットアイテムを変更するようにコーディングすることはできません。それについて助けが必要です。

なぜ長方形を使用しているのか疑問に思われるかもしれませんが、小さいサムネイルをタップするときに、コードを後ろに置いて画像を変更するのが最も簡単な方法でした。

そして、それはほとんど私のコードビハインドです。私は文字通りこの動的コーディングをゼロから行っており、この夢を実現するためにいくつかの助けが必要です。

PS:ユーザーが画像を「お気に入り」にして別のページに配置できるように、画像に関連付けられている配列番号も知っておく必要があります。

0 投票する
1 に答える
1334 参照

ios - サファリ HTML5 パノラマを構築するためのチュートリアル?

Apple のテクノロジー デモで提示されているような HTML5 ベースの VR パノラマを構築するためのチュートリアルはありますか? VR効果を再現するための検索結果やチュートリアルが非常に少ないので質問しています。リンクは次のとおりです。

VRデモ

0 投票する
1 に答える
549 参照

ios - CoreAnimationを使用したキュービックパノラマ投影。出来ますか?

キュービックパノラマ用のネイティブビューアを作成しようとしています。これが私が達成したいことのウェブ版です:http://www.apple.com/html5/showcase/vr/

このタイプの投影は次のように機能します。パノラマは、立方体の内面に投影される6つの正方形の画像で構成されます。カメラは立方体の中央に配置されます。

現在、私は6つのCALayersを使用しており、それらを3D空間に配置して立方体を形成しています。それらの回転は、CATransform3DMakeTranslationなどを使用して正常に機能します。

問題は、CALayersが後ろから見たときに透明ではないことです(前面と同じ画像が表示されます)。ビューがキューブの他のレイヤーによってブロックされているため、ユーザーはキューブ内の投影を見ることができないため、これは最悪です。

この問題の解決策はありますか?私は次のことを考えることができます:a。)Core Animationには、後ろから見たときにレイヤーを透明にする設定があるのでしょうか?b。)現在のビューの方向を継続的に追跡し、ビューをブロックするCALayersを手動で非表示に設定します。

これを解決するための最良の解決策は何でしょうか?

0 投票する
1 に答える
916 参照

javascript - Android: Javascript でパノラマ画像のループ Horizo​​ntalScrollView を作成する

パノラマ画像をスクロール可能にし、ユーザーが画像の最後に到達した後、ループバックして前面を背面に「ステッチ」したいと考えています。

私が再作成しようとしている効果は、無限の水平スクロールを作成しようとしている - できれば jquery プラグインを使用するで見つかった効果と一致しています。

唯一の問題は、Android で実行しているため、Javascript である必要があることです。

助言がありますか?

0 投票する
3 に答える
973 参照

google-maps - グーグルストリートビュー埋め込み

ページ内の特定の住所のストリート ビュー パノラマを Google マップに埋め込むことは可能ですか?

私が遭遇したすべてのコードは調整で機能します。「アドレス」を探しています。調整を使用するだけの場合は、pov などを設定する必要があるため、

Googleはそれ自体を行っているようです。ここのパノラマ写真を見てください:

http://maps.google.ca/maps/place?hl=en&sugexp=kjrmc&cp=10&gs_id=z&xhr=t&biw=1680&bih=874&gs_upl=&bav=on.2,or.r_gc.r_pw.,cf.osb&um=1&ie=UTF -8&q=toyota+calgary&fb=1&gl=ca&hq=toyota&hnear=0x537170039f843fd5:0x266d3bb1b652b63a,Calgary,+AB&cid=16440335169618939517&ei=VpqYTpPsLbCrsALi0LnqBA&sa=X&oi=local_result&ct=map-marker-link&resnum=1&sqi=2&ved=0CF8QrwswAA

ありがとう

0 投票する
3 に答える
5569 参照

javascript - 球体パノラマ?

Photoshop で球状パノラマを作成しました。これをドラッグして完全な 360 ビューを表示できますが、Photoshop を使用する必要があります。ユーザーがJavaScriptを使用してビューをクリックしてドラッグできるように、それをWebに転送するにはどうすればよいですか? (私は Flash Professional CS 5.5 にアクセスできますが、そのプログラムがこのアプリケーションに適しているかどうか、使用した経験はありません) また、サーバー側のスクリプトは使用できないことに注意してください。クライアント側のスクリプトのみを使用してください

編集- 私が探している無料のプログラムまたは JavaScript ベースのバージョンがある場合。画像に透かしを入れる有料プログラムや無料プログラムは避けたいと思います。メイン画像下の簡単なクレジットは構いません。