prompt: フラクタルあるいはLシステムを利用し3次元木（できたら葉っぱ付き）を複数生成し描画するコードをｈｔｍｌとJavaScriptでかけ。見る方向はマウスで制御してください。

L-システムを使った3次元フラクタル木の生成器を作成しました！ 主な機能
L-システム（Lindenmayer System） 4種類の異なる木のパターン（基本木、複雑な木、茂った木、柳の木） 文字列の置換ルールで木の構造を定義 反復回数で複雑さを制御
3次元表現 Three.jsを使用した本格的な3D描画 円筒形の枝で立体的な木を表現 枝の太さは深度に応じて変化
インタラクティブ機能 マウスドラッグで視点回転 マウスホイールでズーム リアルタイムパラメータ調整（反復回数、角度、長さ比率）
視覚効果 風で揺れる葉っぱアニメーション 影とライティング 複数の木を森のように配置 葉っぱの表示/非表示切替
操作方法 マウスで視点を自由に回転させて木を観察 左上のコントロールパネルでパラメータを調整 「新しい森を生成」ボタンで異なる配置の森を作成 「L-システム変更」ボタンで異なる木の形状パターンに切替 各木は微妙に異なる角度とランダム要素で生成されるため、自然な森の雰囲気を演出しています。

葉っぱの大幅増量 密度向上: 各葉っぱ位置に5-8枚の葉っぱを配置（従来は3枚） 配置拡張: 枝の先端だけでなく、枝の途中にも葉っぱを配置 確率向上: 葉っぱ生成確率を30%から60%に増加 バリエーション: 3種類の異なる緑色マテリアルでより自然な見た目 サイズ変化: 各葉っぱのサイズにランダムなバリエーション 広範囲散布: より広い範囲に葉っぱを散らして自然な茂み感を演出
木の本数制御 スライダー追加: 1本から150本まで自由に指定可能 グリッド配置: 木の数に応じて自動的にグリッド配置 ランダム要素: 各木の位置、角度、サイズ、比率にバリエーション スケール調整: 木の数が多い場合も見やすいよう自動的にカメラ距離を調整
パフォーマンス最適化 効率的配置: グリッドベースの配置で重複を避ける 地面拡張: より大きな地面で多数の木に対応 ズーム範囲拡張: より広範囲のズームに対応 これで茂った葉っぱの美しい森を150本まで生成できます。木の本数を変更すると即座に反映され、大規模な森の景観も楽しめます！

ウィンドウサイズ固定 700x450ピクセルに固定 レスポンシブ機能を削除してシンプルに
地面の大幅強化 草原: メインの緑の地面 土壌: 下層に茶色の土を配置 岩石: ランダムに配置された20個の石 草クラスター: 50本の小さな草で自然感をアップ 影の追加: 岩が地面に影を落とす
コントロールパネルの最適化 縦長・コンパクト: 幅120pxの縦長レイアウト 小さなフォント: 9-11pxで画面を占有しない ボタン縮小: 「森を生成」「葉っぱ切替」「木変更」に短縮 透明度向上: 背景透明度を上げて木が見やすく
インターフェース改善 情報パネル簡潔化: 「マウス：回転」など短縮表示 レイアウト調整: 左上と左下にコンパクトに配置
これで木々がよく見える状態で、豊かな地形の上に美しい森を楽しめます！