From 358329632935730ea5b5bee02c52a97f79e575e9 Mon Sep 17 00:00:00 2001 From: lld <15027638633@163.com> Date: Thu, 19 Mar 2026 15:34:11 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8E=86=E5=8F=B2=E6=B8=A9=E5=BA=A6=E6=9A=82?= =?UTF-8?q?=E6=97=B6=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/data/index.vue | 18 ++++++++++++++-- .../js_sdk/u-charts/config-ucharts.js | 21 +++++++++++++++---- 2 files changed, 33 insertions(+), 6 deletions(-) diff --git a/pages/data/index.vue b/pages/data/index.vue index 7a75a1d..169634e 100644 --- a/pages/data/index.vue +++ b/pages/data/index.vue @@ -4,7 +4,7 @@ - + @@ -24,8 +24,13 @@ :canvas2d="true" canvasId="nMPkeQGNEosMwoWKKNRBZBIEhguMoMWp" :ontouch="true" + :disableScroll="true" :onmovetip="true" + :onzoom="true" + tooltipFormat="tooltipDemo" + /> + @@ -41,6 +46,12 @@ export default { chartData: {}, //这里的 opts 是图表类型 type="line" 的全部配置参数,您可以将此配置复制到 config-ucharts.js 文件中下标为 ['line'] 的节点中来覆盖全局默认参数。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式,达到页面简洁的需求。 opts: { + legend: { + }, + xAxis: { + rotateAngle: 75, + format: "xAxisDemo" + }, yAxis: { gridType: "dash", dashLength: 2, @@ -202,6 +213,9 @@ export default { changeDate(date) { // date[0]-date[1] console.info("日期选择器:",date) + if (date[0] === date[1]) { + this.dateRange[0] = parseTime(date[0], '{y}-{m}-{d} 00:00:00') + } if (this.imei) { this.getServerData(); } @@ -214,6 +228,6 @@ export default { /* 请根据实际需求修改父元素尺寸,组件自动识别宽高 */ .charts-box { width: 100%; - height: 300px; + height: 500px; } \ No newline at end of file diff --git a/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js b/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js index 167ff27..2b06025 100644 --- a/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js +++ b/uni_modules/qiun-data-charts/js_sdk/u-charts/config-ucharts.js @@ -57,8 +57,21 @@ const cfu = { "yAxisDemo1":function(val, index, opts){return val+'元'}, "yAxisDemo2":function(val, index, opts){return val.toFixed(2)}, "xAxisDemo1":function(val, index, opts){return val+'年';}, + "xAxisDemo":function(val, index, opts){ + if (!val || typeof val === 'number' || !isNaN(val)) return ""; + return val.split(" ")[1]; + }, "xAxisDemo2":function(val, index, opts){return formatDateTime(val,'h:m')}, "seriesDemo1":function(val, index, series, opts){return val+'元'}, + "tooltipDemo":function(item, category, index, opts){ + if(index!==0) { + var unit = "%RH"; + if (item.name.includes("温度")) { + unit = "℃"; + } + return `${item.name}: ${item.data} ${unit}` + } + }, "tooltipDemo1":function(item, category, index, opts){ if(index==0){ return '随便用'+item.data+'年' @@ -329,14 +342,14 @@ const cfu = { lineHeight: 20, fontColor: "#FFFFFF", legendShow: true, - legendShape: "auto", - splitLine: true, + legendShape: "square", horizentalLine: false, - xAxisLabel: false, + splitLine: true, + xAxisLabel: true, yAxisLabel: false, labelBgColor: "#FFFFFF", labelBgOpacity: 0.7, - labelFontColor: "#666666" + labelFontColor: "#ff0d0d" }, markLine: { type: "solid",