Showing Posts From

投資信託

01 Nov, 2025
- 資産公開

【資産公開】2025年11月｜総資産2,366万円（先月比+263万円）

こんにちは。サラリーマン投資家ブロガーの「ぐりっと」です。僕は毎月1回、ブログで金融資産を公開しています。理由は３つあります。１つは自分のモチベーションを維持するため、そして振り返るきっかけをつくるため。そして、誰かの役に立つため。ただし３つめは、役に立たない、モチベーションが下がる、あまりにも自分の環境が異なる。個人的には３つめはあまり役に立たない人も多いかもしれないので、参考程度で考えてみてほしい。さて今月の総資産は以下のとおりです。2025年11月1日時点の金融資産（表） /* ------------------ */ /* グラフ・表共通設定 */ /* ------------------ */ /* グラフと表で使う Noto Sans JP フォントを全体に適用 */ * { font-family: 'Noto Sans JP', sans-serif; } /* 共通クラス */ .text-center { text-align: center !important; } .positive { color: #2e8b57; } .negative { color: #dc3545; } /* ------------------ */ /* 表のスタイル */ /* ------------------ */ .asset-table { width: 100%; border-collapse: collapse; margin: 20px 0; } .asset-table th { background-color: #05374b; color: white; text-align: center; padding: 8px; } .asset-table td { border: 1px solid #ddd; padding: 8px; text-align: right; } .asset-table tr:nth-child(even) { background-color: #f2f2f2; } /* ------------------ */ /* グラフのスタイル */ /* ------------------ */ .chart-container { max-width: 800px; margin: 0 auto; background: white; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1); padding: 30px; } .controls { text-align: center; margin-bottom: 30px; } .btn-group { display: inline-flex; gap: 8px; background: #f1f3f4; padding: 4px; border-radius: 8px; } .toggle-btn { padding: 10px 20px; border: none; background: transparent; color: #666; border-radius: 6px; cursor: pointer; font-weight: 500; transition: all 0.3s ease; font-family: 'Noto Sans JP', sans-serif; } .toggle-btn.active { background: #05374b; color: white; box-shadow: 0 2px 4px rgba(5, 55, 75, 0.3); } .toggle-btn:hover:not(.active) { background: #e8eaed; } .chart-wrapper { position: relative; height: 500px; } .summary-info { margin-top: 20px; padding: 20px; background: #f8f9fa; border-radius: 8px; text-align: center; } .total-amount { font-size: 1.8em; font-weight: 700; color: #05374b; margin-bottom: 8px; } .month-change { font-size: 1.2em; font-weight: 500; } /* グラフのレスポンシブ対応 */ @media (max-width: 768px) { .chart-container { padding: 20px; margin: 10px; } .chart-wrapper { height: 400px; } .btn-group { flex-direction: column; width: 100%; } .toggle-btn { width: 100%; margin: 2px 0; } .total-amount { font-size: 1.5em; } } 金融資産内訳(円) 先月との比較(円) 構成比率総資産 23,666,527 +2,633,520 100.0% 現金 1,779,372 -7,655 7.5% 日本株 376,000 -6,300 1.6% 投資信託 11,251,885 +751,654 47.5% 米国株 4,361,647 +272,542 18.4% ETF 3,412,277 +130,672 14.4% インドネシア株 541,668 +38,922 2.3% マレーシア株 222,162 +8,188 2.3% 仮想通貨 226,284 +3,997 1.0% 企業型DC 1,495,232 +53,732 6.3%---金融資産構成（グラフ）資産構成先月比変動 ¥23,666,527 先月比 +¥2,633,520 // Chart.js読み込みチェック if (typeof Chart === 'undefined') { console.error('Chart.js が読み込まれていません'); } // データラベルプラグインの登録 if (typeof ChartDataLabels !== 'undefined') { Chart.register(ChartDataLabels); } // 中央テキスト描画プラグイン const centerTextPlugin = { id: 'centerText', beforeDraw: function(chart) { const { ctx, width, height } = chart; ctx.restore(); const fontSize = Math.min(width, height) / 12.5 * 0.9; ctx.font = `bold ${fontSize}px Noto Sans JP`; ctx.textBaseline = 'middle'; ctx.textAlign = 'center'; ctx.fillStyle = '#05374b'; const line1 = '2025年11月'; const line2 = '金融資産'; const textX = width / 2; const textY = height / 2 - fontSize * 1.2; const lineHeight = fontSize * 1.2; ctx.fillText(line1, textX, textY - lineHeight / 2); ctx.fillText(line2, textX, textY + lineHeight / 2); ctx.save(); } }; // プラグインを登録 if (typeof centerTextPlugin !== 'undefined') { // 既に登録されていないか確認 if (!Chart.registry.plugins.get('centerText')) { Chart.register(centerTextPlugin); } } // データ定義 const financialData1 = { composition: { "投資信託": 11251885, "米国株": 4361647, "ETF": 3412277, "現金": 1779372, "企業型DC": 1495232, "インドネシア株": 541668, "日本株": 376000, "仮想通貨": 226284, "マレーシア株": 222162 }, change: { "投資信託": 751654, "米国株": 272542, "ETF": 130672, "企業型DC": 53732, "インドネシア株": 38922, "マレーシア株": 8188, "仮想通貨": 3997, "日本株": -6300, "現金": -7655 } }; // カラーパレット（項目別固定色） const itemColors1 = { "現金": '#05374b', "投資信託": '#A2D7D4', "米国株": '#FFBADD', "ETF": '#BAB454', "インドネシア株": '#BADDFF', "日本株": '#C4C8E1', "マレーシア株": '#FFE4B5', "仮想通貨": '#E6E6FA', "企業型DC": '#D3D3D3' }; let chartInstance1 = null; // チャート作成関数 function createFinancialChart1(dataType) { const ctx = document.getElementById('financialChart1').getContext('2d'); if (chartInstance1) { chartInstance1.destroy(); } const data = financialData1[dataType]; const labels = Object.keys(data); const values = Object.values(data); const backgroundColors = labels.map(label => { return itemColors1[label] || '#cccccc'; }); const chartConfig = { type: 'doughnut', data: { labels: labels, datasets: [{ data: values.map(Math.abs), backgroundColor: backgroundColors, borderWidth: 2, borderColor: '#ffffff' }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { datalabels: { color: '#ffffff', font: function(context) { const labelName = labels[context.dataIndex]; if (dataType === 'change' && (labelName === 'インドネシア株' || labelName === '日本株' || labelName === '現金')) { return { family: 'Noto Sans JP', size: 11, weight: 'bold' }; } return { family: 'Noto Sans JP', size: 22, weight: 'bold' }; }, formatter: function(value, context) { const originalValue = values[context.dataIndex]; const totalAbs = values.reduce((sum, v) => sum + Math.abs(v), 0); const percentage = ((Math.abs(originalValue) / totalAbs) * 100); const labelName = labels[context.dataIndex]; if (percentage = 0 ? '+' : ''; return labelName + '\n(' + sign + (originalValue / 10000).toFixed(0) + '万)'; } }, display: function(context) { const originalValue = values[context.dataIndex]; const totalAbs = values.reduce((sum, v) => sum + Math.abs(v), 0); const percentage = ((Math.abs(originalValue) / totalAbs) * 100); return percentage >= 5; } }, legend: { position: 'bottom', labels: { padding: 20, usePointStyle: true, font: { family: 'Noto Sans JP', size: 12 }, generateLabels: function(chart) { const data = chart.data; if (data.labels.length && data.datasets.length) { return data.labels.map((label, i) => { const value = values[i]; const absValue = Math.abs(value); const percentage = ((absValue / values.reduce((sum, v) => sum + Math.abs(v), 0)) * 100).toFixed(1); let displayText = label; if (dataType === 'composition') { displayText += ` (${percentage}%)`; } else { displayText += ` (${value >= 0 ? '+' : ''}${value.toLocaleString()}円)`; } return { text: displayText, fillStyle: backgroundColors[i], hidden: false, index: i }; }); } return []; } } }, tooltip: { backgroundColor: 'rgba(0,0,0,0.8)', titleFont: { family: 'Noto Sans JP', size: 14 }, bodyFont: { family: 'Noto Sans JP', size: 12 }, callbacks: { label: function(context) { const value = values[context.dataIndex]; const absValue = Math.abs(value); if (dataType === 'composition') { const percentage = ((absValue / values.reduce((sum, v) => sum + Math.abs(v), 0)) * 100).toFixed(1); return `${context.label}: ¥${absValue.toLocaleString()} (${percentage}%)`; } else { return `${context.label}: ${value >= 0 ? '+' : ''}¥${value.toLocaleString()}`; } } } } }, animation: { animateRotate: true, duration: 1000 }, elements: { arc: { borderWidth: 2 } } }, plugins: [ChartDataLabels, centerTextPlugin] }; chartInstance1 = new Chart(ctx, chartConfig); } // イベントリスナー // ページが読み込まれたとき、またはこのスクリプトが実行されたときにチャートを描画 document.addEventListener('DOMContentLoaded', function() { // 既にChartが描画済みでないかチェック if (!chartInstance1 && document.getElementById('financialChart1')) { createFinancialChart1('composition'); } // ボタンのイベントリスナー（重複登録を避けるため、一度だけ登録する工夫） const controls = document.querySelector('.chart-container .controls'); if (controls && !controls.dataset.listenerAttached) { controls.dataset.listenerAttached = 'true'; document.querySelectorAll('.toggle-btn').forEach(btn => { btn.addEventListener('click', function() { document.querySelectorAll('.toggle-btn').forEach(b => b.classList.remove('active')); this.classList.add('active'); const chartType = this.getAttribute('data-chart'); createFinancialChart1(chartType); }); }); } });🔖 感想・まとめ企業型DCもあり好調でした。円安の影響も大きかった気がします。さあ年末に向けてがんばっていきましょう。