【Flutter】graphic图表实现自定义tooltip
renderer
graphic中tooltip的TooltipGuide类提供了renderer方法，接收三个参数Size类型，Offset类型，Map<int, Tuple>类型。可查到的文档是真的少，所以只能在源码中扒拉例子，做符合需求的修改。
官方github示例
官方示例
这个例子感觉像是tooltip和提供的那些属性的源码实现，然后改变了背景颜色等，但如果实现想echarts那样对每条线的数据前增加颜色块区分，还是要自己摸索。先看一下这个例子都做了什么吧
List<MarkElement> simpleTooltip(Size size,Offset anchor,Map<int, Tuple> selectedTuples,) {// 返回的元素列表List<MarkElement> elements;// 生成tooltip内容String textContent = '';// 选中的数据 ({date: xxx, name: 线条1, points: xxx}, {date: xx, name: 线条2, points: xx}...)final selectedTupleList = selectedTuples.values;// 选中的数据的字段名列表// 单条线：[date, points]// 多条线：会通过name区分不同线的数值[date, name, points]final fields = selectedTupleList.first.keys.toList();// 如果只有一条线if (selectedTuples.length == 1) {// 取出选中的数据final original = selectedTupleList.single;// 取出第一个字段的值var field = fields.first;// 将第一个字段的值放入到tooltip的第一行/*** 此时的数据结构是：* date: 2023-11-24*/textContent += '$field: ${original[field]}';// 遍历字段名列表for (var i = 1; i < fields.length; i++) {// 取出第i个字段field = fields[i];// 将第i个字段的值放入到tooltip的第二行/*** 遍历后的数据结构是：* date: 2023-11-24* points: 123*/textContent += '\n$field: ${original[field]}';}} else {// 如果有多条线// 遍历选中的数据（几条线几条数据），将每个数据的第二个字段和第三个字段的值放入到tooltip的第二行和第三行for (var original in selectedTupleList) {// 取出第一个字段final domainField = fields.first;// 取出最后一个字段final measureField = fields.last;/*** 遍历结束后的数据结构是：* 2023-11-24：线条1* 2023-11-24：线条2* ....*/textContent += '\n${original[domainField]}: ${original[measureField]}';}}// 提出一些变量const textStyle = TextStyle(fontSize: 12, color: Colors.white);const padding = EdgeInsets.all(5);const align = Alignment.topRight;const offset = Offset(5, -5);const elevation = 1.0;const backgroundColor = Colors.black;final painter = TextPainter(text: TextSpan(text: textContent, style: textStyle),textDirection: TextDirection.ltr,);painter.layout();// 计算tooltip的宽高final width = padding.left + painter.width + padding.right;final height = padding.top + painter.height + padding.bottom;// 调整tooltip弹框（包含内容）的位置final paintPoint = getBlockPaintPoint(anchor + offset,width,height,align,);// 调整tooltip弹框（不包含内容）的位置final window = Rect.fromLTWH(paintPoint.dx,paintPoint.dy,width,height,);// 计算tooltip文本的位置var textPaintPoint = paintPoint + padding.topLeft;elements = <MarkElement>[RectElement(rect: window,style: PaintStyle(fillColor: backgroundColor, elevation: elevation)),LabelElement(text: textContent,anchor: textPaintPoint,style:LabelStyle(textStyle: textStyle, align: Alignment.bottomRight)),];return elements;}
效果
根据需求调整
改动后代码
List<MarkElement> simpleTooltip(Size size,Offset anchor,Map<int, Tuple> selectedTuples,) {// 返回的元素列表List<MarkElement> elements;// 标识元素列表List<MarkElement> tagElements = [];// 生成tooltip内容String textContent = '';// 选中的数据 ({date: xxx, name: 线条1, points: xxx}, {date: xx, name: 线条2, points: xx}...)final selectedTupleList = selectedTuples.values;// 选中的数据的字段名列表 [date, name, points]final fields = selectedTupleList.first.keys.toList();// 选中的数据的第一个数据的第一个字段的值，放入到tooltip的第一行/*** 目前的数据结构是：* 2023-11-24*/textContent = '${selectedTupleList.first[fields.first]}';// 遍历选中的数据（几条线几条数据），将每个数据的第二个字段和第三个字段的值放入到tooltip的第二行和第三行for (var original in selectedTupleList) {final domainField = fields[1];final measureField = fields.last;/*** 遍历结束后的数据结构是：* 2023-11-24* 线条1: 123* 线条2: 456* ....*/textContent += '\n ${original[domainField]}: ${original[measureField]}';}// 提出一些变量const textStyle = TextStyle(fontSize: 12, color: Colors.black, height: 2);const padding = EdgeInsets.all(5);const align = Alignment.topRight;const offset = Offset(5, -5);const elevation = 1.0;const backgroundColor = Colors.white;final painter = TextPainter(text: TextSpan(text: textContent, style: textStyle),textDirection: ui.TextDirection.ltr,);painter.layout();// tooltip的宽高final width = padding.left + painter.width + padding.right;final height = padding.top + painter.height + padding.bottom;// tooltip的位置// 大概根据中间的数据判断算了下位置,避免一直在左或右,边界超出屏幕final move = anchor < const Offset(250, 90)? anchor + offset - const Offset(-10, -40): anchor + Offset(-width - 20, 40);final paintPoint = getBlockPaintPoint(move,width,height,align,);final window = Rect.fromLTWH(paintPoint.dx - 10, //横向位置paintPoint.dy,width + 20,height,);var textPaintPoint = paintPoint + padding.topLeft;// 生成tooltip线条前的标识元素for (int i = 0; i < selectedTupleList.length; i++) {tagElements.add(LabelElement(text: '●',anchor: textPaintPoint + padding.topLeft + Offset(-15, 26 + i * 23),style: LabelStyle(textStyle: TextStyle(color: Defaults.colors10[i],fontWeight: FontWeight.w900,fontSize: 12),align: Alignment.bottomRight)),);}elements = <MarkElement>[RectElement(rect: window,style: PaintStyle(fillColor: backgroundColor, elevation: elevation)),...tagElements,LabelElement(text: textContent,anchor: textPaintPoint,style:LabelStyle(textStyle: textStyle, align: Alignment.bottomRight)),];return elements;}
效果
整体代码
// linePage.dart
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:graphic/graphic.dart';
import 'dart:ui' as ui;
import './components/static/data.dart';class linePage extends StatelessWidget {linePage({super.key});final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();List<MarkElement> simpleTooltip(Size size,Offset anchor,Map<int, Tuple> selectedTuples,) {// 返回的元素列表List<MarkElement> elements;// 标识元素列表List<MarkElement> tagElements = [];// 生成tooltip内容String textContent = '';// 选中的数据 ({date: xxx, name: 线条1, points: xxx}, {date: xx, name: 线条2, points: xx}...)final selectedTupleList = selectedTuples.values;// 选中的数据的字段名列表 [date, name, points]final fields = selectedTupleList.first.keys.toList();// 选中的数据的第一个数据的第一个字段的值，放入到tooltip的第一行/*** 目前的数据结构是：* 2023-11-24*/textContent = '${selectedTupleList.first[fields.first]}';// 遍历选中的数据（几条线几条数据），将每个数据的第二个字段和第三个字段的值放入到tooltip的第二行和第三行for (var original in selectedTupleList) {final domainField = fields[1];final measureField = fields.last;/*** 遍历结束后的数据结构是：* 2023-11-24* 线条1: 123* 线条2: 456* ....*/textContent += '\n ${original[domainField]}: ${original[measureField]}';}// 提出一些变量const textStyle = TextStyle(fontSize: 12, color: Colors.black, height: 2);const padding = EdgeInsets.all(5);const align = Alignment.topRight;const offset = Offset(5, -5);const elevation = 1.0;const backgroundColor = Colors.white;final painter = TextPainter(text: TextSpan(text: textContent, style: textStyle),textDirection: ui.TextDirection.ltr,);painter.layout();// tooltip的宽高final width = padding.left + painter.width + padding.right;final height = padding.top + painter.height + padding.bottom;// tooltip的位置// 大概根据中间的数据判断算了下位置,避免一直在左或右,边界超出屏幕final move = anchor < const Offset(250, 90)? anchor + offset - const Offset(-10, -40): anchor + Offset(-width - 20, 40);final paintPoint = getBlockPaintPoint(move,width,height,align,);final window = Rect.fromLTWH(paintPoint.dx - 10, //横向位置paintPoint.dy,width + 20,height,);var textPaintPoint = paintPoint + padding.topLeft;// 生成tooltip线条前的标识元素for (int i = 0; i < selectedTupleList.length; i++) {tagElements.add(LabelElement(text: '●',anchor: textPaintPoint + padding.topLeft + Offset(-15, 26 + i * 23),style: LabelStyle(textStyle: TextStyle(color: Defaults.colors10[i],fontWeight: FontWeight.w900,fontSize: 12),align: Alignment.bottomRight)),);}elements = <MarkElement>[RectElement(rect: window,style: PaintStyle(fillColor: backgroundColor, elevation: elevation)),...tagElements,LabelElement(text: textContent,anchor: textPaintPoint,style:LabelStyle(textStyle: textStyle, align: Alignment.bottomRight)),];return elements;}@overrideWidget build(BuildContext context) {return SingleChildScrollView(child: Center(child: Column(children: <Widget>[Container(padding: const EdgeInsets.fromLTRB(20, 40, 20, 5),child: const Text('Smooth Line and Area chart',style: TextStyle(fontSize: 20),),),Container(margin: const EdgeInsets.only(top: 10),width: 350,height: 300,child: Chart(// 数据源data: invalidData,// 变量配置variables: {'date': Variable(accessor: (Map map) => map['date'] as String,scale: OrdinalScale(tickCount: 5, // x轴刻度数量),),'name': Variable(accessor: (Map map) => map['name'] as String,),'points': Variable(accessor: (Map map) => (map['points'] ?? double.nan) as num,),},marks: [// 线条LineMark(// 如果单线条加name则必须有position属性配置，否则是一条直线position:Varset('date') * Varset('points') / Varset('name'),shape: ShapeEncode(value: BasicLineShape(smooth: true),),// 粗细size: SizeEncode(value: 1.5),),// 线条与X轴之间区域填充AreaMark(// 如果单线条加name则必须有position属性配置，否则不显示position:Varset('date') * Varset('points') / Varset('name'),shape: ShapeEncode(value:BasicAreaShape(smooth: true), // smooth: true 使线条变得平滑),color: ColorEncode(value: Colors.pink.withAlpha(80),),),],// 坐标轴配置axes: [Defaults.horizontalAxis,Defaults.verticalAxis,],selections: {'touchMove': PointSelection(on: {GestureType.scaleUpdate,GestureType.tapDown,GestureType.hover,GestureType.longPressMoveUpdate},dim: Dim.x,)},// 触摸弹框提示tooltip: TooltipGuide(// 跟随鼠标位置// followPointer: [false, true],// align: Alignment.topLeft, // 弹框对于点击位置的对齐方式// offset: const Offset(-20, -20), // 偏移量// 使用自定义需要注释上面的一些配置renderer: simpleTooltip,),// 十字准线crosshair: CrosshairGuide(followPointer: [false, true]),),),Container(padding: const EdgeInsets.fromLTRB(20, 40, 20, 5),child: const Text('Group interactions',style: TextStyle(fontSize: 20),),),Container(margin: const EdgeInsets.only(top: 10),width: 350,height: 300,child: Chart(data: invalidData1,variables: {'date': Variable(accessor: (Map map) => map['date'] as String,scale: OrdinalScale(tickCount: 5, inflate: true),),'name': Variable(accessor: (Map map) => map['name'] as String,),'points': Variable(accessor: (Map map) => (map['points'] ?? double.nan) as num,),},coord: RectCoord(horizontalRange: [0.1, 0.99]),marks: [LineMark(position:Varset('date') * Varset('points') / Varset('name'),shape: ShapeEncode(value: BasicLineShape(smooth: true)),size: SizeEncode(value: 1.5),color: ColorEncode(variable: 'name',values: Defaults.colors10,// updaters: {// 'groupMouse': {false: (color) => color.withAlpha(100)},// // 'groupTouch': {false: (color) => color.withAlpha(100)},// },),),// PointMark(// color: ColorEncode(// variable: 'name',// values: Defaults.colors10,// updaters: {// 'groupMouse': {false: (color) => color.withAlpha(100)},// 'groupTouch': {false: (color) => color.withAlpha(100)},// },// ),// ),],axes: [Defaults.horizontalAxis,Defaults.verticalAxis,],// // 提示框选项配置selections: {'666': PointSelection(on: {GestureType.hover, GestureType.tap},// 设备devices: {PointerDeviceKind.mouse},variable: 'date',),'groupMouse': PointSelection(on: {GestureType.hover,},// variable: 'name',devices: {PointerDeviceKind.mouse},),'tooltipTouch': PointSelection(on: {GestureType.scaleUpdate,GestureType.tapDown,GestureType.longPressMoveUpdate},// variable: 'name',devices: {PointerDeviceKind.touch},),},tooltip: TooltipGuide(selections: {'tooltipTouch', '666'},// multiTuples: true,// followPointer: [false, true],// align: Alignment.topLeft,// // mark: 0,// // 与上方selections中定义的variable相排斥// variables: [// // 'date',// 'name',// 'points',// ],renderer: simpleTooltip),crosshair: CrosshairGuide(selections: {'tooltipTouch', '666'},styles: [PaintStyle(strokeColor: const Color.fromARGB(255, 92, 68, 68)),PaintStyle(strokeColor: const Color.fromARGB(0, 158, 154, 154)),],followPointer: [false, true],),),),],),),);}
}
// data.dart
const invalidData1 = [{"date": "2016-01-04", "name": "线条1", "points": 126.12},{"date": "2016-01-05", "name": "线条1", "points": 125.688},{"date": "2016-01-06", "name": "线条1", "points": 119.704},{"date": "2016-01-07", "name": "线条1", "points": 120.19},{"date": "2016-01-08", "name": "线条1", "points": 121.157},{"date": "2016-01-11", "name": "线条1", "points": 117},{"date": "2016-01-12", "name": "线条1", "points": 120},{"date": "2016-01-13", "name": "线条1", "points": 122},{"date": "2016-01-14", "name": "线条1", "points": 117.76},{"date": "2016-01-15", "name": "线条1", "points": 114.397},{"date": "2016-01-18", "name": "线条1", "points": 116.373},{"date": "2016-01-19", "name": "线条1", "points": 120.547},{"date": "2016-01-20", "name": "线条1", "points": 113.733},{"date": "2016-01-21", "name": "线条1", "points": 114.098},{"date": "2016-01-22", "name": "线条1", "points": 123.833},{"date": "2016-01-25", "name": "线条1", "points": 125},{"date": "2016-01-26", "name": "线条1", "points": 124.866},{"date": "2016-01-27", "name": "线条1", "points": 120.264},{"date": "2016-01-28", "name": "线条1", "points": 122.296},{"date": "2016-01-29", "name": "线条1", "points": 124.502},{"date": "2016-02-01", "name": "线条1", "points": 127.936},{"date": "2016-02-02", "name": "线条1", "points": null},{"date": "2016-02-03", "name": "线条1", "points": 129.95},{"date": "2016-02-04", "name": "线条1", "points": 129.275},{"date": "2016-02-05", "name": "线条1", "points": 127.898},{"date": "2016-02-08", "name": "线条1", "points": 134.9},{"date": "2016-02-09", "name": "线条1", "points": 122.819},{"date": "2016-02-10", "name": "线条1", "points": 120.108},{"date": "2016-02-11", "name": "线条1", "points": 119.447},{"date": "2016-02-12", "name": "线条1", "points": 117.8},{"date": "2016-02-15", "name": "线条1", "points": null},{"date": "2016-02-16", "name": "线条1", "points": 121.865},{"date": "2016-02-17", "name": "线条1", "points": 126.3},{"date": "2016-02-18", "name": "线条1", "points": 128.259},{"date": "2016-02-19", "name": "线条1", "points": 125.724},{"date": "2016-02-22", "name": "线条1", "points": 130},{"date": "2016-02-23", "name": "线条1", "points": 129.948},{"date": "2016-02-24", "name": "线条1", "points": 132.5},{"date": "2016-02-25", "name": "线条1", "points": 128.08},{"date": "2016-02-26", "name": "线条1", "points": 122},{"date": "2016-02-29", "name": "线条1", "points": 122},{"date": "2016-03-01", "name": "线条1", "points": 123.449},{"date": "2016-03-02", "name": "线条1", "points": double.nan},{"date": "2016-03-03", "name": "线条1", "points": 132},{"date": "2016-03-04", "name": "线条1", "points": 135},{"date": "2016-03-07", "name": "线条1", "points": 123.905},{"date": "2016-03-08", "name": "线条1", "points": 125.155},{"date": "2016-03-09", "name": "线条1", "points": 126},{"date": "2016-03-10", "name": "线条1", "points": 126.778},{"date": "2016-03-11", "name": "线条1", "points": 129.656},{"date": "2016-03-14", "name": "线条1", "points": 127.64},{"date": "2016-03-15", "name": "线条1", "points": 124.786},{"date": "2016-03-16", "name": "线条1", "points": 124.469},{"date": "2016-03-17", "name": "线条1", "points": 123.5},{"date": "2016-03-18", "name": "线条1", "points": 124.061},{"date": "2016-03-21", "name": "线条1", "points": 123.5},{"date": "2016-03-22", "name": "线条1", "points": 129.002},{"date": "2016-03-23", "name": "线条1", "points": 129},{"date": "2016-03-24", "name": "线条1", "points": 131.31},{"date": "2016-03-29", "name": "线条1", "points": 133},{"date": "2016-03-30", "name": "线条1", "points": 129.298},{"date": "2016-03-31", "name": "线条1", "points": 127.4},{"date": "2016-04-01", "name": "线条1", "points": 122.376},{"date": "2016-04-04", "name": "线条1", "points": 119.467},{"date": "2016-04-05", "name": "线条1", "points": 120.695},{"date": "2016-04-06", "name": "线条1", "points": 118.725},{"date": "2016-04-07", "name": "线条1", "points": 127.539},{"date": "2016-04-08", "name": "线条1", "points": 129.8},{"date": "2016-04-11", "name": "线条1", "points": 129.5},{"date": "2016-04-12", "name": "线条1", "points": 134.465},{"date": "2016-04-13", "name": "线条1", "points": 133},{"date": "2016-04-14", "name": "线条1", "points": 137.35},{"date": "2016-04-15", "name": "线条1", "points": 137.2},{"date": "2016-04-18", "name": "线条1", "points": 132.611},{"date": "2016-04-19", "name": "线条1", "points": 135.479},{"date": "2016-04-20", "name": "线条1", "points": 139.05},{"date": "2016-04-21", "name": "线条1", "points": 142},{"date": "2016-04-22", "name": "线条1", "points": 135.761},{"date": "2016-04-25", "name": "线条1", "points": 136.174},{"date": "2016-04-26", "name": "线条1", "points": 134.782},{"date": "2016-04-27", "name": "线条1", "points": 128},{"date": "2016-04-28", "name": "线条1", "points": 121.5},{"date": "2016-04-29", "name": "线条1", "points": 120},{"date": "2016-05-02", "name": "线条1", "points": 123.966},{"date": "2016-05-03", "name": "线条1", "points": 122.538},{"date": "2016-05-04", "name": "线条1", "points": 120},{"date": "2016-05-05", "name": "线条1", "points": 120.21},{"date": "2016-05-06", "name": "线条1", "points": 121.01},{"date": "2016-05-09", "name": "线条1", "points": double.nan},{"date": "2016-05-10", "name": "线条1", "points": 120.622},{"date": "2016-05-11", "name": "线条1", "points": 123.85},{"date": "2016-05-12", "name": "线条1", "points": 122.963},{"date": "2016-05-13", "name": "线条1", "points": 126},{"date": "2016-05-17", "name": "线条1", "points": 130},{"date": "2016-05-18", "name": "线条1", "points": 128.845},{"date": "2016-05-19", "name": "线条1", "points": 130.17},{"date": "2016-05-20", "name": "线条1", "points": 129.741},{"date": "2016-05-23", "name": "线条1", "points": 129.668},{"date": "2016-05-24", "name": "线条1", "points": 126.886},{"date": "2016-05-25", "name": "线条1", "points": 128.239},{"date": "2016-05-26", "name": "线条1", "points": 127.239},{"date": "2016-05-27", "name": "线条1", "points": 127.457},{"date": "2016-05-30", "name": "线条1", "points": 127.37},{"date": "2016-05-31", "name": "线条1", "points": 130.756},{"date": "2016-06-01", "name": "线条1", "points": 133.232},{"date": "2016-06-02", "name": "线条1", "points": 126.47},{"date": "2016-06-03", "name": "线条1", "points": 126.385},{"date": "2016-06-06", "name": "线条1", "points": 128.331},{"date": "2016-06-07", "name": "线条1", "points": 130.914},{"date": "2016-06-08", "name": "线条1", "points": 133},{"date": "2016-06-09", "name": "线条1", "points": 133.041},{"date": "2016-06-10", "name": "线条1", "points": 133.041},{"date": "2016-06-13", "name": "线条1", "points": 129},{"date": "2016-06-14", "name": "线条1", "points": 129.166},{"date": "2016-06-15", "name": "线条1", "points": 124.687},{"date": "2016-06-16", "name": "线条1", "points": 122.77},{"date": "2016-06-17", "name": "线条1", "points": 126.461},{"date": "2016-06-20", "name": "线条1", "points": 127},{"date": "2016-06-21", "name": "线条1", "points": 125.594},{"date": "2016-06-22", "name": "线条1", "points": 127.438},{"date": "2016-06-23", "name": "线条1", "points": 124.44},{"date": "2016-06-24", "name": "线条1", "points": 122.131},{"date": "2016-06-27", "name": "线条1", "points": 120.53},{"date": "2016-06-28", "name": "线条1", "points": 120.296},{"date": "2016-06-29", "name": "线条1", "points": 125.877},{"date": "2016-06-30", "name": "线条1", "points": 126.404},{"date": "2016-01-04", "name": "线条2", "points": 130.914},{"date": "2016-01-05", "name": "线条2", "points": 133},{"date": "2016-01-06", "name": "线条2", "points": 159.704},{"date": "2016-01-07", "name": "线条2", "points": 133.19},{"date": "2016-01-08", "name": "线条2", "points": 202.157},{"date": "2016-01-11", "name": "线条2", "points": 128},{"date": "2016-01-12", "name": "线条2", "points": 138},{"date": "2016-01-13", "name": "线条2", "points": 152},{"date": "2016-01-14", "name": "线条2", "points": 157.76},{"date": "2016-01-15", "name": "线条2", "points": 134.397},{"date": "2016-01-18", "name": "线条2", "points": 170.373},{"date": "2016-01-19", "name": "线条2", "points": 140.547},{"date": "2016-01-20", "name": "线条2", "points": 133.733},{"date": "2016-01-21", "name": "线条2", "points": 124.098},{"date": "2016-01-22", "name": "线条2", "points": 113.833},{"date": "2016-01-25", "name": "线条2", "points": 125},{"date": "2016-01-26", "name": "线条2", "points": 154.866},{"date": "2016-01-27", "name": "线条2", "points": 130.264},{"date": "2016-01-28", "name": "线条2", "points": 142.296},{"date": "2016-01-29", "name": "线条2", "points": 114.502},{"date": "2016-02-01", "name": "线条2", "points": 137.936},{"date": "2016-02-02", "name": "线条2", "points": null},{"date": "2016-02-03", "name": "线条2", "points": 169.95},{"date": "2016-02-04", "name": "线条2", "points": 119.275},{"date": "2016-02-05", "name": "线条2", "points": 127.898},{"date": "2016-02-08", "name": "线条2", "points": 134.9},{"date": "2016-02-09", "name": "线条2", "points": 152.819},{"date": "2016-02-10", "name": "线条2", "points": 100.108},{"date": "2016-02-11", "name": "线条2", "points": 109.447},{"date": "2016-02-12", "name": "线条2", "points": 127.8},{"date": "2016-02-15", "name": "线条2", "points": null},{"date": "2016-02-22", "name": "线条2", "points": 120},{"date": "2016-02-23", "name": "线条2", "points": 149.948},{"date": "2016-02-24", "name": "线条2", "points": 102.5},{"date": "2016-03-03", "name": "线条2", "points": 142},{"date": "2016-03-04", "name": "线条2", "points": 165},{"date": "2016-03-07", "name": "线条2", "points": 173.905},{"date": "2016-03-08", "name": "线条2", "points": 128.155},{"date": "2016-02-25", "name": "线条2", "points": 118.08},{"date": "2016-04-04", "name": "线条2", "points": 149.467},{"date": "2016-04-05", "name": "线条2", "points": 130.695},{"date": "2016-04-06", "name": "线条2", "points": 128.725},{"date": "2016-04-07", "name": "线条2", "points": 137.539},{"date": "2016-04-08", "name": "线条2", "points": 135.8},{"date": "2016-04-11", "name": "线条2", "points": 138.5},{"date": "2016-04-12", "name": "线条2", "points": 124.465},{"date": "2016-04-13", "name": "线条2", "points": 143},{"date": "2016-04-14", "name": "线条2", "points": 134.35},{"date": "2016-04-15", "name": "线条2", "points": 127.2},{"date": "2016-04-18", "name": "线条2", "points": 112.611},{"date": "2016-04-19", "name": "线条2", "points": 135.479},{"date": "2016-02-26", "name": "线条2", "points": 142},{"date": "2016-02-29", "name": "线条2", "points": 132},{"date": "2016-03-01", "name": "线条2", "points": 113.449},{"date": "2016-03-02", "name": "线条2", "points": double.nan},{"date": "2016-02-16", "name": "线条2", "points": 131.865},{"date": "2016-02-17", "name": "线条2", "points": 156.3},{"date": "2016-02-18", "name": "线条2", "points": 148.259},{"date": "2016-02-19", "name": "线条2", "points": 135.724},{"date": "2016-03-09", "name": "线条2", "points": 116},{"date": "2016-03-10", "name": "线条2", "points": 176.778},{"date": "2016-03-11", "name": "线条2", "points": 139.656},{"date": "2016-03-14", "name": "线条2", "points": 157.64},{"date": "2016-03-15", "name": "线条2", "points": double.nan},{"date": "2016-03-16", "name": "线条2", "points": 144.469},{"date": "2016-03-17", "name": "线条2", "points": 133.5},{"date": "2016-03-18", "name": "线条2", "points": 184.061},{"date": "2016-03-21", "name": "线条2", "points": 163.5},{"date": "2016-03-22", "name": "线条2", "points": 159.002},{"date": "2016-03-23", "name": "线条2", "points": 149},{"date": "2016-03-24", "name": "线条2", "points": 111.31},{"date": "2016-03-29", "name": "线条2", "points": 123},{"date": "2016-03-30", "name": "线条2", "points": 139.298},{"date": "2016-03-31", "name": "线条2", "points": 147.4},{"date": "2016-04-01", "name": "线条2", "points": 132.376},{"date": "2016-04-20", "name": "线条2", "points": 149.05},{"date": "2016-04-21", "name": "线条2", "points": 162},{"date": "2016-04-22", "name": "线条2", "points": 155.761},{"date": "2016-04-25", "name": "线条2", "points": 126.174},{"date": "2016-04-26", "name": "线条2", "points": 134.782},{"date": "2016-04-27", "name": "线条2", "points": 118},{"date": "2016-04-28", "name": "线条2", "points": 141.5},{"date": "2016-05-31", "name": "线条2", "points": 130.756},{"date": "2016-06-01", "name": "线条2", "points": 143.232},{"date": "2016-06-02", "name": "线条2", "points": 176.47},{"date": "2016-06-03", "name": "线条2", "points": 156.385},{"date": "2016-06-06", "name": "线条2", "points": 168.331},{"date": "2016-06-07", "name": "线条2", "points": 130.914},{"date": "2016-06-08", "name": "线条2", "points": 123},{"date": "2016-06-09", "name": "线条2", "points": 133.041},{"date": "2016-06-10", "name": "线条2", "points": 133.041},{"date": "2016-06-13", "name": "线条2", "points": 129},{"date": "2016-06-14", "name": "线条2", "points": null},{"date": "2016-06-15", "name": "线条2", "points": 114.687},{"date": "2016-06-16", "name": "线条2", "points": 122.77},{"date": "2016-06-17", "name": "线条2", "points": 146.461},{"date": "2016-06-20", "name": "线条2", "points": 127},{"date": "2016-06-21", "name": "线条2", "points": 155.594},{"date": "2016-06-22", "name": "线条2", "points": 127.438},{"date": "2016-06-23", "name": "线条2", "points": 134.44},{"date": "2016-06-24", "name": "线条2", "points": 112.131},{"date": "2016-06-27", "name": "线条2", "points": 100.53},{"date": "2016-06-28", "name": "线条2", "points": 150.296},{"date": "2016-06-29", "name": "线条2", "points": 135.877},{"date": "2016-06-30", "name": "线条2", "points": 126.404},{"date": "2016-04-29", "name": "线条2", "points": 130},{"date": "2016-05-02", "name": "线条2", "points": 123.966},{"date": "2016-05-03", "name": "线条2", "points": 122.538},{"date": "2016-05-04", "name": "线条2", "points": 130},{"date": "2016-05-05", "name": "线条2", "points": 120.21},{"date": "2016-05-06", "name": "线条2", "points": 131.01},{"date": "2016-05-09", "name": "线条2", "points": double.nan},{"date": "2016-05-10", "name": "线条2", "points": 120.622},{"date": "2016-05-11", "name": "线条2", "points": 153.85},{"date": "2016-05-12", "name": "线条2", "points": 162.963},{"date": "2016-05-13", "name": "线条2", "points": 146},{"date": "2016-05-17", "name": "线条2", "points": 130},{"date": "2016-05-18", "name": "线条2", "points": 138.845},{"date": "2016-05-19", "name": "线条2", "points": 120.17},{"date": "2016-05-20", "name": "线条2", "points": 149.741},{"date": "2016-05-23", "name": "线条2", "points": 119.668},{"date": "2016-05-24", "name": "线条2", "points": 136.886},{"date": "2016-05-25", "name": "线条2", "points": 108.239},{"date": "2016-05-26", "name": "线条2", "points": 147.239},{"date": "2016-05-27", "name": "线条2", "points": 127.457},{"date": "2016-05-30", "name": "线条2", "points": 137.37},
];const invalidData = [{"date": "2016-01-04", "name": "线条1", "points": 126.12},{"date": "2016-01-05", "name": "线条1", "points": 125.688},{"date": "2016-01-06", "name": "线条1", "points": 119.704},{"date": "2016-01-07", "name": "线条1", "points": 120.19},{"date": "2016-01-08", "name": "线条1", "points": 121.157},{"date": "2016-01-11", "name": "线条1", "points": 117},{"date": "2016-01-12", "name": "线条1", "points": 120},{"date": "2016-01-13", "name": "线条1", "points": 122},{"date": "2016-01-14", "name": "线条1", "points": 117.76},{"date": "2016-01-15", "name": "线条1", "points": 114.397},{"date": "2016-01-18", "name": "线条1", "points": 116.373},{"date": "2016-01-19", "name": "线条1", "points": 120.547},{"date": "2016-01-20", "name": "线条1", "points": 113.733},{"date": "2016-01-21", "name": "线条1", "points": 114.098},{"date": "2016-01-22", "name": "线条1", "points": 123.833},{"date": "2016-01-25", "name": "线条1", "points": 125},{"date": "2016-01-26", "name": "线条1", "points": 124.866},{"date": "2016-01-27", "name": "线条1", "points": 120.264},{"date": "2016-01-28", "name": "线条1", "points": 122.296},{"date": "2016-01-29", "name": "线条1", "points": 124.502},{"date": "2016-02-01", "name": "线条1", "points": 127.936},{"date": "2016-02-02", "name": "线条1", "points": null},{"date": "2016-02-03", "name": "线条1", "points": 129.95},{"date": "2016-02-04", "name": "线条1", "points": 129.275},{"date": "2016-02-05", "name": "线条1", "points": 127.898},{"date": "2016-02-08", "name": "线条1", "points": 134.9},{"date": "2016-02-09", "name": "线条1", "points": 122.819},{"date": "2016-02-10", "name": "线条1", "points": 120.108},{"date": "2016-02-11", "name": "线条1", "points": 119.447},{"date": "2016-02-12", "name": "线条1", "points": 117.8},{"date": "2016-02-15", "name": "线条1", "points": null},{"date": "2016-02-16", "name": "线条1", "points": 121.865},{"date": "2016-02-17", "name": "线条1", "points": 126.3},{"date": "2016-02-18", "name": "线条1", "points": 128.259},{"date": "2016-02-19", "name": "线条1", "points": 125.724},{"date": "2016-02-22", "name": "线条1", "points": 130},{"date": "2016-02-23", "name": "线条1", "points": 129.948},{"date": "2016-02-24", "name": "线条1", "points": 132.5},{"date": "2016-02-25", "name": "线条1", "points": 128.08},{"date": "2016-02-26", "name": "线条1", "points": 122},{"date": "2016-02-29", "name": "线条1", "points": 122},{"date": "2016-03-01", "name": "线条1", "points": 123.449},{"date": "2016-03-02", "name": "线条1", "points": double.nan},{"date": "2016-03-03", "name": "线条1", "points": 132},{"date": "2016-03-04", "name": "线条1", "points": 135},{"date": "2016-03-07", "name": "线条1", "points": 123.905},{"date": "2016-03-08", "name": "线条1", "points": 125.155},{"date": "2016-03-09", "name": "线条1", "points": 126},{"date": "2016-03-10", "name": "线条1", "points": 126.778},{"date": "2016-03-11", "name": "线条1", "points": 129.656},{"date": "2016-03-14", "name": "线条1", "points": 127.64},{"date": "2016-03-15", "name": "线条1", "points": 124.786},{"date": "2016-03-16", "name": "线条1", "points": 124.469},{"date": "2016-03-17", "name": "线条1", "points": 123.5},{"date": "2016-03-18", "name": "线条1", "points": 124.061},{"date": "2016-03-21", "name": "线条1", "points": 123.5},{"date": "2016-03-22", "name": "线条1", "points": 129.002},{"date": "2016-03-23", "name": "线条1", "points": 129},{"date": "2016-03-24", "name": "线条1", "points": 131.31},{"date": "2016-03-29", "name": "线条1", "points": 133},{"date": "2016-03-30", "name": "线条1", "points": 129.298},{"date": "2016-03-31", "name": "线条1", "points": 127.4},{"date": "2016-04-01", "name": "线条1", "points": 122.376},{"date": "2016-04-04", "name": "线条1", "points": 119.467},{"date": "2016-04-05", "name": "线条1", "points": 120.695},{"date": "2016-04-06", "name": "线条1", "points": 118.725},{"date": "2016-04-07", "name": "线条1", "points": 127.539},{"date": "2016-04-08", "name": "线条1", "points": 129.8},{"date": "2016-04-11", "name": "线条1", "points": 129.5},{"date": "2016-04-12", "name": "线条1", "points": 134.465},{"date": "2016-04-13", "name": "线条1", "points": 133},{"date": "2016-04-14", "name": "线条1", "points": 137.35},{"date": "2016-04-15", "name": "线条1", "points": 137.2},{"date": "2016-04-18", "name": "线条1", "points": 132.611},{"date": "2016-04-19", "name": "线条1", "points": 135.479},{"date": "2016-04-20", "name": "线条1", "points": 139.05},{"date": "2016-04-21", "name": "线条1", "points": 142},{"date": "2016-04-22", "name": "线条1", "points": 135.761},{"date": "2016-04-25", "name": "线条1", "points": 136.174},{"date": "2016-04-26", "name": "线条1", "points": 134.782},{"date": "2016-04-27", "name": "线条1", "points": 128},{"date": "2016-04-28", "name": "线条1", "points": 121.5},{"date": "2016-04-29", "name": "线条1", "points": 120},{"date": "2016-05-02", "name": "线条1", "points": 123.966},{"date": "2016-05-03", "name": "线条1", "points": 122.538},{"date": "2016-05-04", "name": "线条1", "points": 120},{"date": "2016-05-05", "name": "线条1", "points": 120.21},{"date": "2016-05-06", "name": "线条1", "points": 121.01},{"date": "2016-05-09", "name": "线条1", "points": double.nan},{"date": "2016-05-10", "name": "线条1", "points": 120.622},{"date": "2016-05-11", "name": "线条1", "points": 123.85},{"date": "2016-05-12", "name": "线条1", "points": 122.963},{"date": "2016-05-13", "name": "线条1", "points": 126},{"date": "2016-05-17", "name": "线条1", "points": 130},{"date": "2016-05-18", "name": "线条1", "points": 128.845},{"date": "2016-05-19", "name": "线条1", "points": 130.17},{"date": "2016-05-20", "name": "线条1", "points": 129.741},{"date": "2016-05-23", "name": "线条1", "points": 129.668},{"date": "2016-05-24", "name": "线条1", "points": 126.886},{"date": "2016-05-25", "name": "线条1", "points": 128.239},{"date": "2016-05-26", "name": "线条1", "points": 127.239},{"date": "2016-05-27", "name": "线条1", "points": 127.457},{"date": "2016-05-30", "name": "线条1", "points": 127.37},{"date": "2016-05-31", "name": "线条1", "points": 130.756},{"date": "2016-06-01", "name": "线条1", "points": 133.232},{"date": "2016-06-02", "name": "线条1", "points": 126.47},{"date": "2016-06-03", "name": "线条1", "points": 126.385},{"date": "2016-06-06", "name": "线条1", "points": 128.331},{"date": "2016-06-07", "name": "线条1", "points": 130.914},{"date": "2016-06-08", "name": "线条1", "points": 133},{"date": "2016-06-09", "name": "线条1", "points": 133.041},{"date": "2016-06-10", "name": "线条1", "points": 133.041},{"date": "2016-06-13", "name": "线条1", "points": 129},{"date": "2016-06-14", "name": "线条1", "points": 129.166},{"date": "2016-06-15", "name": "线条1", "points": 124.687},{"date": "2016-06-16", "name": "线条1", "points": 122.77},{"date": "2016-06-17", "name": "线条1", "points": 126.461},{"date": "2016-06-20", "name": "线条1", "points": 127},{"date": "2016-06-21", "name": "线条1", "points": 125.594},{"date": "2016-06-22", "name": "线条1", "points": 127.438},{"date": "2016-06-23", "name": "线条1", "points": 124.44},{"date": "2016-06-24", "name": "线条1", "points": 122.131},{"date": "2016-06-27", "name": "线条1", "points": 120.53},{"date": "2016-06-28", "name": "线条1", "points": 120.296},{"date": "2016-06-29", "name": "线条1", "points": 125.877},{"date": "2016-06-30", "name": "线条1", "points": 126.404},
];相关文章：
【Flutter】graphic图表实现自定义tooltip
renderer graphic中tooltip的TooltipGuide类提供了renderer方法，接收三个参数Size类型，Offset类型，Map<int, Tuple>类型。可查到的文档是真的少，所以只能在源码中扒拉例子，做符合需求的修改。 官方github示例 …...
手机上的记事本怎么打开？安卓手机通用的记事本APP
有不少上班族发现，自己想要在电脑上随手记录一些工作文字内容，直接使用电脑上的记事本工具来编辑文字是比较便捷的。但是如果想要在手机上记录文字内容，就找不到手机上的记事本了。那么手机上的记事本怎么打开？安卓手机通用的记事…...
一起学docker系列之十五深入了解 Docker Network：构建容器间通信的桥梁
目录 1 前言2 什么是 Docker Network3 Docker Network 的不同模式3.1 桥接模式（Bridge）3.2 Host 模式3.3 无网络模式（None）3.4 容器模式（Container） 4 Docker Network 命令及用法4.1 docker network ls4.2 …...
前端OFD文件预览（vue案例cafe-ofd）
0、提示 下面只有vue的使用示例demo ，官文档参考 cafe-ofd - npm 其他平台可以参考 ofd - npm 官方线上demo: ofd 1、安装包 npm install cafe-ofd --save 2、引入 import cafeOfd from cafe-ofd import cafe-ofd/package/index.css Vue.use(cafeOfd) 3、使…...
Java[list/set]通用遍历方法之Iterator
需求：输入一个字符串 将其拆解成单个汉字 然后一行一个输出 这里要求使用到Arraylist集合实现方法Itrator遍历的原理import java.util.ArrayList; import java.util.Collection; import java.util.Iterator;public class Main{public static void main(String[] arg…...
ubuntu/vscode下的c/c++开发之-CMake语法与练习
Cmake学习 1 语法特性介绍 基本语法格式：指令(参数 1 参数 2...) 参数使用括弧括起参数之间使用空格或分号分开 指令是大小写无关的，参数和变量是大小写相关的 set(HELLO hello.cpp) add_executable(hello main.cpp hello.cpp) ADD_EXECUTABLE(hello ma…...
Java(119):ExcelUtil工具类(org.apache.poi读取和写入Excel)
ExcelUtil工具类(XSSFWorkbook读取和写入Excel)，入参和出参都是：List<Map<String,Object>> 一、读取Excel testdata.xlsx 1、new XSSFWorkbook对象 File file = new File(filePath); FileInputStream fis = new FileInputStream(file);…...
Kong处理web服务跨域
前言 好久没写文章了，大概有半年多了，这半年故事太多，本文写不下，就写写文章标题问题！ 问题描述 关于跨域的本质问题我这里不过多介绍，详细请看历史文章 跨域产生的原因以及常见的解决方案。 我这边是新…...
Kotlin学习——kt里的作用域函数scope function，let，run，with，apply，also
Kotlin 是一门现代但已成熟的编程语言，旨在让开发人员更幸福快乐。 它简洁、安全、可与 Java 及其他语言互操作，并提供了多种方式在多个平台间复用代码，以实现高效编程。 https://play.kotlinlang.org/byExample/01_introduction/02_Functio…...
informer辅助笔记：utils/timefeatures.py
定义了一套与时间特征相关的类和函数，旨在从时间序列数据中提取有用的时间特征，以支持各种时间序列分析和预测任务 from typing import Listimport numpy as np import pandas as pd from pandas.tseries import offsets from pandas.tseries.frequenc…...
[Verilog语法]：===和!==运算符使用注意事项
[Verilog语法]：和!运算符使用注意事项 1， 和 !运算符使用注意事项2，3， 1， 和 !运算符使用注意事项 参考文献： 1，[SystemVerilog语法拾遗] 和!运算符使用注意事项 2， 3，...
mybatis 高并发查询性能问题
场景： 使用Mybatis （3.5.10）SelectProvider注解执行动态sql 在高并发查询时 QPS 很低 问题复现 mybatis 配置 （getOfflineConfigSqlTemplate 该方法返回的是动态sql ） 压测结果 观察线程阻塞情况 此时的QPS 在 …...
我在Vscode学OpenCV 图像处理一（阈值处理、形态学操作【连通性，腐蚀和膨胀，开闭运算，礼帽和黑帽，内核】）
文章目录 一、阈值处理1.1 OpenCV 提供了函数 cv2.threshold()和函数 cv2.adaptiveThreshold()，用于实现阈值处理1.1.1. cv2.threshold()：(1)在函数cv2.threshold()中，参数threshold_type用于指定阈值处理的方式。它有以下几种可选的阈值类型…...
Yolov8实现瓶盖正反面检测
一、模型介绍 模型基于 yolov8n数据集采用SKU-110k，这数据集太大了十几个 G，所以只训练了 10 轮左右就拿来微调了 基于原木数据微调：训练 200 轮的效果 10 轮SKU-110k 20 轮原木 200 轮瓶盖正反面 微调模型下载地址https://wwxd.lanzouu.co…...
GAN：WGAN前作
WGAN前作：有原则的方法来训练GANs 论文：https://arxiv.org/abs/1701.04862 发表：ICLR 2017 本文是wgan三部曲的第一部。文中并没有引入新的算法，而是标是朝着完全理解生成对抗网络的训练动态过程迈进理论性的一步。 文中基本是…...
数据库应用：MongoDB 文档与索引管理
目录 一、理论 1.MongoDB文档管理 2.MongoDB索引管理 二、实验 1.MongoDB文档管理 2.MongoDB索引管理（索引添加与删除） 3.MongoDB索引管理（全文索引） 4.MongoDB索引管理（多列索引） 5.MongoDB索引管…...
Python批处理PDF文件，PDF附件轻松批量提取
PDF附件是指在PDF文档中嵌入的其他文件，如图像、表格、音频、视频或其他文档。这些附件可以与PDF文档一起存储、传输和共享，为文档提供了更丰富的内容和更多的功能。通过添加附件，我们可以将相关文件和信息捆绑在一起，使其更易于管…...
Python可迭代对象排序：深入排序算法与定制排序
更多Python学习内容：ipengtao.com 排序在计算机科学中是一项基础而关键的操作，而Python提供了强大的排序工具来满足不同场景下的排序需求。本文将深入探讨Python中对可迭代对象进行排序的方法，涵盖基础排序算法、sorted函数的应用、以及定制排…...
基于matlab的图像去噪算法设计与实现
摘 要 随着我们生活水平的提高，科技产品飞速更新换代，在信息传输中，图像传输所占的比重越来越大。但自然噪声会在图像传输时干扰其传输过程，甚至会使图片不能表达其原来的意义。去噪处理就是为了去除图像中的噪声，从而…...
NFTScan 正式上线 Starknet NFTScan 浏览器和 NFT API 数据服务
2023 年 11 月 30 号，NFTScan 团队正式对外发布了 Starknet NFTScan 浏览器，将为 Starknet 生态的 NFT 开发者和用户提供简洁高效的 NFT 数据搜索查询服务。NFTScan 作为全球领先的 NFT 数据基础设施服务商，Starknet 是继 Bitcoin、Ethereum、…...
脑机新手指南（八）：OpenBCI_GUI：从环境搭建到数据可视化（下）
一、数据处理与分析实战 （一）实时滤波与参数调整 基础滤波操作 60Hz 工频滤波：勾选界面右侧 “60Hz” 复选框，可有效抑制电网干扰（适用于北美地区，欧洲用户可调整为 50Hz）。 平滑处理&…...
django filter 统计数量 按属性去重
在Django中，如果你想要根据某个属性对查询集进行去重并统计数量，你可以使用values()方法配合annotate()方法来实现。这里有两种常见的方法来完成这个需求： 方法1：使用annotate()和Count 假设你有一个模型Item，并且你想…...
将对透视变换后的图像使用Otsu进行阈值化，来分离黑色和白色像素。这句话中的Otsu是什么意思？
Otsu 是一种自动阈值化方法，用于将图像分割为前景和背景。它通过最小化图像的类内方差或等价地最大化类间方差来选择最佳阈值。这种方法特别适用于图像的二值化处理，能够自动确定一个阈值，将图像中的像素分为黑色和白色两类。 Otsu 方法的原…...
【项目实战】通过多模态+LangGraph实现PPT生成助手
PPT自动生成系统 基于LangGraph的PPT自动生成系统，可以将Markdown文档自动转换为PPT演示文稿。 功能特点 Markdown解析：自动解析Markdown文档结构PPT模板分析：分析PPT模板的布局和风格智能布局决策：匹配内容与合适的PPT布局自动…...
实现弹窗随键盘上移居中
实现弹窗随键盘上移的核心思路 在Android中，可以通过监听键盘的显示和隐藏事件，动态调整弹窗的位置。关键点在于获取键盘高度，并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...
【Java学习笔记】BigInteger 和 BigDecimal 类
BigInteger 和 BigDecimal 类 二者共有的常见方法 方法功能add加subtract减multiply乘divide除 注意点：传参类型必须是类对象 一、BigInteger 1. 作用：适合保存比较大的整型数 2. 使用说明 创建BigInteger对象 传入字符串 3. 代码示例 import j…...
A2A JS SDK 完整教程：快速入门指南
目录 什么是 A2A JS SDK?A2A JS 安装与设置A2A JS 核心概念创建你的第一个 A2A JS 代理A2A JS 服务端开发A2A JS 客户端使用A2A JS 高级特性A2A JS 最佳实践A2A JS 故障排除 什么是 A2A JS SDK? A2A JS SDK 是一个专为 JavaScript/TypeScript 开发者设计的强大库ÿ…...
iview框架主题色的应用
1.下载 less要使用3.0.0以下的版本 npm install less2.7.3 npm install less-loader4.0.52./src/config/theme.js文件 module.exports {yellow: {theme-color: #FDCE04},blue: {theme-color: #547CE7} }在sass中使用theme配置的颜色主题，无需引入，直接可…...
【Android】Android 开发 ADB 常用指令
查看当前连接的设备 adb devices 连接设备 adb connect 设备IP 断开已连接的设备 adb disconnect 设备IP 安装应用 adb install 安装包的路径 卸载应用 adb uninstall 应用包名 查看已安装的应用包名 adb shell pm list packages 查看已安装的第三方应用包名 adb shell pm list…...
协议转换利器，profinet转ethercat网关的两大派系，各有千秋
随着工业以太网的发展，其高效、便捷、协议开放、易于冗余等诸多优点，被越来越多的工业现场所采用。西门子SIMATIC S7-1200/1500系列PLC集成有Profinet接口，具有实时性、开放性，使用TCP/IP和IT标准，符合基于工业以太网的…...