mapbox-web-integration-patterns 是做什麼的?
Mapbox GL JS 在主流網頁框架(React、Vue、Svelte、Angular)中的官方整合模式。涵蓋設定、生命週期管理、Token 處理、搜尋整合及常見陷阱。基於 Mapbox 的 create-web-app 脚手架工具。
Mapbox GL JS 在主流網頁框架(React、Vue、Svelte、Angular)中的官方整合模式。涵蓋設定、生命週期管理、Token 處理、搜尋整合及常見陷阱。基於 Mapbox 的 create-web-app 脚手架工具。
此技能提供 Mapbox GL JS 在 React、Vue、Svelte 和 Angular 等現代網頁框架中的官方整合模式。開發者可以透過它學習如何正確設定地圖、管理元件生命週期(避免記憶體洩漏或重複渲染)、安全處理 Access Token、整合地理編碼搜尋功能,並避開常見的實作誤區。技能內容基於 Mapbox 官方推出的 create-web-app 脚手架工具,確保模式最佳且與最新 API 相容。它支援多種框架,但核心原則保持一致,讓團隊能在不同專案間統一開發風格。無論是初次整合地圖或是想要優化現有實作,這份指南都能節省大量除錯與試錯時間。
npx skills add https://github.com/mapbox/mapbox-agent-skills/tree/main/skills/mapbox-web-integration-patternsInstalled? Explore more 生產力與協作 skills: steipete/gemini, steipete/gh-issues, steipete/skill-creator · View all 6 →
Mapbox GL JS 在主流網頁框架(React、Vue、Svelte、Angular)中的官方整合模式。涵蓋設定、生命週期管理、Token 處理、搜尋整合及常見陷阱。基於 Mapbox 的 create-web-app 脚手架工具。
This repo contains 8 individual skills — each has its own dedicated page.
Expert guidance on map design principles, color theory, visual hierarchy, typography, and cartographic best practices for creating effective and beautiful maps with Mapbox. Use when designing map styles, choosing colors, or making cartographic decisions.
Patterns for visualizing data on maps including choropleth maps, heat maps, 3D visualizations, data-driven styling, and animated data. Covers layer types, color scales, and performance optimization.
Expert guidance on choosing the right geospatial tool based on problem type, accuracy requirements, and performance needs
Complete workflow for implementing Mapbox search in applications - from discovery questions to production-ready integration with best practices
Common style patterns, layer configurations, and recipes for typical mapping scenarios including restaurant finders, real estate, data visualization, navigation, delivery/logistics, and more. Use when implementing specific map use cases or looking for proven style patterns.
Expert guidance on validating, optimizing, and ensuring quality of Mapbox styles through validation, accessibility checks, and optimization. Use when preparing styles for production, debugging issues, or ensuring map quality standards.
Security best practices for Mapbox access tokens, including scope management, URL restrictions, rotation strategies, and protecting sensitive data. Use when creating, managing, or advising on Mapbox token security.
Performance optimization patterns for Mapbox GL JS web applications. Covers initialization waterfalls, bundle size, rendering performance, memory management, and web optimization. Prioritized by impact on user experience.
Gemini CLI one-shot prompts, summaries, generation, skills, hooks, MCP, or Gemma routing.
Fetch GitHub issues, select candidates, spawn background fix agents, open PRs, and optionally process PR review comments.
Create, edit, audit, tidy, validate, or restructure AgentSkills and SKILL.md files.
Search, install, update, sync, or publish agent skills with the ClawHub CLI and registry.
Delegate coding work to Codex, Claude Code, or OpenCode as background workers; not simple edits or read-only code lookup.
List, configure, authenticate, call, and inspect MCP servers/tools with mcporter over HTTP or stdio.