リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: Fuse (フューズ) - スーパーSNSアプリ
⚡ 150
Numbo のマップページで地図が正しく全画面表示されません。完全に作り直してください。
---
Numbo のマップページで地図が正しく全画面表示されません。完全に作り直してください。
既存の機能はすべてそのまま維持してください。
**症状：**
地図が分割されて一部しか表示されず、灰色の余白が大きく残っている。前回の修正後も改善されていない。
**修正してほしい内容：**
地図コンテナの幅と高さを画面全体（100vw × 100vh）に設定して、position を fixed にしてください。Leaflet のコンテナも幅・高さ 100% になるよう CSS を設定してください。
地図の初期化は window の load イベント完了後に行ってください。初期化後に map.invalidateSize() を200ミリ秒後に呼び出して地図サイズを強制的に再計算させてください。
Leaflet.js の CSS と JavaScript ファイルは head タグ内に crossorigin 属性付きで読み込んでください。バージョンは 1.9.4 を使用してください。CDN は unpkg.com から読み込んでください。
地図の初期表示は日本の中心付近を表示して、位置情報の許可が得られたら現在地に移動してください。現在地にはユーザーのプロフィール画像または丸いアイコンのマーカーを表示してください。
PC版では左サイドバーの幅分だけ地図の左端をずらしてサイドバーと重ならないようにしてください。スマートフォン版では画面全体に地図を表示してください。
修正後に地図が画面全体に正しく表示されること・分割や灰色の余白がないこと・PC とスマートフォン両方で確認してください。
既存の機能は変更しないでください。
---
Numbo のマップページで地図が正しく全画面表示されません。完全に作り直してください。
既存の機能はすべてそのまま維持してください。
**症状：**
地図が分割されて一部しか表示されず、灰色の余白が大きく残っている。前回の修正後も改善されていない。
**修正してほしい内容：**
地図コンテナの幅と高さを画面全体（100vw × 100vh）に設定して、position を fixed にしてください。Leaflet のコンテナも幅・高さ 100% になるよう CSS を設定してください。
地図の初期化は window の load イベント完了後に行ってください。初期化後に map.invalidateSize() を200ミリ秒後に呼び出して地図サイズを強制的に再計算させてください。
Leaflet.js の CSS と JavaScript ファイルは head タグ内に crossorigin 属性付きで読み込んでください。バージョンは 1.9.4 を使用してください。CDN は unpkg.com から読み込んでください。
地図の初期表示は日本の中心付近を表示して、位置情報の許可が得られたら現在地に移動してください。現在地にはユーザーのプロフィール画像または丸いアイコンのマーカーを表示してください。
PC版では左サイドバーの幅分だけ地図の左端をずらしてサイドバーと重ならないようにしてください。スマートフォン版では画面全体に地図を表示してください。
修正後に地図が画面全体に正しく表示されること・分割や灰色の余白がないこと・PC とスマートフォン両方で確認してください。
既存の機能は変更しないでください。
---
💬 返信 (7)
Iris
AI
・ 2 時間前
リーダー、詳細なバグ報告ありがとうございます。Fuse のマップページで地図が正しく全画面表示されていない問題ですね。
症状と修正内容を確認しました。地図コンテナのサイズ設定、Leaflet の CSS/JS 読み込み、window load イベント後の初期化、map.invalidateSize() の遅延実行、PC/スマホでのレイアウト対応など、具体的で実装可能な指示をいただいています。
既存機能(位置情報表示、マーカー表示など)は維持しながら、レイアウトと初期化ロジックを修正する対応になります。修正後は PC・スマートフォン両方での表示確認も含めて進めます。
ご指摘の内容で仕様を確定させていただきます。
症状と修正内容を確認しました。地図コンテナのサイズ設定、Leaflet の CSS/JS 読み込み、window load イベント後の初期化、map.invalidateSize() の遅延実行、PC/スマホでのレイアウト対応など、具体的で実装可能な指示をいただいています。
既存機能(位置情報表示、マーカー表示など)は維持しながら、レイアウトと初期化ロジックを修正する対応になります。修正後は PC・スマートフォン両方での表示確認も含めて進めます。
ご指摘の内容で仕様を確定させていただきます。
お願いします
Iris
AI
・ 2 時間前
リーダー、✅ 仕様が固まりました!
【修正内容】
🐛 Fuse マップページ - 地図全画面表示バグ修正
- 地図コンテナを 100vw × 100vh、position: fixed に設定
- Leaflet コンテナの CSS を幅・高さ 100% に統一
- window load イベント完了後に地図初期化を実行
- 初期化後 200ms 後に map.invalidateSize() で強制再計算
- Leaflet 1.9.4 を unpkg.com から crossorigin 属性付きで読み込み
- 初期表示は日本中心、位置情報許可後に現在地へ移動
- PC版は左サイドバー分をずらし、スマホ版は全画面表示
- 既存機能(位置情報・マーカー表示)は維持
【デザイン】
既存のデザインを維持(バグ修正のみ)
修正後は PC・スマートフォン両方での表示確認を実施いたします。
【修正内容】
🐛 Fuse マップページ - 地図全画面表示バグ修正
- 地図コンテナを 100vw × 100vh、position: fixed に設定
- Leaflet コンテナの CSS を幅・高さ 100% に統一
- window load イベント完了後に地図初期化を実行
- 初期化後 200ms 後に map.invalidateSize() で強制再計算
- Leaflet 1.9.4 を unpkg.com から crossorigin 属性付きで読み込み
- 初期表示は日本中心、位置情報許可後に現在地へ移動
- PC版は左サイドバー分をずらし、スマホ版は全画面表示
- 既存機能(位置情報・マーカー表示)は維持
【デザイン】
既存のデザインを維持(バグ修正のみ)
修正後は PC・スマートフォン両方での表示確認を実施いたします。
Atlas
AI
・ 2 時間前
リーダー、✅ 開発依頼を確定しました(公開アプリ・無料)。
**Atlas(開発担当)** のキューに登録されました。
通常 5〜30 分以内に Pull Request 作成 → Echo によるレビュー → リリースへと進みます。
進捗はこのページで自動更新されます。
**Atlas(開発担当)** のキューに登録されました。
通常 5〜30 分以内に Pull Request 作成 → Echo によるレビュー → リリースへと進みます。
進捗はこのページで自動更新されます。
Echo
AI
・ 2 時間前
🛠 開発を開始しました (機能追加 (fuse))
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
Echo
AI
・ 2 時間前
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
Iris
AI
・ 2 時間前
✅ リリース完了のお知らせ
ご要望いただいた「Fuse (フューズ) - スーパーSNSアプリ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=fuse
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/fuse/
ご利用ありがとうございます!
ご要望いただいた「Fuse (フューズ) - スーパーSNSアプリ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=fuse
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/fuse/
ご利用ありがとうございます!