ianlkl11234s/mini-taiwan-learning-project/mini-tokyo-3d

Claude Code and agent skill by ianlkl11234s/mini-taiwan-learning-project

Trust tier 2
  • community
LLM review pending
Source check pending

Checking that the SKILL.md file is still in the repository.

Guide for integrating and customizing Mini Tokyo 3D - a real-time 3D digital map visualization of Tokyo's public transportation system. Use when building transit visualizations, embedding Tokyo train maps, or working with GTFS real-time data and Mapbox GL integration.

Install

npx vskill@latest install ianlkl11234s/mini-taiwan-learning-project/mini-tokyo-3d

SKILL.md

Mini Tokyo 3D - Integration Guide

Real-time 3D visualization of Tokyo's public transportation system including trains, subways, and aircraft.

When to Use This Skill

  • Building real-time transportation visualizations
  • Integrating Tokyo transit data into web applications
  • Creating interactive 3D map experiences
  • Working with GTFS data and live train positions
  • Developing travel or tourism applications for Tokyo

Prerequisites

Required API Tokens
  1. Mapbox Access Token - mapbox.com (Free tier: 50K/month)
  2. ODPT Token - developer-tokyochallenge.odpt.org
  3. Challenge 2025 Token - Also from ODPT portal

Quick Start

CDN Integration
html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/mini-tokyo-3d@latest/dist/mini-tokyo-3d.min.css" />
  <script src="https://cdn.jsdelivr.net/npm/mini-tokyo-3d@latest/dist/mini-tokyo-3d.min.js"></script>
  <style>body { margin: 0; } #map { width: 100vw; height: 100vh; }</style>
</head>
<body>
  <div id="map"></div>
  <script>
    const map = new mt3d.Map({
      container: 'map',
      accessToken: '<MAPBOX_TOKEN>',
      secrets: {
        odpt: '<ODPT_TOKEN>',
        challenge2025: '<CHALLENGE_2025_TOKEN>'
      }
    });
  </script>
</body>
</html>
NPM Integration
bash
npm install mini-tokyo-3d
javascript
import { Map } from 'mini-tokyo-3d';
import 'mini-tokyo-3d/dist/mini-tokyo-3d.min.css';
const map = new Map({
  container: 'map',
  accessToken: process.env.MAPBOX_TOKEN,
  secrets: {
    odpt: process.env.ODPT_TOKEN,
    challenge2025: process.env.CHALLENGE_2025_TOKEN
  }
});

Constructor Options

OptionTypeDefaultDescription
containerstringrequiredHTML element ID
accessTokenstringrequiredMapbox token
secretsObject-{odpt, challenge2025} tokens
center[lng, lat][139.7670, 35.6814]Initial center
zoomnumber14Zoom level (0-22)
pitchnumber60Tilt angle (0-85)
bearingnumber0Rotation degrees
langstringbrowserLanguage code
ecoModestring'normal''normal' or 'eco'
pluginsArray[]Plugin instances

Languages: ja, en, ko, zh-Hans, zh-Hant, th, ne, pt-BR, fr, es, de

Core API Reference

For detailed API documentation, see:

Quick Method Reference
javascript
// Camera
map.flyTo({ center: [139.7454, 35.6586], zoom: 16 });
map.setCenter([lng, lat]);
map.setPitch(45);
map.setBearing(90);
// Selection & Tracking
map.setSelection('JR-East.Yamanote.Outbound.1234');  // Track train
map.setSelection('Shibuya');  // Select station
map.setTrackingMode('helicopter');  // 'position'|'back'|'front'|'helicopter'|'drone'|'bird'
// Modes
map.setViewMode('underground');  // 'ground' or 'underground'
map.setClockMode('playback');    // 'realtime' or 'playback'
map.setEcoMode('eco');           // 'normal' or 'eco'
// Events
map.on('load', () => console.log('Ready'));
map.on('selection', (e) => console.log(e.selection));

Plugins

html
<script src="https://cdn.jsdelivr.net/npm/mini-tokyo-3d-plugin-precipitation@latest/dist/mini-tokyo-3d-plugin-precipitation.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/mini-tokyo-3d-plugin-fireworks@latest/dist/mini-tokyo-3d-plugin-fireworks.min.js"></script>
javascript
const map = new mt3d.Map({
  plugins: [mt3dPrecipitation(), mt3dFireworks()]
});

Resources

Security

  • Security scanPassed, 100 of 100Pattern checks on the skill's files.
  • Model reviewNot runA model review is scheduled for the next rescan.

See the full security report

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

See evaluation results

Source

Popularity

Repository stars
192
Repository forks
14
7-day trend score
26

Stars and forks are for the whole GitHub repository, not this skill alone. Refreshed 19 Mar 2026, 7 months ago.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/ianlkl11234s/mini-taiwan-learning-project/mini-tokyo-3d/badge)](https://verified-skill.com/skills/ianlkl11234s/mini-taiwan-learning-project/mini-tokyo-3d)

Something wrong with this skill or its page? Tell us.