@go-home-early/go-home-early98 0.3.1 → 0.3.3

package/src/packages/Cesium/DrawMap/DrawJs/MeasurePolygon.js

@@ -0,0 +1,337 @@
+// MeasurePolygon
+/*
+绘制面测量面积
+ */
+class MeasurePolygon {
+  constructor(arg) {
+    this.viewer = arg.viewer;
+    this.Cesium = arg.Cesium;
+    this.Text = arg.data.text || '';
+    this.Color = arg.data.color || '#000';
+    this.imgUrl = arg.data.imgUrl || '';
+    this.FontSize = arg.data.fontSize || 16;
+    this.callback = arg.data.callback || null;
+    this.pxNum = arg.data.pxNum || 5;
+    this.handler = null;
+
+    this.tempPoints = [];
+    this.floatingPoint = null;
+    this.radiansPerDegree = Math.PI / 180.0; // 角度转化为弧度(rad)
+    this.degreesPerRadian = 180.0 / Math.PI; // 弧度转化为角度
+    this.textArea = '';
+    this._polygon = null; // 活动面
+    this._polygonLast = null; // 最后一个面
+    this._positions = []; // 活动点
+    this._entities_point = []; // 脏数据
+    this._entities_polygon = []; // 脏数据
+    this._polygonData = null; // 用户构造面
+  }
+
+  // 返回最后活动面
+  get polygon() {
+    return this._polygonLast;
+  }
+
+  // 返回面数据用于加载面
+  getData() {
+    return this._polygonData;
+  }
+
+  // 加载面
+  loadPolygon(data) {
+    var $this = this;
+    return this.viewer.entities.add({
+      polygon: {
+        hierarchy: new $this.Cesium.PolygonHierarchy(data),
+        clampToGround: true,
+        show: true,
+        fill: true,
+        material: $this.Cesium.Color.fromCssColorString($this.Color),
+        width: 3,
+        outlineColor: $this.Cesium.Color.BLACK,
+        outlineWidth: 1,
+        outline: false
+      }
+    });
+  }
+
+  // 开始绘制
+  startCreate() {
+    var $this = this;
+    this.handler = new this.Cesium.ScreenSpaceEventHandler(
+      this.viewer.scene.canvas
+    );
+    this.handler.setInputAction(function(evt) {
+      // 单机开始绘制
+      var cartesian = $this.getCatesian3FromPX(evt.position);
+      if ($this._positions.length == 0) {
+        $this._positions.push(cartesian.clone());
+      }
+      $this.createPoint(cartesian);
+      $this._positions.push(cartesian);
+
+      // 在三维场景中添加点
+      var cartographic = $this.Cesium.Cartographic.fromCartesian(
+        $this._positions[$this._positions.length - 1]
+      );
+      var longitudeString = $this.Cesium.Math.toDegrees(cartographic.longitude);
+      var latitudeString = $this.Cesium.Math.toDegrees(cartographic.latitude);
+      var heightString = cartographic.height;
+      var labelText =
+        '(' +
+        longitudeString.toFixed(2) +
+        ',' +
+        latitudeString.toFixed(2) +
+        ')';
+      $this.tempPoints.push({
+        lon: longitudeString,
+        lat: latitudeString,
+        hei: heightString
+      });
+      $this.floatingPoint = $this.viewer.entities.add({
+        name: '多边形面积',
+        position: $this._positions[$this._positions.length - 1],
+        openwindow: false,
+        point: {
+          pixelSize: 5,
+          color: $this.Cesium.Color.RED,
+          outlineColor: $this.Cesium.Color.WHITE,
+          outlineWidth: 2,
+          heightReference: $this.Cesium.HeightReference.CLAMP_TO_GROUND
+        },
+        label: {
+          // text: labelText,
+          text: labelText,
+          font: '14px sans-serif',
+          fillColor: $this.Cesium.Color.YELLOW,
+          style: $this.Cesium.LabelStyle.FILL_AND_OUTLINE,
+          // outlineWidth: 2,
+          verticalOrigin: $this.Cesium.VerticalOrigin.BOTTOM,
+          pixelOffset: new $this.Cesium.Cartesian2(20, -20),
+          distanceDisplayCondition: new $this.Cesium.DistanceDisplayCondition(
+            10,
+            10000000
+          )
+        }
+      });
+    }, $this.Cesium.ScreenSpaceEventType.LEFT_CLICK);
+    this.handler.setInputAction(function(evt) {
+      // 移动时绘制面
+      if ($this._positions.length < 1) return;
+      var cartesian = $this.getCatesian3FromPX(evt.endPosition);
+      if ($this._positions.length == 3) {
+        if (!$this.Cesium.defined($this._polygon)) {
+          $this._polygon = $this.createPolygon();
+        }
+      }
+      $this._positions.pop();
+      $this._positions.push(cartesian);
+    }, $this.Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+    this.handler.setInputAction(function(evt) {
+      if (!$this._polygon) return;
+      var cartesian = $this.getCatesian3FromPX(evt.position);
+      console.log(`output->$this.tempPoints`, $this.tempPoints);
+      // if ($this.tempPoints.length < 4) {
+      //   $this.handler.destroy();
+      //   return;
+      // }
+
+      $this._positions.pop();
+      $this._positions.push(cartesian);
+      $this.createPoint(cartesian); // 创建点
+
+      // 在三维场景中添加点
+      var cartographic = $this.Cesium.Cartographic.fromCartesian(
+        $this._positions[$this._positions.length - 1]
+      );
+      var longitudeString = $this.Cesium.Math.toDegrees(cartographic.longitude);
+      var latitudeString = $this.Cesium.Math.toDegrees(cartographic.latitude);
+      var heightString = cartographic.height;
+
+      $this.tempPoints.push({
+        lon: longitudeString,
+        lat: latitudeString,
+        hei: heightString
+      });
+
+      $this.textArea = $this.getArea($this.tempPoints) + '平方公里';
+      $this.viewer.entities.add({
+        name: '多边形面积',
+        openwindow: false,
+        position: $this._positions[$this._positions.length - 1],
+        label: {
+          text: $this.textArea,
+          font: '18px sans-serif',
+          fillColor: $this.Cesium.Color.GOLD,
+          style: $this.Cesium.LabelStyle.FILL_AND_OUTLINE,
+          outlineWidth: 2,
+          verticalOrigin: $this.Cesium.VerticalOrigin.BOTTOM,
+          pixelOffset: new $this.Cesium.Cartesian2(20, -40),
+          heightReference: $this.Cesium.HeightReference.CLAMP_TO_GROUND
+        }
+      });
+
+      $this._polygonData = $this._positions.concat();
+      $this.viewer.entities.remove($this._positions); // 移除
+      $this._positions = null;
+      $this._positions = [];
+      var Polygon = $this.loadPolygon($this._polygonData);
+      $this._entities_polygon.push(Polygon);
+      $this._polygonLast = Polygon;
+      if (typeof $this.callback == 'function') {
+        $this.callback(Polygon);
+      }
+      $this.handler.destroy();
+    }, $this.Cesium.ScreenSpaceEventType.RIGHT_CLICK);
+  }
+
+  // 创建点击删除事件
+  creatDeleteClick(isSelect) {
+    const $this = this;
+    if (isSelect) {
+      this.handler = new this.Cesium.ScreenSpaceEventHandler(
+        $this.viewer.scene.canvas
+      );
+      this.handler.setInputAction(function(movement) {
+        var pick = $this.viewer.scene.pick(movement.position, 3, 3);
+
+        if (!pick) {
+          return;
+        }
+        $this.viewer.entities.removeById(pick.id._id);
+      }, $this.Cesium.ScreenSpaceEventType.LEFT_CLICK);
+    } else {
+      this.handler.destroy();
+      this.handler = null;
+    }
+  }
+
+  // 创建面
+  createPolygon() {
+    var $this = this;
+    var polygon = this.viewer.entities.add({
+      polygon: {
+        hierarchy: new $this.Cesium.CallbackProperty(function() {
+          return new $this.Cesium.PolygonHierarchy($this._positions);
+        }, false),
+        clampToGround: true,
+        show: true,
+        fill: true,
+        material:
+          $this.Cesium.Color.fromCssColorString('#ffffff').withAlpha(0.5),
+        width: 3,
+        outlineColor: $this.Cesium.Color.BLACK,
+        outlineWidth: 1,
+        outline: false
+      }
+    });
+    $this._entities_polygon.push(polygon);
+    return polygon;
+  }
+
+  // 创建点
+  createPoint(cartesian) {
+    var $this = this;
+    var point = this.viewer.entities.add({
+      position: cartesian,
+      point: {
+        pixelSize: 10,
+        color: $this.Cesium.Color.YELLOW
+      }
+    });
+    $this._entities_point.push(point);
+    return point;
+  }
+
+  // 销毁事件
+  destroy() {
+    if (this.handler) {
+      this.handler.destroy();
+      this.handler = null;
+    }
+  }
+
+  // 清空实体对象
+  clear() {
+    for (let i = 0; i < this._entities_point.length; i++) {
+      this.viewer.entities.remove(this._entities_point[i]);
+    }
+    for (let i = 0; i < this._entities_polygon.length; i++) {
+      this.viewer.entities.remove(this._entities_polygon[i]);
+    }
+    this._polygon = null; // 活动面
+    this._polygonLast = null; // 最后一个面
+    this._positions = []; // 活动点
+    this._entities_point = []; // 脏数据
+    this._entities_polygon = []; // 脏数据
+    this._polygonData = null; // 用户构造面
+  }
+
+  getCatesian3FromPX(px) {
+    var cartesian;
+    var ray = this.viewer.camera.getPickRay(px);
+    if (!ray) return null;
+    cartesian = this.viewer.scene.globe.pick(ray, this.viewer.scene);
+    return cartesian;
+  }
+
+  // 计算多边形面积
+  getArea(points) {
+    var res = 0;
+    // 拆分三角曲面
+    for (var i = 0; i < points.length - 2; i++) {
+      var j = (i + 1) % points.length;
+      var k = (i + 2) % points.length;
+      var totalAngle = this.Angle(points[i], points[j], points[k]);
+      var dis_temp1 = this.distance(this._positions[i], this._positions[j]);
+      var dis_temp2 = this.distance(this._positions[j], this._positions[k]);
+      res += dis_temp1 * dis_temp2 * Math.abs(Math.sin(totalAngle));
+    }
+    return (res / 1000000.0).toFixed(4);
+  }
+
+  /* 角度*/
+  Angle(p1, p2, p3) {
+    var bearing21 = this.Bearing(p2, p1);
+    var bearing23 = this.Bearing(p2, p3);
+    var angle = bearing21 - bearing23;
+    if (angle < 0) {
+      angle += 360;
+    }
+    return angle;
+  }
+  /* 方向*/
+  Bearing(from, to) {
+    var lat1 = from.lat * this.radiansPerDegree;
+    var lon1 = from.lon * this.radiansPerDegree;
+    var lat2 = to.lat * this.radiansPerDegree;
+    var lon2 = to.lon * this.radiansPerDegree;
+    var angle = -Math.atan2(
+      Math.sin(lon1 - lon2) * Math.cos(lat2),
+      Math.cos(lat1) * Math.sin(lat2) -
+        Math.sin(lat1) * Math.cos(lat2) * Math.cos(lon1 - lon2)
+    );
+    if (angle < 0) {
+      angle += Math.PI * 2.0;
+    }
+    angle = angle * this.degreesPerRadian; // 角度
+    return angle;
+  }
+
+  distance(point1, point2) {
+    var point1cartographic = this.Cesium.Cartographic.fromCartesian(point1);
+    var point2cartographic = this.Cesium.Cartographic.fromCartesian(point2);
+    /** 根据经纬度计算出距离**/
+    var geodesic = new this.Cesium.EllipsoidGeodesic();
+    geodesic.setEndPoints(point1cartographic, point2cartographic);
+    var s = geodesic.surfaceDistance;
+    // 返回两点之间的距离
+    s = Math.sqrt(
+      Math.pow(s, 2) +
+        Math.pow(point2cartographic.height - point1cartographic.height, 2)
+    );
+    return s;
+  }
+}
+
+export default MeasurePolygon;

package/src/packages/Cesium/DrawMap/DrawJs/MeasurePolyline.js

@@ -0,0 +1,285 @@
+// DrawPolyline
+/*
+绘制线
+ */
+class DrawPolyline {
+  constructor(arg) {
+    this.viewer = arg.viewer;
+    this.Cesium = arg.Cesium;
+    this.Text = arg.data.text || '';
+    this.Color = arg.data.color || '#000';
+    this.imgUrl = arg.data.imgUrl || '';
+    this.FontSize = arg.data.fontSize || 16;
+    this.callback = arg.data.callback || null;
+    this.pxNum = arg.data.pxNum || 5;
+    this.distance = 0;
+    this.handler = null;
+    this.labelPt = null;
+    this.textDisance = '';
+    this._polyline = null; // 活动线
+    this._polylineLast = null; // 最后一条线
+    this._positions = []; // 活动点
+    this._entities_point = []; // 脏数据
+    this._entities_line = []; // 脏数据
+    this._polylineData = null; // 用于构造线数据
+  }
+
+  // 返回最后活动线
+  get line() {
+    return this._polylineLast;
+  }
+
+  // 返回线数据用于加载线
+  getData() {
+    return this._polylineData;
+  }
+
+  // 加载线
+  loadPolyline(data) {
+    const $this = this;
+    const polyline = this.viewer.entities.add({
+      polyline: {
+        positions: data,
+        show: true,
+        material: $this.Cesium.Color.fromCssColorString($this.Color),
+        width: $this.pxNum,
+        clampToGround: true
+      }
+    });
+    return polyline;
+  }
+
+  // 开始创建
+  startCreate() {
+    const $this = this;
+    this.handler = new this.Cesium.ScreenSpaceEventHandler(
+      this.viewer.scene.canvas
+    );
+    this.handler.setInputAction(function(evt) {
+      // 单机开始绘制
+      // 屏幕坐标转地形上坐标
+      const cartesian = $this.getCatesian3FromPX(evt.position);
+      if ($this._positions.length == 0) {
+        $this._positions.push(cartesian.clone());
+      }
+      $this._positions.push(cartesian);
+      if ($this._positions.length > 2) {
+        $this.getSpaceDistance($this._positions);
+      }
+      // 记录鼠标单击时的节点位置，异步计算贴地距离
+      $this.labelPt = $this._positions[$this._positions.length - 1];
+      $this.createPoint(cartesian); // 绘制点
+    }, $this.Cesium.ScreenSpaceEventType.LEFT_CLICK);
+    this.handler.setInputAction(function(evt) {
+      // 移动时绘制线
+      if ($this._positions.length < 1) return;
+      const cartesian = $this.getCatesian3FromPX(evt.endPosition);
+      if (!$this.Cesium.defined($this._polyline)) {
+        $this._polyline = $this.createPolyline();
+      }
+      if ($this._polyline) {
+        $this._positions.pop();
+        $this._positions.push(cartesian);
+      }
+    }, $this.Cesium.ScreenSpaceEventType.MOUSE_MOVE);
+    this.handler.setInputAction(function(evt) {
+      if (!$this._polyline) return;
+      const cartesian = $this.getCatesian3FromPX(evt.position);
+      if ($this._positions.length >= 2) {
+        $this.viewer.entities.add({
+          name: '贴地距离',
+          position: $this.labelPt,
+          openwindow: false,
+          point: {
+            pixelSize: 5,
+            color: $this.Cesium.Color.RED,
+            outlineColor: $this.Cesium.Color.WHITE,
+            outlineWidth: 2
+          },
+          label: {
+            text: $this.textDisance,
+            //   text: lonLat + textDisance,
+            font: '18px sans-serif',
+            fillColor: $this.Cesium.Color.GOLD,
+            style: $this.Cesium.LabelStyle.FILL_AND_OUTLINE,
+            outlineWidth: 2,
+            verticalOrigin: $this.Cesium.VerticalOrigin.BOTTOM,
+            pixelOffset: new $this.Cesium.Cartesian2(20, -20)
+          }
+        });
+      }
+      $this._positions.pop();
+      // $this._positions.push(cartesian);
+      // $this.createPoint(cartesian); // 绘制点
+      $this._polylineData = $this._positions.concat();
+      $this.viewer.entities.remove($this._polyline); // 移除
+      $this._polyline = null;
+      $this._positions = [];
+      const line = $this.loadPolyline($this._polylineData); // 加载线
+      $this._entities_line.push(line);
+      $this._polylineLast = line;
+      if (typeof $this.callback == 'function') {
+        $this.callback(line);
+      }
+      $this.handler.destroy();
+    }, $this.Cesium.ScreenSpaceEventType.RIGHT_CLICK);
+  }
+
+  // 创建点击删除事件
+  creatDeleteClick(isSelect) {
+    const $this = this;
+    if (isSelect) {
+      this.handler = new this.Cesium.ScreenSpaceEventHandler(
+        $this.viewer.scene.canvas
+      );
+      this.handler.setInputAction(function(movement) {
+        var pick = $this.viewer.scene.pick(movement.position, 3, 3);
+
+        if (!pick) {
+          return;
+        }
+        $this.viewer.entities.removeById(pick.id._id);
+      }, $this.Cesium.ScreenSpaceEventType.LEFT_CLICK);
+    } else {
+      this.handler.destroy();
+      this.handler = null;
+    }
+  }
+
+  // 创建点
+  createPoint(cartesian) {
+    const $this = this;
+    const point = this.viewer.entities.add({
+      position: cartesian,
+      point: {
+        pixelSize: 10,
+        color: $this.Cesium.Color.YELLOW
+      }
+    });
+    $this._entities_point.push(point);
+    return point;
+  }
+
+  // 创建线
+  createPolyline() {
+    const $this = this;
+    const polyline = this.viewer.entities.add({
+      polyline: {
+        // 使用cesium的peoperty
+        positions: new $this.Cesium.CallbackProperty(function() {
+          return $this._positions;
+        }, false),
+        show: true,
+        material:
+          $this.Cesium.Color.fromCssColorString('#ffffff').withAlpha(0.5),
+        width: $this.pxNum,
+        clampToGround: true
+      }
+    });
+    $this._entities_line.push(polyline);
+    return polyline;
+  }
+
+  // 销毁
+  destroy() {
+    if (this.handler) {
+      this.handler.destroy();
+      this.handler = null;
+    }
+  }
+
+  // 清空实体对象
+  clear() {
+    for (let i = 0; i < this._entities_point.length; i++) {
+      this.viewer.entities.remove(this._entities_point[i]);
+    }
+    for (let i = 0; i < this._entities_line.length; i++) {
+      this.viewer.entities.remove(this._entities_line[i]);
+    }
+    this._polyline = null;
+    this._positions = [];
+    this._entities_point = []; // 脏数据
+    this._entities_line = []; // 脏数据
+    this._polylineData = null; // 用于构造线数据
+    this._polylineLast = null;
+  }
+
+  getCatesian3FromPX(px) {
+    let cartesian = null;
+    const ray = this.viewer.camera.getPickRay(px);
+    if (!ray) return null;
+    cartesian = this.viewer.scene.globe.pick(ray, this.viewer.scene);
+    return cartesian;
+  }
+
+  // 空间两点距离计算函数
+  getSpaceDistance(positions) {
+    // 只计算最后一截，与前面累加
+    // 因move和鼠标左击事件，最后两个点坐标重复
+    const i = positions.length - 3;
+    const point1cartographic = this.Cesium.Cartographic.fromCartesian(
+      positions[i]
+    );
+    const point2cartographic = this.Cesium.Cartographic.fromCartesian(
+      positions[i + 1]
+    );
+    this.getTerrainDistance(point1cartographic, point2cartographic);
+  }
+
+  getTerrainDistance(point1cartographic, point2cartographic) {
+    const $this = this;
+    const geodesic = new $this.Cesium.EllipsoidGeodesic();
+    geodesic.setEndPoints(point1cartographic, point2cartographic);
+    const s = geodesic.surfaceDistance;
+    const cartoPts = [point1cartographic];
+    for (let jj = 1000; jj < s; jj += 1000) {
+      // 分段采样计算距离
+      const cartoPt = geodesic.interpolateUsingSurfaceDistance(jj);
+      cartoPts.push(cartoPt);
+    }
+    cartoPts.push(point2cartographic);
+    // 返回两点之间的距离
+    // let promise = this.Cesium.sampleTerrain(
+    //   this.viewer.terrainProvider,
+    //   8,
+    //   cartoPts
+    // );
+    $this.Cesium.sampleTerrain($this.viewer.terrainProvider, 8, cartoPts).then(
+      function(updatedPositions) {
+        console.log(`output->updatedPositions`, updatedPositions);
+        for (let jj = 0; jj < updatedPositions.length - 1; jj++) {
+          const geoD = new $this.Cesium.EllipsoidGeodesic();
+          geoD.setEndPoints(updatedPositions[jj], updatedPositions[jj + 1]);
+          let innerS = geoD.surfaceDistance;
+          innerS = Math.sqrt(
+            Math.pow(innerS, 2) +
+              Math.pow(
+                updatedPositions[jj + 1].height - updatedPositions[jj].height,
+                2
+              )
+          );
+          $this.distance += innerS;
+        }
+        // 在三维场景中添加Label
+        const lon1 = $this.viewer.scene.globe.ellipsoid.cartesianToCartographic(
+          $this.labelPt
+        ).longitude;
+        const lat1 = $this.viewer.scene.globe.ellipsoid.cartesianToCartographic(
+          $this.labelPt
+        ).latitude;
+        const lonLat =
+          '(' +
+          $this.Cesium.Math.toDegrees(lon1).toFixed(2) +
+          ',' +
+          $this.Cesium.Math.toDegrees(lat1).toFixed(2) +
+          ')';
+        $this.textDisance = $this.distance.toFixed(2) + '米';
+        if ($this.distance > 10000) {
+          $this.textDisance = ($this.distance / 1000.0).toFixed(2) + '千米';
+        }
+      }
+    );
+  }
+}
+
+export default DrawPolyline;

package/src/packages/Cesium/DrawMap/DrawJs/ReminderTip.js

@@ -0,0 +1,78 @@
+/*
+ * 标绘提示弹窗tip
+ * @Author: Wang jianLei
+ * @Date: 2022-04-14 20:52:03
+ * @Last Modified by: 宋木桐
+ * @Last Modified time: 2024-08-20 15:52:54
+ */
+const CreateRemindertip = function (arr, position, show) {
+  let tooltip = document.getElementById("toolTip");
+  let style, _x, _y, _color;
+  if (arr && typeof arr === "object") {
+    style = arr;
+  }
+  if (style && style.origin) {
+    style.origin === "center" && ((_x = 15), (_y = -12));
+    style.origin === "top" && ((_x = 15), (_y = -44));
+    style.origin === "bottom" && ((_x = 15), (_y = 20));
+  } else {
+    (_x = 15), (_y = 20);
+  }
+  if (style && style.color) {
+    style.color === "white" &&
+      (_color = "background: rgba(255, 255, 255, 0.8);color: black;");
+    style.color === "black" &&
+      (_color = "background: rgba(0, 0, 0, 0.5);color: white;");
+    style.color === "yellow" &&
+      (_color =
+        "color: black;background-color: #ffcc33;border: 1px solid white;");
+  } else {
+    _color = "background: rgba(0, 0, 0, 0.5);color: white;";
+  }
+  if (!tooltip) {
+    const viewerDom = document.getElementsByClassName("cesium-viewer")[0];
+    let elementbottom = document.createElement("div");
+    viewerDom.append(elementbottom);
+    let html =
+      '<div id="toolTip" style="display: none;pointer-events: none;position: absolute;z-index: 1000;opacity: 0.8;border-radius: 4px;padding: 4px 8px;white-space: nowrap;font-family:黑体;color:white;font-weight: bolder;font-size: 18px;' +
+      _color +
+      '"></div>';
+    viewerDom.insertAdjacentHTML("beforeend", html);
+    tooltip = document.getElementById("toolTip");
+  }
+  if (show) {
+    tooltip.innerHTML = arr;
+    tooltip.style.left = position.x + _x + "px";
+    tooltip.style.top = position.y + _y + "px";
+    tooltip.style.display = "block";
+  } else {
+    tooltip.style.display = "none";
+  }
+  return {
+    tooltip: tooltip,
+    style: style,
+    showAt: function (position, text) {
+      this.tooltip.innerHTML = text;
+      if (this.style && this.style.origin) {
+        this.style.origin === "center" &&
+          ((_x = 15), (_y = -this.tooltip.offsetHeight / 2));
+        this.style.origin === "top" &&
+          ((_x = 15), (_y = -this.tooltip.offsetHeight - 20));
+        this.style.origin === "bottom" && ((_x = 15), (_y = 20));
+      } else {
+        (_x = 15), (_y = -this.tooltip.offsetHeight / 2);
+      }
+      this.tooltip.style.left = position.x + _x + "px";
+      this.tooltip.style.top = position.y + _y + "px";
+      this.tooltip.style.display = "block";
+    },
+    show: function (show) {
+      if (show) {
+        this.tooltip.style.display = "block";
+      } else {
+        this.tooltip.style.display = "none";
+      }
+    },
+  };
+};
+export default CreateRemindertip;