修改注释
This commit is contained in:
@@ -156,7 +156,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
pointColor = "rgba(255, 255, 255, 0.9)",
|
||||
} = options;
|
||||
|
||||
// 创建绘图上下文 - iOS兼容性检查
|
||||
// 创建绘图上下文
|
||||
let ctx;
|
||||
try {
|
||||
ctx = uni.createCanvasContext(canvasId);
|
||||
@@ -165,14 +165,14 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("创建canvas上下文失败:", error);
|
||||
reject(new Error("iOS兼容性:Canvas上下文创建失败"));
|
||||
reject(new Error("Canvas上下文创建失败"));
|
||||
return;
|
||||
}
|
||||
|
||||
// 清空画布
|
||||
ctx.clearRect(0, 0, width, height);
|
||||
|
||||
// iOS兼容性:设置全局合成操作,让颜色叠加更自然
|
||||
// 设置全局合成操作,让颜色叠加更自然
|
||||
try {
|
||||
ctx.globalCompositeOperation = "screen";
|
||||
} catch (error) {
|
||||
@@ -192,7 +192,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
let frameCount = 0;
|
||||
|
||||
const processChunk = () => {
|
||||
// iOS兼容性:使用Date.now()作为performance.now的回退
|
||||
// 使用Date.now()作为performance.now的回退
|
||||
const startTime =
|
||||
typeof performance !== "undefined" && performance.now
|
||||
? performance.now()
|
||||
@@ -216,7 +216,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
// 如果处理时间超过8ms,保存状态并中断
|
||||
index = i + 1;
|
||||
ctx.restore();
|
||||
// iOS兼容性:更安全的requestAnimationFrame检测
|
||||
// 更安全的requestAnimationFrame检测
|
||||
if (typeof requestAnimationFrame === "function") {
|
||||
try {
|
||||
requestAnimationFrame(processChunk);
|
||||
@@ -244,7 +244,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
const processingTime = currentTime - startTime;
|
||||
const delay = processingTime > 16 ? 8 : 1; // 根据处理时间动态调整
|
||||
|
||||
// iOS兼容性:更安全的requestAnimationFrame检测
|
||||
// 更安全的requestAnimationFrame检测
|
||||
if (typeof requestAnimationFrame === "function") {
|
||||
try {
|
||||
requestAnimationFrame(processChunk);
|
||||
@@ -264,7 +264,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
});
|
||||
};
|
||||
|
||||
// 处理单个点的函数 - iOS兼容性优化
|
||||
// 处理单个点的函数
|
||||
const processPoint = (point) => {
|
||||
const [x, y, density] = point;
|
||||
const normalizedX = (x - range[0]) / (range[1] - range[0]);
|
||||
@@ -273,7 +273,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
const canvasY = normalizedY * height;
|
||||
const color = getHeatColor(density);
|
||||
|
||||
// iOS兼容性:确保数值有效
|
||||
// 确保数值有效
|
||||
if (
|
||||
isNaN(canvasX) ||
|
||||
isNaN(canvasY) ||
|
||||
@@ -306,7 +306,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
// 使用分片处理绘制缓存数据
|
||||
await processInChunks(cachedDensityData, 200); // 每批处理200个点,减少单次处理量
|
||||
|
||||
// 绘制原始数据点 - iOS兼容性优化
|
||||
// 绘制原始数据点
|
||||
if (showPoints) {
|
||||
ctx.setFillStyle(pointColor);
|
||||
ctx.beginPath(); // 开始批量路径
|
||||
@@ -321,7 +321,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
const canvasX = normalizedX * width;
|
||||
const canvasY = normalizedY * height;
|
||||
|
||||
// iOS兼容性:确保坐标有效
|
||||
// 确保坐标有效
|
||||
if (
|
||||
!isNaN(canvasX) &&
|
||||
!isNaN(canvasY) &&
|
||||
@@ -374,7 +374,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
// 使用分片处理绘制热力图网格
|
||||
await processInChunks(densityData, 200); // 每批处理200个点,减少单次处理量
|
||||
|
||||
// 绘制原始数据点 - iOS兼容性优化
|
||||
// 绘制原始数据点
|
||||
if (showPoints) {
|
||||
ctx.setFillStyle(pointColor);
|
||||
ctx.beginPath(); // 开始批量路径
|
||||
@@ -387,7 +387,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
const canvasX = normalizedX * width;
|
||||
const canvasY = normalizedY * height;
|
||||
|
||||
// iOS兼容性:确保坐标有效
|
||||
// 确保坐标有效
|
||||
if (
|
||||
!isNaN(canvasX) &&
|
||||
!isNaN(canvasY) &&
|
||||
@@ -405,7 +405,7 @@ export function drawKDEHeatmap(canvasId, width, height, points, options = {}) {
|
||||
}
|
||||
}
|
||||
|
||||
// 执行绘制 - iOS兼容性优化
|
||||
// 执行绘制
|
||||
ctx.draw(
|
||||
false,
|
||||
() => {
|
||||
@@ -438,15 +438,15 @@ export function generateKDEHeatmapImage(
|
||||
return new Promise((resolve, reject) => {
|
||||
drawKDEHeatmap(canvasId, width, height, points, options)
|
||||
.then(() => {
|
||||
// 生成图片 - iOS兼容性优化
|
||||
// 生成图片
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId: canvasId,
|
||||
width: width,
|
||||
height: height,
|
||||
destWidth: width * 2, // iOS兼容性:降低分辨率避免内存问题
|
||||
destWidth: width * 2, // 降低分辨率避免内存问题
|
||||
destHeight: height * 2,
|
||||
fileType: "png", // iOS兼容性:明确指定png格式
|
||||
quality: 1, // iOS兼容性:最高质量
|
||||
fileType: "png", // 明确指定png格式
|
||||
quality: 1, // 最高质量
|
||||
success: (res) => {
|
||||
console.log("KDE热力图图片生成成功:", res.tempFilePath);
|
||||
resolve(res.tempFilePath);
|
||||
|
||||
@@ -91,12 +91,6 @@ const loadData = async () => {
|
||||
rect.width,
|
||||
rect.height,
|
||||
weekArrows,
|
||||
{
|
||||
range: [0, 1],
|
||||
gridSize: 80, // 先使用较小的gridSize快速显示
|
||||
bandwidth: 0.2,
|
||||
showPoints: false,
|
||||
}
|
||||
);
|
||||
heatMapImageSrc.value = quickPath;
|
||||
// 延迟后再渲染精细版本
|
||||
|
||||
Reference in New Issue
Block a user