style: 更改热点位置

Code/public/myData/myData.js

@@ -21,9 +21,9 @@ const visitHotArr = [
     // 热点大小
     size: 1,
     // 垂直方向
-    atv: -8.87,
+    atv: 3.13,
     // 水平方向
-    ath: 4.7,
+    ath: 11.54,
     zIndex: 2,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'visit/hot/hot1.png',
@@ -138,9 +138,9 @@ const visitHotArr = [
     // 热点大小
     size: 1,
     // 垂直方向
-    atv: -9.17,
+    atv: 0.79,
     // 水平方向
-    ath: 29.67,
+    ath: 34.54,
     zIndex: 3,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'visit/hot/hot2.png',
@@ -182,9 +182,9 @@ const visitHotArr = [
     // 热点大小
     size: 1,
     // 垂直方向
-    atv: -8.16,
+    atv: 0.93,
     // 水平方向
-    ath: -19.02,
+    ath: -14.37,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'visit/hot/hot3.png',
     // 热点定位百分比
@@ -209,9 +209,9 @@ const visitHotArr = [
     // 热点大小
     size: 1,
     // 垂直方向
-    atv: -35.78,
+    atv: -28.06,
     // 水平方向
-    ath: 5.28,
+    ath: 33.1,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'visit/hot/hot4.png',
     // 热点定位百分比
@@ -270,9 +270,9 @@ const visitHotArr = [
     // 热点大小
     size: 1,
     // 垂直方向
-    atv: -15.7,
+    atv: 1.88,
     // 水平方向
-    ath: -176.22,
+    ath: -168.03,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'visit/hot/hot5.png',
     // 热点定位百分比
@@ -390,11 +390,11 @@ const banquetHotArr = [
     // 热点名字
     name: '汉代坐姿',
     // 热点大小
-    size: 1,
+    size: 0.5,
     // 垂直方向
-    atv: -4.81,
+    atv: 3.38,
     // 水平方向
-    ath: 1.33,
+    ath: 5.61,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot1.png',
     // 热点定位百分比
@@ -430,11 +430,11 @@ const banquetHotArr = [
     // 热点名字
     name: '汉代家具',
     // 热点大小
-    size: 1,
+    size: 0.5,
     // 垂直方向
-    atv: 3.99,
+    atv: 5.73,
     // 水平方向
-    ath: -11.5,
+    ath: -8.11,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot2.png',
     // 热点定位百分比
@@ -463,7 +463,7 @@ const banquetHotArr = [
     // 热点名字
     name: '汉代坐具',
     // 热点大小
-    size: 1,
+    size: 0.5,
     // 垂直方向
     atv: 11.5,
     // 水平方向
@@ -507,11 +507,11 @@ const banquetHotArr = [
     // 热点名字
     name: '三角纹彩绘陶壶',
     // 热点大小
-    size: 0.7,
+    size: 0.5,
     // 垂直方向
-    atv: -3.77,
+    atv: 0,
     // 水平方向
-    ath: -54.44,
+    ath: -72.94,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot4.png',
     // 热点定位百分比
@@ -536,11 +536,11 @@ const banquetHotArr = [
     // 热点名字
     name: '五凤铜熏炉',
     // 热点大小
-    size: 0.6,
+    size: 0.5,
     // 垂直方向
-    atv: -2.65,
+    atv: 1.355,
     // 水平方向
-    ath: 68.16,
+    ath: 93.19,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot5.png',
     // 热点定位百分比
@@ -570,11 +570,11 @@ const banquetHotArr = [
     // 热点名字
     name: '红绿釉陶灯',
     // 热点大小
-    size: 0.6,
+    size: 0.5,
     // 垂直方向
-    atv: -2.65,
+    atv: 0.01,
     // 水平方向
-    ath: 80,
+    ath: 78.48,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot6.png',
     // 热点定位百分比
@@ -599,11 +599,11 @@ const banquetHotArr = [
     // 热点名字
     name: '三角纹彩绘陶鼎',
     // 热点大小
-    size: 1,
+    size: 0.5,
     // 垂直方向
-    atv: 1.8,
+    atv: 6.31,
     // 水平方向
-    ath: 13.97,
+    ath: 17.63,
     // pc鼠标移入显示的图片路径+名字
     hoverSrc: 'banquet/hot/hot7.png',
     // 热点定位百分比
@@ -627,9 +627,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金铜牛',
-    size: 1,
-    atv: -0.89,
-    ath: -96.47,
+    size: 0.5,
+    atv: 1.74,
+    ath: -100.08,
     hoverSrc: 'banquet/hot/hot79.png',
     // 热点定位百分比
     loc: {
@@ -651,9 +651,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '曲柄带盘蜡台',
-    size: 1,
-    atv: 20.17,
-    ath: -76.37,
+    size: 0.5,
+    atv: 14.26,
+    ath: -45.19,
     hoverSrc: 'banquet/hot/hot80.png',
     // 热点定位百分比
     loc: {
@@ -673,9 +673,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '食案',
-    size: 1,
-    atv: 6.43,
-    ath: 45,
+    size: 0.5,
+    atv: 16.74,
+    ath: 57.44,
     hoverSrc: 'banquet/hot/hot81.png',
     // 热点定位百分比
     loc: {
@@ -696,9 +696,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '箸',
-    size: 1,
-    atv: 2,
-    ath: 39.5,
+    size: 0.5,
+    atv: 10.1,
+    ath: 32.3,
     hoverSrc: 'banquet/hot/hot82.png',
     // 热点定位百分比
     loc: {
@@ -719,7 +719,7 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '“广平五升”铜鼎',
-    size: 1,
+    size: 0.5,
     atv: 5.52,
     ath: -83.1,
     hoverSrc: 'banquet/hot/hot83.png',
@@ -742,9 +742,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '云纹漆鼎',
-    size: 1,
-    atv: -1.35,
-    ath: -38.62,
+    size: 0.5,
+    atv: 0.67,
+    ath: -50.77,
     hoverSrc: 'banquet/hot/hot84.png',
     // 热点定位百分比
     loc: {
@@ -765,9 +765,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '漆盒',
-    size: 1,
-    atv: 9.39,
-    ath: -42.89,
+    size: 0.5,
+    atv: 20.97,
+    ath: -83.9,
     hoverSrc: 'banquet/hot/hot85.png',
     // 热点定位百分比
     loc: {
@@ -788,9 +788,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '“君幸食”小漆盘',
-    size: 1,
-    atv: 13.26,
-    ath: -34.65,
+    size: 0.5,
+    atv: 17.19,
+    ath: -45.95,
     hoverSrc: 'banquet/hot/hot9.png',
     // 热点定位百分比
     loc: {
@@ -812,9 +812,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '铜熏炉',
-    size: 1,
-    atv: 1.24,
-    ath: -50.84,
+    size: 0.5,
+    atv: 1,
+    ath: 56.14,
     hoverSrc: 'banquet/hot/hot87.png',
     // 热点定位百分比
     loc: {
@@ -835,9 +835,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金带盖铜炉',
-    size: 1,
-    atv: 4.88,
-    ath: -45.26,
+    size: 0.5,
+    atv: 3.25,
+    ath: -50.84,
     hoverSrc: 'banquet/hot/hot88.png',
     // 热点定位百分比
     loc: {
@@ -860,9 +860,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '朱雀羽人飞龙彩绘陶灯',
-    size: 1,
-    atv: 4.22,
-    ath: -28.12,
+    size: 0.5,
+    atv: 3.26,
+    ath: -26.71,
     hoverSrc: 'banquet/hot/hot89.png',
     // 热点定位百分比
     loc: {
@@ -883,9 +883,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '提梁三足铜壶',
-    size: 0.8,
-    atv: 8.44,
-    ath: -55.63,
+    size: 0.5,
+    atv: 0.83,
+    ath: -54.58,
     hoverSrc: 'banquet/hot/hot90.png',
     // 热点定位百分比
     loc: {
@@ -906,9 +906,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金双鼻铜壶',
-    size: 1,
-    atv: 17.42,
-    ath: -46.17,
+    size: 0.5,
+    atv: 1.57,
+    ath: -104.81,
     hoverSrc: 'banquet/hot/hot91.png',
     // 热点定位百分比
     loc: {
@@ -929,9 +929,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金银云纹铜壶',
-    size: 1,
-    atv: 15.63,
-    ath: -106.78,
+    size: 0.5,
+    atv: 1.45,
+    ath: 88.18,
     hoverSrc: 'banquet/hot/hot92.png',
     // 热点定位百分比
     loc: {
@@ -952,9 +952,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '铜鋞',
-    size: 1,
-    atv: -0.33,
-    ath: -26.1,
+    size: 0.5,
+    atv: 8.09,
+    ath: -31.06,
     hoverSrc: 'banquet/hot/hot93.png',
     // 热点定位百分比
     loc: {
@@ -975,9 +975,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金铜素钫',
-    size: 1,
-    atv: 6.31,
-    ath: 33.98,
+    size: 0.5,
+    atv: 1.41,
+    ath: -39.26,
     hoverSrc: 'banquet/hot/hot94.png',
     // 热点定位百分比
     loc: {
@@ -998,9 +998,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '弦纹奁',
-    size: 1,
-    atv: 9.8,
-    ath: 105.11,
+    size: 0.5,
+    atv: 1.5,
+    ath: 99.79,
     hoverSrc: 'banquet/hot/hot95.png',
     // 热点定位百分比
     loc: {
@@ -1021,9 +1021,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '汉代神兽纹铜樽',
-    size: 1,
-    atv: 10,
-    ath: 75.92,
+    size: 0.5,
+    atv: 0,
+    ath: 69.58,
     hoverSrc: 'banquet/hot/hot96.png',
     // 热点定位百分比
     loc: {
@@ -1044,9 +1044,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '彩漆卮',
-    size: 1,
-    atv: 3.18,
-    ath: 49.61,
+    size: 0.5,
+    atv: 0.93,
+    ath: 50.78,
     hoverSrc: 'banquet/hot/hot97.png',
     // 热点定位百分比
     loc: {
@@ -1067,9 +1067,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '鎏金银云纹耳杯',
-    size: 1,
-    atv: 16.15,
-    ath: 97,
+    size: 0.5,
+    atv: -0.03,
+    ath: 73.62,
     hoverSrc: 'banquet/hot/hot98.png',
     // 热点定位百分比
     loc: {
@@ -1090,9 +1090,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '云纹透花薰炉',
-    size: 1,
-    atv: -3.15,
-    ath: 34.3,
+    size: 0.5,
+    atv: 1.31,
+    ath: 28.22,
     hoverSrc: 'banquet/hot/hot99.png',
     // 热点定位百分比
     loc: {
@@ -1111,9 +1111,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '宴饮礼节',
-    size: 1,
-    atv: 12.38,
-    ath: -85.19,
+    size: 0.5,
+    atv: 8.9,
+    ath: 8.95,
     hoverSrc: 'banquet/hot/hot101.png',
     // 热点定位百分比
     loc: {
@@ -1132,7 +1132,7 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '绿釉直颈陶投壶',
-    size: 1,
+    size: 0.5,
     atv: 1.448,
     ath: 104,
     hoverSrc: 'banquet/hot/hot102.png',
@@ -1162,9 +1162,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '绿釉弦纹陶壶',
-    size: 1,
-    atv: 10.12,
-    ath: 59.37,
+    size: 0.5,
+    atv: 0,
+    ath: 63.09,
     hoverSrc: 'banquet/hot/hot103.png',
     // 热点定位百分比
     loc: {
@@ -1184,9 +1184,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '神兽纹博山炉',
-    size: 1,
-    atv: 10.14,
-    ath: 50.54,
+    size: 0.5,
+    atv: 0.95,
+    ath: 34.17,
     hoverSrc: 'banquet/hot/hot104.png',
     // 热点定位百分比
     loc: {
@@ -1206,9 +1206,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '四足陶案',
-    size: 1,
-    atv: 18.33,
-    ath: 83.69,
+    size: 0.5,
+    atv: 15.92,
+    ath: 109.8,
     hoverSrc: 'banquet/hot/hot105.png',
     // 热点定位百分比
     loc: {
@@ -1228,9 +1228,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '素面铜灯',
-    size: 1,
-    atv: 2.12,
-    ath: 30.22,
+    size: 0.5,
+    atv: 14.09,
+    ath: 78.77,
     hoverSrc: 'banquet/hot/hot106.png',
     // 热点定位百分比
     loc: {
@@ -1250,9 +1250,9 @@ const banquetHotArr = [
     // 是否在更多模块中显示-true表示不显示
     noShow: true,
     name: '铜勺',
-    size: 1,
-    atv: 14,
-    ath: 55.34,
+    size: 0.5,
+    atv: 13.91,
+    ath: 46.53,
     hoverSrc: 'banquet/hot/hot107.png',
     // 热点定位百分比
     loc: {

Code/src/components/HotIcon/index.module.scss

@@ -1,5 +1,6 @@
 .HotIcon {
   display: inline-block;
+  min-width: 30px;
   height: 30px;
   width: auto;
   :global {

Code/src/pages/A3banquet/PanoImg/index.tsx

@@ -6,9 +6,9 @@ import HotIcon from '@/components/HotIcon'
 import { KrpanoMiddleware, KrpanoMiddlewareMethods } from '@/components/KrpanoMiddleware'
 import { HotSpot, Krpano, Scene, View } from '@dage/krpano'
 
-// window.draggbleHotspotEvent = (ath: number, atv: number) => {
-//   console.log(`ath: ${ath}, atv: ${atv}`)
-// }
+window.draggbleHotspotEvent = (ath: number, atv: number) => {
+  console.log(`ath: ${ath}, atv: ${atv}`)
+}
 
 function PanoImg() {
   // 0为 第一种模式的热点 其他为第二种
@@ -84,14 +84,14 @@ function PanoImg() {
                 onOut={() => setActiveIdx(-1)}
                 onClick={() => setInd(index)}
                 // @ts-ignore
-                // onDown='draggable_hotspot()'
+                onDown='draggable_hotspot()'
               >
                 <HotIcon
                   isPano
                   isModel={item.isModel ? true : false}
                   key={index}
                   index={index}
-                  isHoverAc={activeIdx === index}
+                  // isHoverAc={activeIdx === index}
                   hoverSrc={item.hoverSrc}
                 />
               </HotSpot>