[{"data":1,"prerenderedAt":322},["ShallowReactive",2],{"content-/micron-fab-page-with-capacity-map":3,"all-pages-for-dir":320,"og-image-/micron-fab-page-with-capacity-map":321},{"id":4,"title":5,"body":6,"category":300,"description":301,"extension":302,"meta":303,"navigation":304,"ogImage":305,"path":306,"project_name":307,"published":308,"publishedAt":309,"seo":310,"stem":311,"tags":312,"todo":305,"unpublished":308,"updatedAt":305,"__hash__":319},"pages/2026-06/2026-06-07/micron-fab-page-with-capacity-map.md","Micron個別ページを作った（工場マップ＋月間キャパシティ詳細）",{"type":7,"value":8,"toc":284},"minimark",[9,13,22,26,32,35,40,62,65,69,72,82,85,89,92,109,116,119,127,130,205,228,232,235,238,249,252,263,266,280],[10,11,5],"h1",{"id":12},"micron個別ページを作った工場マップ月間キャパシティ詳細",[14,15,16,17,21],"p",{},"既存の ",[18,19,20],"code",{},"/memory-makers/dram-fab-capacity"," は情報密度が高いんだけれど、Boise や Manassas や広島がそれぞれどこにある拠点か、文字情報だけでは頭に入ってこない。Micron / SK Hynix / Samsung の3社は個別特集ページを作って、地図と一緒に見せた方が腹落ちする。今日はその第一弾として Micron を組み上げた。",[23,24,25],"h2",{"id":25},"着地",[14,27,28,31],{},[18,29,30],{},"/memory-makers/micron"," に Micron 個別ページが立ち上がった。USA（Boise, Manassas）/ Japan（広島）/ Taiwan（台中, 苗栗・銅鑼）の3地域を、それぞれ地図（上）＋Fabカード（下）の縦積みレイアウトで表示する。Fabカードには月間キャパシティ（KWPM）の5マイルストーン推移をバーチャートで描いた。",[23,33,34],{"id":34},"やったこと",[36,37,39],"h3",{"id":38},"_1-データファイルとコンポーネント","1. データファイルとコンポーネント",[41,42,43,50,56],"ul",{},[44,45,46,49],"li",{},[18,47,48],{},"app/data/memory-makers/micronFabs.ts"," を新設。各Fabの所在地（緯度経度）、稼働開始年、技術ノード、月間キャパシティ（KWPM）の時系列を入れた",[44,51,52,55],{},[18,53,54],{},"app/components/memory-makers/FactoryLocationMap.vue"," を新設。SVG で地域別の地図を描き、Fab地点をドットでマーカーする",[44,57,58,61],{},[18,59,60],{},"app/pages/memory-makers/micron.vue"," から両者を呼び出して、地域カードを並べる",[14,63,64],{},"地図は外部ライブラリを使わずSVGで自作。3地域だけなら手描きパスで十分軽い。",[36,66,68],{"id":67},"_2-レイアウト変遷","2. レイアウト変遷",[14,70,71],{},"最初は3カラム（USA / Japan / Taiwan を横並び）で出したが、Fab詳細が増えてくると幅が足りない。",[73,74,79],"pre",{"className":75,"code":77,"language":78},[76],"language-text","3カラム並列 → 1カラムに変更（左マップ／右内容）→ さらに上下に変更（上マップ／下Fabカード）\n","text",[18,80,77],{"__ignoreMap":81},"",[14,83,84],{},"「マップ左／内容右」を試したものの、マップを大きく見せたいときに右側のFabカードが縦長になって視線移動が辛い。上下に積む方が、地図を広く取れて、その下にFab別の詳細をリストとして読み下せる。",[36,86,88],{"id":87},"_3-fab別キャパシティの5マイルストーン","3. Fab別キャパシティの5マイルストーン",[14,90,91],{},"ユーザーから「月間キャパシティがどれぐらい増えるか、もっと詳細に」とリクエストが入って、各Fabに対して",[41,93,94,97,100,103,106],{},[44,95,96],{},"Q1（基準）",[44,98,99],{},"次のマイルストーン1",[44,101,102],{},"マイルストーン2",[44,104,105],{},"マイルストーン3",[44,107,108],{},"最終形",[14,110,111,112,115],{},"の5点で KWPM をバー表示。前回比とコメント（「新棟稼働」「EUV切替」など）も並べる。データは既存の ",[18,113,114],{},"dramFabCapacity.ts"," の総量と整合させて配分した。",[23,117,118],{"id":118},"試行錯誤",[36,120,122,123,126],{"id":121},"バグ-quarterslice5-でキーが空文字になっていた","バグ: ",[18,124,125],{},"quarter.slice(5)"," でキーが空文字になっていた",[14,128,129],{},"暦月併記を足すときに、四半期キーから月のレンジを引く処理を書いた。",[73,131,135],{"className":132,"code":133,"language":134,"meta":81,"style":81},"language-ts shiki shiki-themes vitesse-light vitesse-light","// 想定: \"FY2025Q1\" → \"Q1\" を抜く\nconst q = quarter.slice(5)\nconst months = MONTH_MAP[q]  // ← undefined\n","ts",[18,136,137,146,181],{"__ignoreMap":81},[138,139,142],"span",{"class":140,"line":141},"line",1,[138,143,145],{"class":144},"sxvE3","// 想定: \"FY2025Q1\" → \"Q1\" を抜く\n",[138,147,149,153,157,161,164,167,171,174,178],{"class":140,"line":148},2,[138,150,152],{"class":151},"stQ0i","const ",[138,154,156],{"class":155},"s4oTP","q",[138,158,160],{"class":159},"shFtX"," =",[138,162,163],{"class":155}," quarter",[138,165,166],{"class":159},".",[138,168,170],{"class":169},"senZ8","slice",[138,172,173],{"class":159},"(",[138,175,177],{"class":176},"sM54T","5",[138,179,180],{"class":159},")\n",[138,182,184,186,189,191,194,197,199,202],{"class":140,"line":183},3,[138,185,152],{"class":151},[138,187,188],{"class":155},"months",[138,190,160],{"class":159},[138,192,193],{"class":155}," MONTH_MAP",[138,195,196],{"class":159},"[",[138,198,156],{"class":155},[138,200,201],{"class":159},"]",[138,203,204],{"class":144},"  // ← undefined\n",[14,206,207,208,211,212,215,216,219,220,223,224,227],{},"辞書のキーは ",[18,209,210],{},"\"Q1\""," だったが、",[18,213,214],{},"slice(5)"," だと ",[18,217,218],{},"\"2025Q1\""," から ",[18,221,222],{},"\"1\""," が取れてしまい一致しない。",[18,225,226],{},"slice(6)"," に直して解決。画面に出る前は気づかなかったが、暦月併記の欄が空白になっていてようやく気付いた。",[36,229,231],{"id":230},"cyfy-の混同防止注記","CY/FY の混同防止注記",[14,233,234],{},"Micron は FY が暦年とズレる（FY2025 ≒ 2024/9〜2025/8）。会計四半期だけで表記すると「2025年Q1だから1〜3月」と誤読される。各時点に「2024/9-11」のように暦月を併記し、セクション冒頭にも CY/FY 注記を1行追加した。",[23,236,237],{"id":237},"学び",[41,239,240,243,246],{},[44,241,242],{},"既存の総量ページ（dram-fab-capacity）と特集ページは役割分担できる。総量ページは横比較、特集ページは「この会社の拠点が世界のどこに散っているか」を地理的に見せる",[44,244,245],{},"レイアウトは早めに dev で確認して、3カラム→上下と素直に組み替える方が早い。マップは横より縦に大きく取れた方が良い",[44,247,248],{},"暦月併記は決算系コンテンツでは必須に近い。FY と CY のズレは読者の頭で変換させない",[23,250,251],{"id":251},"次の一手",[41,253,254,257,260],{},[44,255,256],{},"SK Hynix 個別ページ（M14, M16, 無錫など）",[44,258,259],{},"Samsung 個別ページ（華城, 平沢, Xi'an など）",[44,261,262],{},"3社並べての比較ビュー（同じ縮尺の世界地図に全Fabを重ねる）",[23,264,265],{"id":265},"関連",[41,267,268,274],{},[44,269,270],{},[271,272,273],"a",{"href":20},"DRAM Fab Capacity（総量）",[44,275,276],{},[271,277,279],{"href":278},"/memory-makers","メモリーメーカー一覧",[281,282,283],"style",{},"html pre.shiki code .sxvE3, html code.shiki .sxvE3{--shiki-default:#A0ADA0;--shiki-dark:#A0ADA0}html pre.shiki code .stQ0i, html code.shiki .stQ0i{--shiki-default:#AB5959;--shiki-dark:#AB5959}html pre.shiki code .s4oTP, html code.shiki .s4oTP{--shiki-default:#B07D48;--shiki-dark:#B07D48}html pre.shiki code .shFtX, html code.shiki .shFtX{--shiki-default:#999999;--shiki-dark:#999999}html pre.shiki code .senZ8, html code.shiki .senZ8{--shiki-default:#59873A;--shiki-dark:#59873A}html pre.shiki code .sM54T, html code.shiki .sM54T{--shiki-default:#2F798A;--shiki-dark:#2F798A}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":81,"searchDepth":148,"depth":148,"links":285},[286,287,292,297,298,299],{"id":25,"depth":148,"text":25},{"id":34,"depth":148,"text":34,"children":288},[289,290,291],{"id":38,"depth":183,"text":39},{"id":67,"depth":183,"text":68},{"id":87,"depth":183,"text":88},{"id":118,"depth":148,"text":118,"children":293},[294,296],{"id":121,"depth":183,"text":295},"バグ: quarter.slice(5) でキーが空文字になっていた",{"id":230,"depth":183,"text":231},{"id":237,"depth":148,"text":237},{"id":251,"depth":148,"text":251},{"id":265,"depth":148,"text":265},"dev","/memory-makers/micron を新規作成。USA / Japan / Taiwan の工場地図をSVGで描き、Fab別の月間キャパシティ推移を5マイルストーンで可視化した。3カラムから上下レイアウトへ作り直し、会計四半期に暦月併記を足すまでの過程をまとめる。","md",{},true,null,"/micron-fab-page-with-capacity-map","financial-data",false,"2026-06-07T00:00:00.000Z",{"title":5,"description":301},"2026-06/2026-06-07/micron-fab-page-with-capacity-map",[313,314,315,316,317,318],"Micron","DRAM","memory-makers","Vue","SVG","Nuxt","bMC2UzpukWCIJSeBkzS2RLxOImALjQ8HX8HquJ51jAI",[],"https://log.eurekapu.com/og/blog/micron-fab-page-with-capacity-map.png?v=2026-06-07T00%3A00%3A00.000Z&title=Micron%E5%80%8B%E5%88%A5%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%92%E4%BD%9C%E3%81%A3%E3%81%9F%EF%BC%88%E5%B7%A5%E5%A0%B4%E3%83%9E%E3%83%83%E3%83%97%EF%BC%8B%E6%9C%88%E9%96%93%E3%82%AD%E3%83%A3%E3%83%91%E3%82%B7%E3%83%86%E3%82%A3%E8%A9%B3%E7%B4%B0%EF%BC%89&author=Kei%20Komatsu&sig=634fb5742e601c3e",1782528849977]