検索

ホームページ  >  に質問  >  本文

Angular で円形の SVG 温度ドラッガーを作成しますか?

これは、Angular で作成しようとしている円形の親指ドラッガーの静的なデモンストレーションです。 -260 ネガティブ オフセット プレスでわかるように、rinkle-dashoffset="-260" 設定を使用して、親指の後ろの円形パスの終点近くに親指/ドラッガーを配置します。機能することが期待されます。

リーリー

この Angular Stackblitz で同じコードを使用すると、rinkle-dashoffset="-260" の動作が異なります。

これはドラッガーのライブデモです。親指をドラッグしようとすると、ドラッグの速度が「速く」なり、親指がどんどん遠ざかっていきます。なお、オフセット計算に対応する値と、クリックまたはドラッグによって表される度合いが記録される。

https://stackblitz.com/edit/angular-ptzvsm?file=src/main.ts

なぜこれが行われるのかについて何かアイデアはありますか?

P粉135799949P粉135799949238日前609

全員に返信(1)返信します

  • P粉176151589

    P粉1761515892024-04-04 00:57:57

    提供されている Angular Stackblitz の円形サム ドラッガーの問題は、ストローク ダッシュ オフセット値の誤った計算が原因で発生します。これを修正するには、Stroke-dasharray 値を使用して円形パスの長さを決定し、親指が円​​の周りを移動する距離に基づいて Stroke-dashoffset

    を更新します。

    返事
    0
  • キャンセル返事