インタラクティブ図形ビジュアライザー

概要

キャンバス上で幾何学的形状を作成・操作するインタラクティブなアプリ。

プロンプト

直線、円、正方形などの幾何学的形状をユーザーが作成できるインタラクティブなキャンバス可視化アプリを作成してください。頂点と射線が見えるようにし、線分の作成も可能にします。正確な整列のためにデカルト座標のグリッドを実装してください。ユーザーは要素を削除および移動でき、交点にはユニークな名前を持つ新しい点が自動的に現れる必要があります。

## 機能
- キャンバスを使用して描画とインタラクションを実現。
- 対象は頂点と射線が見える直線、円、正方形。
- 精度と明快さを確保するためにデカルトグリッドを表示。
- クリックとドラッグで点や図形を追加・移動可能。
- ホバー時に点の名前と座標を表示。
- 要素の削除および交点での自動スナップを実装。

## ユーザー操作
- キャンバス上をクリックして点や図形を作成。
- ドラッグして要素を再配置。
- 点にマウスを合わせると名前と座標を表示。

## 実装
- 直感的に使える構造と明瞭な機能表示を目指す。
- ユーザーの操作が滑らかで応答性の高いものになるよう維持。
- シームレスでユーザーフレンドリーなインターフェースのために最善の方法を活用。

元のプロンプト

Создай визуализацию на канвасе возможности постройки прямой, окружности, квадрата, чтобы видно было вершины, лучи чтобы можно было делать. отрезки, И чтобы сетка была декартова чтобы все по сетке мелкой делалось. чтобы удалять можно было и чтобы новые ставить на пересечении появлялись новые точки с новыми названиями итд

Q: Как пользователь должен взаимодействовать с фигурами на холсте?
A: Клик для создания, перетаскивание для перемещения

Q: Какую информацию нужно отображать для точек и фигур?
A: Точки с именами, координаты при наведении

生成コストの概要

モデル名: claude-3-7-sonnet-latest

応答時間: 173.66 sec.

結果トークン: 15,610

コスト: $0.23615700