1

私はWebデザインと開発が初めてです。Reebok のサイトリンクはこちらで行っているように、靴をカスタマイズするための UI のデザインにこだわりました。

Webで検索してみましたが、何を検索すればいいのかわかりません。それでも私は何かを手に入れました（上記のリンクを参照）

  • 実際の回転は、異なる角度の 20 枚の画像があり、(マウス) カーソルの動きで変化します。
  • アイテムのさまざまなセクションに画像をマッピングし、そのマッピングに色を適用することで、色のカスタマイズを追求します。

実装したい機能は次のとおりです。

  • アイテム（画像）の色はカスタマイズ可能でなければなりません。
  • アイテム（画像）はカーソルの動きを基準に回転する必要があります。
  • アイテム (画像) のマッピング カラーは、その領域に固執する必要があります。

どんな助けでも大歓迎です..事前に感謝します。

4

1 に答える 1

2

イメージ マップ ベースのように見えます。ここから「Fluid Retail」という会社の製品を使用しているようです。

http://www.fluidretail.com/solutions-overview/product-configurators/

アップデート

もし私がゼロからこれを書いていたとしたら、今のところローテーションの側面を無視して、最初に色のカスタマイズのビットを正しくすることに集中するでしょう.

製品の SVG バージョンがあれば、それが出発点として適しています。

次に、 SVG をイメージ マップに変換するか、Rachel JSで同等の処理を行うことができます。多くの JavaScript カラー ピッカーがあり、そのうちの 1 つを製品画像カスタマイズ ツールに統合できます。

色の選択を読み取って記憶するコードを実装すると、製品画像の別の表示への移行が実現可能になります。

ImageMapsterのようなイメージ マップ JavaScript ライブラリも役に立ちます。

于 2013-05-29T10:12:22.497 に答える