📝 docs(charts): 更新故事016.015文档并调整测试配置

更新内容：
- 记录 BaseChart.tsx 修复的根本原因
- 添加 Taro 2D 示例的正确用法说明
- 记录三个版本的测试组件创建过程
- 更新文件列表和变更日志

测试配置调整：
- 关闭 Canvas 2D + 模块化TS版本
- 启用 Canvas 2D + 原始JS版本
- 保留 Legacy版本用于对比

🤖 Generated with [Claude Code](https://claude.com/claude-code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

docs/stories/016.015.story.md

@@ -231,11 +231,11 @@ const config = {
 
 ### Debug Log References
 
-无（经过分析后确认原始代码是正确的）
+无（经过分析后确认原始代码是正确的，问题出在 BaseChart 传入 uCharts 的参数）
 
 ### Completion Notes
 
-**问题分析结果**：
+**第一阶段分析：原始代码验证**
 
 经过对比原始 u-charts.js 代码，发现**原始代码是正确的**，应该保持 `* opts.pix` 的写法。
 
@@ -244,29 +244,102 @@ const config = {
 | 项目 | 旧版 Canvas API | Canvas 2D API (我们的实现) |
 |------|----------------|---------------------------|
 | Canvas width/height 属性 | 逻辑像素 | **实际像素** (逻辑×pixelRatio) |
-| opts.width/opts.height | 逻辑像素 | 逻辑像素 |
+| opts.width/opts.height | 逻辑像素 | **应该**是逻辑像素 |
 | 绘制坐标 | **需要** × opts.pix | **需要** × opts.pix |
 | 字体大小、线宽 | **需要** × opts.pix | **需要** × opts.pix |
 
-**关键理解**：
-虽然使用 Canvas 2D API，Canvas 的 width/height 属性是实际像素，但 **Taro 的 CanvasContext 不会自动缩放坐标**。因此绘制时仍需将逻辑坐标乘以 pixelRatio 转换为实际像素坐标。
+**关键发现 - Taro 2D 示例的正确用法**：
 
-**结论**：
-- 原始 u-charts.js 的代码是正确的
-- 不需要修改任何代码
-- 保持与原始 u-charts.js 一致的实现
+参考 `docs/小程序图表库示例/taro-2d柱状图使用示例.md`，发现：
+
+```javascript
+// Taro 2D Canvas 示例中的正确用法
+const canvas = res[0].node;
+const ctx = canvas.getContext('2d');
+canvas.width = res[0].width * pixelRatio;  // 实际像素
+canvas.height = res[0].height * pixelRatio; // 实际像素
+
+uChartsInstance[id] = new uCharts({
+  type: "column",
+  context: ctx,
+  width: cWidth * pixelRatio,  // ✅ 传入 uCharts 的 width 也要 × pixelRatio！
+  height: cHeight * pixelRatio, // ✅ 传入 uCharts 的 height 也要 × pixelRatio！
+  pixelRatio: pixelRatio,
+  // ...
+});
+```
+
+**根本原因**：
+
+在 `BaseChart.tsx` 中，传入 uCharts 构造函数的 `width` 和 `height` **没有乘以 pixelRatio**，导致绘制坐标计算错误。
+
+**修复方案**：
+
+修改 `mini-ui-packages/mini-charts/src/components/BaseChart.tsx`：
+
+```typescript
+// 修复前（错误）
+const chartConfig: ChartsConfig = {
+  type,
+  context: ctx,
+  width: cWidth,      // ❌ 只传了逻辑像素
+  height: cHeight,    // ❌ 只传了逻辑像素
+  pixelRatio: actualPixelRatio,
+  // ...
+};
+
+// 修复后（正确）
+const chartConfig: ChartsConfig = {
+  type,
+  context: ctx,
+  width: cWidth * actualPixelRatio,  // ✅ 乘以 pixelRatio
+  height: cHeight * actualPixelRatio, // ✅ 乘以 pixelRatio
+  pixelRatio: actualPixelRatio,
+  // ...
+};
+```
+
+**测试对比**：
+
+为了验证修复效果，创建了三个版本的组件：
 
-**验证方法**：
-- 运行 `pnpm build` 构建成功
-- 在实际设备或小程序中测试柱状图显示
+1. **Canvas 2D + 模块化 TS** (`ColumnChart`) - 当前版本，已修复
+2. **Canvas 2D + 原始 JS** (`ColumnChartOriginal2D`) - 使用原始 u-charts.js + Canvas 2D API
+3. **旧 Canvas API + 原始 JS** (`ColumnChartLegacy`) - 使用旧的 Canvas API
+
+**新增文件**：
+- `mini-ui-packages/mini-charts/src/components/BaseChartOriginal2D.tsx`
+- `mini-ui-packages/mini-charts/src/components/ColumnChartOriginal2D.tsx`
+- `mini-ui-packages/mini-charts/src/lib/u-charts-original.ts`
+- `mini-ui-packages/mini-charts/src/types/u-charts-original.d.ts`
+- `mini-ui-packages/mini-charts/src/lib/u-charts-original.js` (原始 JS 文件副本)
+
+**结论**：
+- 问题根源：`BaseChart.tsx` 传入 uCharts 的 width/height 没有乘以 pixelRatio
+- 修复方案：将 `width` 和 `height` 乘以 `actualPixelRatio`
+- 测试方法：在 Statistics 页面可以对比三个版本的渲染效果
 
 ### File List
 
-无需修改（原始代码是正确的）
+**已修复**：
+- `mini-ui-packages/mini-charts/src/components/BaseChart.tsx` - 修复 width/height 需要乘以 pixelRatio
+
+**新增（用于测试对比）**：
+- `mini-ui-packages/mini-charts/src/components/BaseChartOriginal2D.tsx` - 原始 JS + Canvas 2D 版本
+- `mini-ui-packages/mini-charts/src/components/ColumnChartOriginal2D.tsx` - Original2D 柱状图组件
+- `mini-ui-packages/mini-charts/src/lib/u-charts-original.ts` - 类型定义
+- `mini-ui-packages/mini-charts/src/types/u-charts-original.d.ts` - 模块声明
+- `mini-ui-packages/mini-charts/src/lib/u-charts-original.js` - 原始 u-charts.js 副本
+
+**已更新**：
+- `mini-ui-packages/mini-charts/package.json` - 添加 Original2D 组件导出
+- `mini-ui-packages/yongren-statistics-ui/src/pages/Statistics/Statistics.tsx` - 添加对比测试
 
 ### Change Log
 
 - 2025-12-29: 经过分析确认原始代码正确，无需修改
+- 2025-12-29: 发现 Taro 2D 示例的正确用法，修复 BaseChart.tsx 传入 uCharts 的参数
+- 2025-12-29: 创建 Original2D 和 Legacy 组件用于对比测试
 
 ### Status
 

mini-ui-packages/yongren-statistics-ui/src/pages/Statistics/Statistics.tsx

@@ -253,7 +253,7 @@ const Statistics: React.FC<StatisticsProps> = () => {
         </View>
 
         {/* 残疾类型分布 - 当前版本（Canvas 2D + 模块化TS） */}
-        <View className="card bg-white p-4 mb-4 rounded-lg shadow-sm flex flex-col">
+        {false && (<View className="card bg-white p-4 mb-4 rounded-lg shadow-sm flex flex-col">
           <Text className="font-semibold text-gray-700">残疾类型分布 (Canvas 2D + 模块化TS)</Text>
           {isLoadingDisability ? (
             <Text className="text-gray-500 text-center py-4">加载中...</Text>
@@ -289,10 +289,10 @@ const Statistics: React.FC<StatisticsProps> = () => {
               }
             })()
           )}
-        </View>
+        </View>)}
 
         {/* 残疾类型分布 - Original2D版本（Canvas 2D + 原始JS） */}
-        {false && (<View className="card bg-white p-4 mb-4 rounded-lg shadow-sm flex flex-col">
+        {true && (<View className="card bg-white p-4 mb-4 rounded-lg shadow-sm flex flex-col">
           <Text className="font-semibold text-gray-700">残疾类型分布 (Canvas 2D + 原始JS)</Text>
           {isLoadingDisability ? (
             <Text className="text-gray-500 text-center py-4">加载中...</Text>