{"id":720,"date":"2025-09-15T02:00:24","date_gmt":"2025-09-14T17:00:24","guid":{"rendered":"https:\/\/tamani-manabu.com\/?p=720"},"modified":"2025-09-15T02:00:24","modified_gmt":"2025-09-14T17:00:24","slug":"ip%ef%bc%88%e7%9f%a5%e7%9a%84%e8%b2%a1%e7%94%a3%ef%bc%89%ef%bc%9f","status":"publish","type":"post","link":"https:\/\/tamani-manabu.com\/?p=720","title":{"rendered":"IP\uff08\u77e5\u7684\u8ca1\u7523\uff09\uff1f"},"content":{"rendered":"\n<p>IP\uff08\u77e5\u7684\u8ca1\u7523\uff09\uff1f<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"\u3010\u4efb\u5929\u5802\u3011\u65e5\u672c\u306e\u5f37\u307f\u3067\u3042\u308bIP\uff08\u77e5\u7684\u8ca1\u7523\uff09\u6226\u7565\u306b\u3064\u3044\u3066\u89e3\u8aac\" width=\"1140\" height=\"641\" src=\"https:\/\/www.youtube.com\/embed\/UktCZYFVa50?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<!-- Chosen Palette: Professional & Stylish -->\n<!-- Application Structure Plan: The application is designed as a tab-based Single Page Application (SPA) to provide a non-linear, user-driven exploration of the IP business report. This structure was chosen over a linear infographic to empower users to directly access the information most relevant to them. The flow is: User lands on a 'Home' dashboard with key metrics -> User navigates via a persistent top navigation bar to specific sections: 'Global Market', 'Japanese Market', or 'Strategy Comparison'. Each section presents focused data and interactions, such as filtering chart data or expanding content, making the complex information digestible and explorable at the user's own pace. -->\n<!-- Visualization & Content Choices: \n- Home: Goal: Inform. Method: Large stat cards (HTML\/CSS) for at-a-glance key metrics. Interaction: None, serves as an entry summary. Justification: Provides immediate, high-impact information.\n- Global Market: Goal: Compare. Method: Interactive Horizontal Bar Chart (Chart.js) of top licensors. Interaction: A button to dynamically highlight Japanese companies on the chart. Justification: Allows users to instantly see the position of Japanese firms within the global context.\n- Japanese Market: Goal: Analyze Change & Composition. Method: A Line Chart for anime market trends and a Donut Chart for market breakdown (Chart.js). Interaction: Buttons to toggle the visibility of domestic vs. overseas data on the line chart. Justification: Provides direct control over the data comparison, making trends easier to analyze.\n- Strategy Comparison: Goal: Organize & Compare. Method: A two-column layout with clickable headers (HTML\/JS). Interaction: Clicking a strategy point reveals detailed text (accordion-style). Justification: Prevents information overload by presenting high-level points first and allowing users to drill down into details.\n- Library\/Method: All charts use Chart.js on Canvas. All diagrams\/layouts use structured HTML with Tailwind CSS.\n-->\n<!-- CONFIRMATION: NO SVG graphics used. NO Mermaid JS used. -->\n<!DOCTYPE html>\n<html lang=\"ja\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Interactive Analysis: Global vs. Japan IP Business<\/title>\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;700;900&#038;family=Noto+Sans+JP:wght@400;700;900&#038;display=swap\" rel=\"stylesheet\">\n    <style>\n        body {\n            font-family: 'Inter', 'Noto Sans JP', sans-serif;\n            background-color: #F8F9FA;\n        }\n        .chart-container {\n            position: relative;\n            width: 100%;\n            max-width: 700px;\n            margin-left: auto;\n            margin-right: auto;\n            height: 40vh;\n            max-height: 500px;\n        }\n        @media (min-width: 768px) {\n             .chart-container { height: 350px; }\n        }\n        .nav-button {\n            transition: all 0.3s ease;\n        }\n        .nav-button.active {\n            background-color: #005A9C;\n            color: white;\n            box-shadow: 0 4px 6px -1px rgb(0 0 0 \/ 0.1), 0 2px 4px -2px rgb(0 0 0 \/ 0.1);\n        }\n        .content-section {\n            display: none;\n        }\n        .content-section.active {\n            display: block;\n        }\n    <\/style>\n<\/head>\n<body class=\"text-gray-800\">\n\n    <header class=\"bg-white shadow-md sticky top-0 z-50\">\n        <div class=\"container mx-auto px-4 py-3\">\n            <h1 class=\"text-2xl md:text-3xl font-black text-[#003366]\">IP\u30d3\u30b8\u30cd\u30b9\uff1a\u4e16\u754c\u3068\u65e5\u672c\u306e\u6bd4\u8f03\u5206\u6790<\/h1>\n            <nav class=\"mt-2\">\n                <div id=\"nav-container\" class=\"flex flex-wrap gap-2\">\n                    <button data-target=\"home\" class=\"nav-button active text-sm md:text-base px-4 py-2 rounded-lg font-bold bg-gray-200 text-gray-700 hover:bg-[#005A9C] hover:text-white\">\u30db\u30fc\u30e0<\/button>\n                    <button data-target=\"global\" class=\"nav-button text-sm md:text-base px-4 py-2 rounded-lg font-bold bg-gray-200 text-gray-700 hover:bg-[#005A9C] hover:text-white\">\u4e16\u754c\u5e02\u5834<\/button>\n                    <button data-target=\"japan\" class=\"nav-button text-sm md:text-base px-4 py-2 rounded-lg font-bold bg-gray-200 text-gray-700 hover:bg-[#005A9C] hover:text-white\">\u65e5\u672c\u5e02\u5834<\/button>\n                    <button data-target=\"strategy\" class=\"nav-button text-sm md:text-base px-4 py-2 rounded-lg font-bold bg-gray-200 text-gray-700 hover:bg-[#005A9C] hover:text-white\">\u6226\u7565\u6bd4\u8f03<\/button>\n                <\/div>\n            <\/nav>\n        <\/div>\n    <\/header>\n\n    <main id=\"main-content\" class=\"container mx-auto p-4 md:p-8\">\n        \n        <section id=\"home\" class=\"content-section active\">\n            <div class=\"bg-white rounded-lg shadow-md p-6 mb-8\">\n                <h2 class=\"text-2xl font-bold text-[#003366] mb-4\">\u3088\u3046\u3053\u305d\uff1a\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6IP\u30d3\u30b8\u30cd\u30b9\u5206\u6790\u3078<\/h2>\n                <p class=\"text-gray-700 leading-relaxed\">\n                    \u3053\u306e\u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u306f\u3001\u4e16\u754c\u306e\u77e5\u7684\u8ca1\u7523\uff08IP\uff09\u30d3\u30b8\u30cd\u30b9\u3068\u65e5\u672c\u306eIP\u30d3\u30b8\u30cd\u30b9\u306e\u73fe\u72b6\u3092\u6bd4\u8f03\u30fb\u5206\u6790\u3059\u308b\u305f\u3081\u306e\u30a4\u30f3\u30bf\u30e9\u30af\u30c6\u30a3\u30d6\u306a\u30c0\u30c3\u30b7\u30e5\u30dc\u30fc\u30c9\u3067\u3059\u3002\u4e0a\u90e8\u306e\u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\u3092\u4f7f\u3044\u3001\u4e3b\u8981\u306a\u6307\u6a19\u306e\u78ba\u8a8d\u3001\u5e02\u5834\u30c7\u30fc\u30bf\u306e\u6398\u308a\u4e0b\u3052\u3001\u30d3\u30b8\u30cd\u30b9\u6226\u7565\u306e\u6bd4\u8f03\u306a\u3069\u3001\u95a2\u5fc3\u306e\u3042\u308b\u5206\u91ce\u3092\u81ea\u7531\u306b\u63a2\u7d22\u3057\u3066\u304f\u3060\u3055\u3044\u3002\n                <\/p>\n            <\/div>\n            <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6\">\n                <div class=\"bg-white rounded-lg shadow-md p-6 text-center\">\n                    <p class=\"text-gray-500 text-lg font-bold\">\u4e16\u754c\u306e\u30ad\u30e3\u30e9\u30af\u30bf\u30fc\u5546\u54c1\u5e02\u5834\u898f\u6a21 (2023)<\/p>\n                    <h3 class=\"text-5xl font-black text-[#005A9C] mt-2\">$279.4B<\/h3>\n                <\/div>\n                <div class=\"bg-white rounded-lg shadow-md p-6 text-center\">\n                    <p class=\"text-gray-500 text-lg font-bold\">\u65e5\u672c\u306e\u30ad\u30e3\u30e9\u30af\u30bf\u30fc\u5546\u54c1\u5e02\u5834\u898f\u6a21 (2023)<\/p>\n                    <h3 class=\"text-5xl font-black text-[#005A9C] mt-2\">1\u51466\u5343\u5104\u5186<\/h3>\n                <\/div>\n                <div class=\"bg-white rounded-lg shadow-md p-6 text-center md:col-span-2 lg:col-span-1\">\n                    <p class=\"text-gray-500 text-lg font-bold\">\u4e16\u754c\u306e\u30e9\u30a4\u30bb\u30f3\u30b5\u30fcTOP10\u5185\u306e\u65e5\u672c\u4f01\u696d\u6570<\/p>\n                    <h3 class=\"text-5xl font-black text-[#005A9C] mt-2\">3\u793e<\/h3>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"global\" class=\"content-section\">\n            <div class=\"bg-white rounded-lg shadow-md p-6\">\n                 <h2 class=\"text-2xl font-bold text-[#003366] mb-2\">\u4e16\u754c\u306eIP\u30e9\u30a4\u30bb\u30f3\u30b5\u30fc \u30c8\u30c3\u30d710 (2023\u5e74)<\/h2>\n                 <p class=\"text-gray-700 mb-4\">\n                    \u4e16\u754c\u5e02\u5834\u3067\u306f\u30c7\u30a3\u30ba\u30cb\u30fc\u304c\u5727\u5012\u7684\u306a\u5730\u4f4d\u3092\u7bc9\u3044\u3066\u3044\u307e\u3059\u304c\u3001\u65e5\u672c\u306eIP\u3082\u30b0\u30ed\u30fc\u30d0\u30eb\u306a\u7af6\u4e89\u529b\u3092\u6301\u3063\u3066\u3044\u307e\u3059\u3002\u4e0b\u306e\u30dc\u30bf\u30f3\u3092\u30af\u30ea\u30c3\u30af\u3057\u3066\u3001\u30c1\u30e3\u30fc\u30c8\u5185\u306e\u65e5\u672c\u4f01\u696d\u3092\u30cf\u30a4\u30e9\u30a4\u30c8\u8868\u793a\u3067\u304d\u307e\u3059\u3002\n                <\/p>\n                <div class=\"text-center mb-4\">\n                    <button id=\"highlight-jp-btn\" class=\"bg-[#D9534F] text-white font-bold py-2 px-4 rounded-lg shadow hover:bg-[#C9302C] transition-colors\">\u65e5\u672c\u4f01\u696d\u3092\u30cf\u30a4\u30e9\u30a4\u30c8<\/button>\n                    <button id=\"reset-colors-btn\" class=\"bg-gray-500 text-white font-bold py-2 px-4 rounded-lg shadow hover:bg-gray-600 transition-colors\">\u30ea\u30bb\u30c3\u30c8<\/button>\n                <\/div>\n                <div class=\"chart-container h-96 md:h-[500px] max-h-[500px]\">\n                    <canvas id=\"topLicensorsChart\"><\/canvas>\n                <\/div>\n            <\/div>\n        <\/section>\n        \n        <section id=\"japan\" class=\"content-section\">\n             <h2 class=\"text-2xl font-bold text-[#003366] mb-4\">\u65e5\u672c\u5e02\u5834\u306e\u8a73\u7d30\u5206\u6790<\/h2>\n            <div class=\"grid grid-cols-1 lg:grid-cols-5 gap-6\">\n                <div class=\"lg:col-span-3 bg-white rounded-lg shadow-md p-6\">\n                    <h3 class=\"text-xl font-bold text-center text-[#003366] mb-2\">\u30a2\u30cb\u30e1\u5e02\u5834\u306e\u6210\u9577\u30c8\u30ec\u30f3\u30c9 (\u56fd\u5185 vs \u6d77\u5916)<\/h3>\n                    <p class=\"text-gray-700 text-center mb-4\">\u8fd1\u5e74\u3001\u6d77\u5916\u3067\u306e\u65e5\u672c\u30a2\u30cb\u30e1\u5e02\u5834\u306e\u6210\u9577\u304c\u56fd\u5185\u5e02\u5834\u3092\u4e0a\u56de\u308b\u52e2\u3044\u3092\u898b\u305b\u3066\u3044\u307e\u3059\u3002\u4e0b\u306e\u30dc\u30bf\u30f3\u3067\u8868\u793a\u3092\u5207\u308a\u66ff\u3048\u3066\u3001\u305d\u306e\u50be\u5411\u3092\u78ba\u8a8d\u3067\u304d\u307e\u3059\u3002<\/p>\n                    <div class=\"text-center mb-4 flex justify-center gap-2\">\n                         <button data-dataset=\"0\" class=\"toggle-dataset-btn bg-[#5BC0DE] text-white font-bold py-2 px-4 rounded-lg shadow\">\u6d77\u5916\u5e02\u5834ON\/OFF<\/button>\n                         <button data-dataset=\"1\" class=\"toggle-dataset-btn bg-[#005A9C] text-white font-bold py-2 px-4 rounded-lg shadow\">\u56fd\u5185\u5e02\u5834ON\/OFF<\/button>\n                    <\/div>\n                    <div class=\"chart-container h-80 md:h-96\">\n                        <canvas id=\"animeMarketChart\"><\/canvas>\n                    <\/div>\n                <\/div>\n                <div class=\"lg:col-span-2 bg-white rounded-lg shadow-md p-6\">\n                    <h3 class=\"text-xl font-bold text-center text-[#003366] mb-2\">\u30ad\u30e3\u30e9\u30af\u30bf\u30fc\u5e02\u5834\u306e\u69cb\u6210 (2023\u5e74)<\/h3>\n                     <p class=\"text-gray-700 text-center mb-4\">\u56fd\u5185\u306e\u30ad\u30e3\u30e9\u30af\u30bf\u30fc\u5e02\u5834\u306f\u3001\u300c\u30b2\u30fc\u30e0\u7cfbIP\u300d\u3068\u300c\u30a2\u30cb\u30e1\u30fb\u30de\u30f3\u30acIP\u300d\u304c\u5927\u90e8\u5206\u3092\u5360\u3081\u3066\u304a\u308a\u3001\u3053\u306e2\u3064\u306e\u30ab\u30c6\u30b4\u30ea\u304c\u5e02\u5834\u306e\u4e3b\u8981\u306a\u727d\u5f15\u5f79\u3068\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n                    <div class=\"chart-container h-80 md:h-96\">\n                        <canvas id=\"jpMarketCompositionChart\"><\/canvas>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n        <section id=\"strategy\" class=\"content-section\">\n            <div class=\"bg-white rounded-lg shadow-md p-6\">\n                 <h2 class=\"text-2xl font-bold text-[#003366] mb-2\">\u30b0\u30ed\u30fc\u30d0\u30eb vs \u65e5\u672c\uff1aIP\u5c55\u958b\u6226\u7565\u306e\u6bd4\u8f03<\/h2>\n                 <p class=\"text-gray-700 mb-6\">\u30b0\u30ed\u30fc\u30d0\u30eb\u4f01\u696d\u3068\u65e5\u672c\u306eIP\u30db\u30eb\u30c0\u30fc\u3067\u306f\u3001\u4e8b\u696d\u5c55\u958b\u306e\u6226\u7565\u306b\u7279\u5fb4\u7684\u306a\u9055\u3044\u304c\u3042\u308a\u307e\u3059\u3002\u5404\u9805\u76ee\u306e\u30d8\u30c3\u30c0\u30fc\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3068\u8a73\u7d30\u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n                <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n                    <div class=\"border-l-4 border-[#005A9C] pl-4\">\n                        <h3 class=\"text-xl font-bold text-[#003366]\">\u30b0\u30ed\u30fc\u30d0\u30eb\u6226\u7565 (\u30c7\u30a3\u30ba\u30cb\u30fc\u578b)<\/h3>\n                        <div class=\"mt-4 space-y-4\">\n                            <details class=\"group\">\n                                <summary class=\"font-bold text-lg cursor-pointer group-hover:text-[#005A9C]\">\ud83c\udfac \u5f37\u529b\u306a\u30e1\u30c7\u30a3\u30a2\u30df\u30c3\u30af\u30b9<\/summary>\n                                <p class=\"mt-2 text-gray-600\">\u6620\u753b\u30fb\u6620\u50cf\u4f5c\u54c1\u3092IP\u306e\u4e2d\u6838\u3068\u3057\u3001\u30c6\u30fc\u30de\u30d1\u30fc\u30af\u3001\u30de\u30fc\u30c1\u30e3\u30f3\u30c0\u30a4\u30b8\u30f3\u30b0\u3001\u914d\u4fe1\u30b5\u30fc\u30d3\u30b9\u306a\u3069\u3001\u81ea\u793e\u304c\u4fdd\u6709\u3059\u308b\u591a\u69d8\u306a\u30c1\u30e3\u30cd\u30eb\u3078\u4e00\u6c17\u901a\u8cab\u3067\u5c55\u958b\u3002IP\u4fa1\u5024\u306e\u6700\u5927\u5316\u3092\u56f3\u308b\u3002<\/p>\n                            <\/details>\n                            <details class=\"group\">\n                                <summary class=\"font-bold text-lg cursor-pointer group-hover:text-[#005A9C]\">\ud83d\udcb0 \u7a4d\u6975\u7684\u306aM&#038;A<\/summary>\n                                <p class=\"mt-2 text-gray-600\">\u30de\u30fc\u30d9\u30eb\u3001\u30eb\u30fc\u30ab\u30b9\u30d5\u30a3\u30eb\u30e0\u3001\u30d4\u30af\u30b5\u30fc\u3068\u3044\u3063\u305f\u5f37\u529b\u306aIP\u3092\u6301\u3064\u30b9\u30bf\u30b8\u30aa\u3092\u8cb7\u53ce\u3002\u30dd\u30fc\u30c8\u30d5\u30a9\u30ea\u30aa\u3092\u7d99\u7d9a\u7684\u306b\u62e1\u5927\u3057\u3001\u591a\u69d8\u306a\u30d5\u30a1\u30f3\u5c64\u3092\u7372\u5f97\u3059\u308b\u3002<\/p>\n                            <\/details>\n                        <\/div>\n                    <\/div>\n                    <div class=\"border-l-4 border-[#D9534F] pl-4\">\n                        <h3 class=\"text-xl font-bold text-[#D9534F]\">\u65e5\u672c\u6226\u7565 (\u88fd\u4f5c\u59d4\u54e1\u4f1a\u578b)<\/h3>\n                        <div class=\"mt-4 space-y-4\">\n                             <details class=\"group\">\n                                <summary class=\"font-bold text-lg cursor-pointer group-hover:text-[#D9534F]\">\ud83c\udfae \u539f\u4f5c\u306e\u4e16\u754c\u89b3\u3092\u5c0a\u91cd<\/summary>\n                                <p class=\"mt-2 text-gray-600\">\u30de\u30f3\u30ac\u3001\u30a2\u30cb\u30e1\u3001\u30b2\u30fc\u30e0\u306a\u3069\u306e\u539f\u4f5c\u304c\u6301\u3064\u72ec\u81ea\u306e\u4e16\u754c\u89b3\u3084\u30b9\u30c8\u30fc\u30ea\u30fc\u3092IP\u306e\u6838\u3068\u3059\u308b\u3002\u30d5\u30a1\u30f3\u30b3\u30df\u30e5\u30cb\u30c6\u30a3\u306e\u71b1\u91cf\u3092\u7dad\u6301\u3057\u306a\u304c\u3089\u3001\u4e01\u5be7\u306a\u30e1\u30c7\u30a3\u30a2\u5c55\u958b\u3092\u884c\u3046\u3002<\/p>\n                            <\/details>\n                             <details class=\"group\">\n                                <summary class=\"font-bold text-lg cursor-pointer group-hover:text-[#D9534F]\">\ud83e\udd1d \u30d1\u30fc\u30c8\u30ca\u30fc\u30b7\u30c3\u30d7\u91cd\u8996<\/summary>\n                                <p class=\"mt-2 text-gray-600\">\u51fa\u7248\u793e\u3001\u5e83\u544a\u4ee3\u7406\u5e97\u3001\u73a9\u5177\u30e1\u30fc\u30ab\u30fc\u306a\u3069\u3001\u8907\u6570\u306e\u4f01\u696d\u304c\u5171\u540c\u3067\u51fa\u8cc7\u3059\u308b\u300c\u88fd\u4f5c\u59d4\u54e1\u4f1a\u300d\u65b9\u5f0f\u304c\u4e3b\u6d41\u3002\u30ea\u30b9\u30af\u3092\u5206\u6563\u3057\u3001\u5404\u793e\u306e\u5c02\u9580\u77e5\u8b58\u3092\u7d50\u96c6\u3057\u3066IP\u3092\u80b2\u6210\u3059\u308b\u3002<\/p>\n                            <\/details>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/section>\n\n    <\/main>\n\n    <script>\n        document.addEventListener('DOMContentLoaded', () => {\n            const charts = {};\n            const FONT_COLOR = '#374151';\n            const GRID_COLOR = '#E5E7EB';\n            const ACCENT_COLOR_JP = '#D9534F'; \n            const BASE_COLORS = ['#005A9C', '#5BC0DE', '#6C757D', '#005A9C', '#5BC0DE', '#6C757D', '#005A9C', '#5BC0DE', '#6C757D', '#5BC0DE'];\n            \n            Chart.defaults.font.family = \"'Inter', 'Noto Sans JP', sans-serif\";\n            Chart.defaults.color = FONT_COLOR;\n\n            const wrapLabel = (label) => {\n                const maxLength = 16;\n                if (typeof label !== 'string' || label.length <= maxLength) return label;\n                const words = label.split(' ');\n                const lines = [];\n                let currentLine = '';\n                words.forEach(word => {\n                    if ((currentLine + ' ' + word).trim().length > maxLength && currentLine.length > 0) {\n                        lines.push(currentLine);\n                        currentLine = word;\n                    } else {\n                        currentLine = (currentLine + ' ' + word).trim();\n                    }\n                });\n                if (currentLine) lines.push(currentLine);\n                return lines;\n            };\n\n            const tooltipTitleCallback = (tooltipItems) => {\n                const item = tooltipItems[0];\n                let label = item.chart.data.labels[item.dataIndex];\n                return Array.isArray(label) ? label.join(' ') : label;\n            };\n\n            const initTopLicensorsChart = () => {\n                const ctx = document.getElementById('topLicensorsChart');\n                if (!ctx) return;\n                const data = {\n                    labels: [\n                        'The Walt Disney Company', 'Dotdash Meredith', 'Authentic Brands Group',\n                        'Warner Bros. Discovery', ['The Pok\u00e9mon Company', 'International'], 'Hasbro', 'NBCUniversal',\n                        'Mattel', 'Bluestar Alliance', 'Sanrio'\n                    ].map(wrapLabel),\n                    datasets: [{\n                        label: '2023\u5e74\u5c0f\u58f2\u58f2\u4e0a\u9ad8 (10\u5104\u30c9\u30eb)',\n                        data: [61.7, 31.5, 29.2, 15.6, 11.5, 10.5, 9.5, 8.0, 7.5, 4.5],\n                        backgroundColor: [...BASE_COLORS],\n                        borderColor: '#FFFFFF',\n                        borderWidth: 2,\n                    }]\n                };\n                charts.topLicensors = new Chart(ctx, {\n                    type: 'bar', data: data, options: {\n                        indexAxis: 'y', maintainAspectRatio: false,\n                        scales: { x: { beginAtZero: true, grid: { color: GRID_COLOR }, ticks: { callback: value => `$${value}B` } }, y: { grid: { display: false } } },\n                        plugins: { legend: { display: false }, tooltip: { callbacks: { title: tooltipTitleCallback } } }\n                    }\n                });\n            };\n\n            const initAnimeMarketChart = () => {\n                const ctx = document.getElementById('animeMarketChart');\n                if (!ctx) return;\n                const data = {\n                    labels: ['2018', '2019', '2020', '2021', '2022', '2023'],\n                    datasets: [\n                        { label: '\u6d77\u5916\u5e02\u5834\u898f\u6a21 (\u5104\u5186)', data: [10092, 12009, 12394, 13134, 14574, 15300], fill: true, backgroundColor: 'rgba(91, 192, 222, 0.2)', borderColor: '#5BC0DE', tension: 0.4 },\n                        { label: '\u56fd\u5185\u5e02\u5834\u898f\u6a21 (\u5104\u5186)', data: [12918, 13100, 11867, 13876, 13948, 14100], fill: true, backgroundColor: 'rgba(0, 90, 156, 0.2)', borderColor: '#005A9C', tension: 0.4 }\n                    ]\n                };\n                charts.animeMarket = new Chart(ctx, {\n                    type: 'line', data: data, options: {\n                        maintainAspectRatio: false,\n                        scales: { y: { beginAtZero: false, grid: { color: GRID_COLOR }, ticks: { callback: value => `${(value\/10000).toFixed(1)}\u5146\u5186` } }, x: { grid: { display: false } } },\n                        plugins: { legend: { position: 'top' }, tooltip: { mode: 'index', intersect: false, callbacks: { title: tooltipTitleCallback } } }\n                    }\n                });\n            };\n\n            const initJpMarketCompositionChart = () => {\n                const ctx = document.getElementById('jpMarketCompositionChart');\n                if (!ctx) return;\n                const data = {\n                    labels: ['\u30b2\u30fc\u30e0\u7cfbIP', '\u30a2\u30cb\u30e1\u30fb\u30de\u30f3\u30acIP', '\u4f01\u696d\u30ad\u30e3\u30e9\u30af\u30bf\u30fc', '\u305d\u306e\u4ed6'],\n                    datasets: [{ data: [45.5, 42.1, 8.4, 4.0], backgroundColor: ['#005A9C', '#5BC0DE', '#6C757D', '#F8F9FA'], hoverOffset: 4 }]\n                };\n                charts.jpMarket = new Chart(ctx, {\n                    type: 'doughnut', data: data, options: {\n                        maintainAspectRatio: false,\n                        plugins: { legend: { position: 'bottom' }, tooltip: { callbacks: { title: tooltipTitleCallback, label: (c) => `${c.label}: ${c.parsed}%` } } }\n                    }\n                });\n            };\n\n            const setupNavigation = () => {\n                const navContainer = document.getElementById('nav-container');\n                const contentSections = document.querySelectorAll('.content-section');\n                const navButtons = navContainer.querySelectorAll('.nav-button');\n\n                navContainer.addEventListener('click', (e) => {\n                    const targetButton = e.target.closest('.nav-button');\n                    if (!targetButton) return;\n\n                    const targetId = targetButton.dataset.target;\n                    \n                    navButtons.forEach(btn => btn.classList.remove('active'));\n                    targetButton.classList.add('active');\n\n                    contentSections.forEach(section => {\n                        section.classList.remove('active');\n                        if (section.id === targetId) {\n                            section.classList.add('active');\n                        }\n                    });\n                });\n            };\n            \n            const setupInteractions = () => {\n                document.getElementById('highlight-jp-btn')?.addEventListener('click', () => {\n                    if (!charts.topLicensors) return;\n                    const newColors = [...BASE_COLORS];\n                    const jpIndices = [4, 9]; \n                    jpIndices.forEach(i => newColors[i] = ACCENT_COLOR_JP);\n                    charts.topLicensors.data.datasets[0].backgroundColor = newColors;\n                    charts.topLicensors.update();\n                });\n\n                document.getElementById('reset-colors-btn')?.addEventListener('click', () => {\n                     if (!charts.topLicensors) return;\n                     charts.topLicensors.data.datasets[0].backgroundColor = [...BASE_COLORS];\n                     charts.topLicensors.update();\n                });\n\n                document.querySelectorAll('.toggle-dataset-btn').forEach(button => {\n                    button.addEventListener('click', (e) => {\n                        const datasetIndex = e.target.dataset.dataset;\n                        if (!charts.animeMarket || datasetIndex === undefined) return;\n                        const isVisible = charts.animeMarket.isDatasetVisible(datasetIndex);\n                        charts.animeMarket.setDatasetVisibility(datasetIndex, !isVisible);\n                        charts.animeMarket.update();\n                    });\n                });\n            };\n\n            initTopLicensorsChart();\n            initAnimeMarketChart();\n            initJpMarketCompositionChart();\n            setupNavigation();\n            setupInteractions();\n        });\n    <\/script>\n\n<\/body>\n<\/html>\n\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>IP\uff08\u77e5\u7684\u8ca1\u7523\uff09\uff1f Interactive Analysis: Glo&hellip;<\/p>\n","protected":false},"author":1,"featured_media":721,"comment_status":"closed","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[26],"tags":[],"class_list":["post-720","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-26"],"_links":{"self":[{"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/posts\/720","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=720"}],"version-history":[{"count":1,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/posts\/720\/revisions"}],"predecessor-version":[{"id":722,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/posts\/720\/revisions\/722"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=\/wp\/v2\/media\/721"}],"wp:attachment":[{"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=720"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=720"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tamani-manabu.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=720"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}