feat:(保存内容)

packages/qjkankan-editor/public/static/template/customTooltip.xml

@@ -20,15 +20,7 @@
          txtadd(hotspot[get(hsp_name)].onloaded,"add_tooltip_label();");
          );
 
-        <!-- 个性化标签（3） -->
-        ifnot(%2 LT 2,
-            trace('tags::',%3);
-            set(hotspot[get(hsp_name)].height,80);
-            set(hotspot[get(hsp_name)].width,1);
-            txtadd(hotspot[get(hsp_name)].onloaded,"add_tooltip_label();add_tooltip_dot();");
-            set(hotspot[get(hsp_name)].rotate,35);
-        );
-
+  
         set(hotspot[get(hsp_name)].name,%1);
         set(hotspot[get(hsp_name)].hotspottype,%2);
         set(hotspot[get(hsp_name)].hotspottitle,%3);
@@ -42,140 +34,211 @@
         set(hotspot[get(hsp_name)].scale,1);
         set(hotspot[get(hsp_name)].autoalpha,false);
         set(hotspot[get(hsp_name)].distorted,false);
-                <!-- layer -->
-    
- 
-        addhotspot(get(hsp_name));
-        set(hotspot[get(hsp_name)].ondown,dragJQhotspot(););
-
-    </action>
 
-  <action name="editJQHotspot">
-      showlog();
-      set(hsp_name,%1); 
-      set(hsp_type,%2); 
-      trace('edit');
-    </action> 
-
-    <action name="addImgTextHotSpot1">
-        set(schp_name,%1); 
-        set(hotspot[get(schp_name)].type,'text');
-        set(hotspot[get(schp_name)].ath,%4);
-        set(hotspot[get(schp_name)].atv,%5);
-        set(hotspot[get(schp_name)].hotspottitle,%3);
-        set(hotspot[get(schp_name)].wordcontent,%9);
-        set(hotspot[get(schp_name)].hotspotlink,%8);
-        set(hotspot[get(schp_name)].alpha,1);
-        set(hotspot[get(schp_name)].scale,1);
-        set(hotspot[get(schp_name)].autoalpha,false);
-        set(hotspot[get(schp_name)].distorted,false);
-                 <!-- set(hotspot[get(schp_name)].width,'prop');
-        set(hotspot[get(schp_name)].height,%11); -->
-        set(hotspot[get(schp_name)].width, 1); 
-        set(hotspot[get(schp_name)].height,70); 
-        set(hotspot[get(schp_name)].visible,true);
-                <!-- set(hotspot[get(schp_name)].onhover,showtext(get(hotspottitle),skintext));  -->
-        addhotspot(get(schp_name));
-        set(hotspot[get(schp_name)].onclick,'js(__krfn.utils.linkopen(%8,%2));');
-  
-        if(%7 == false,
-          , 
-          set(hotspot[get(schp_name)].ondown,draghotspot1(););
-                  <!-- set(hotspot[get(schp_name)].onup,js(__krfn.angle.updateHotSpotData(get(xml.scene),get(name),get(ath),get(atv),"imgtext"))); -->
-        );
+        set(hotspot[get(hsp_name)].ondown,dragJQhotspot(););
+        set(hotspot[get(hsp_name)].onup,js(__krfn.angle.updateHotSpotData(get(xml.scene),get(name),get(ath),get(atv))));
 
-                                                        <!-- txtadd(hotspot[get(schp_name)].onloaded,"add_all_the_time_tooltip(hotspot[get(name)].hotspottitle);"); -->
-        <!-- txtadd(hotspot[get(schp_name)].onloaded,"add_all_2_tooltip(hotspot[get(name)].hotspottitle);"); -->
-        <!-- txtadd(hotspot[get(schp_name)].onloaded,"add_all_2_tooltip(hotspot[get(name)].hotspottitle);"); -->
-        txtadd(hotspot[get(schp_name)].onloaded,"add_all_2_tooltip();");
-                                                        <!-- txtadd(hotspot[get(schp_name)].onloaded,"add_all_2_tooltip(hotspot[get(name)].hotspottitle,hotspot[get(name)].ath,hotspot[get(name)].atv);"); -->
+         txtsplit(%10,'|',fontSize,pos,isHover,borderColor,fillColor,textColor,isShowLine,isTextWrap,lineDirection,textDirection,textNumPerLine,duration,frameNumber);
      
-        set(hotspot[get(schp_name)].onhover,null);
-        set(hotspot[get(schp_name)].onout,null);
-        set(hotspot[get(schp_name)].onover,null);
-       
-              <!-- if(%10 == true,
-          set(plugin[get(tooltipname)].visible,true);,
-          set(plugin[get(tooltipname)].visible,false);
-        ); -->
-        <!-- txtadd(csstxt, 'text-align:center; color:#FFFFFF; font-family:STXihei; font-size:', %12,'px');
-        set(plugin[get(tooltipname)].css,get(csstxt)));, -->
+   
+        <!-- 个性化标签（3） -->
+        if(%2 == 3,    
+            set(hotspot[get(hsp_name)].height,80);
+            set(hotspot[get(hsp_name)].width,1);
+            set(hotspot[get(hsp_name)].padding,0);
+            set(hotspot[get(hsp_name)].background,false);
+            txtadd(line,'<div style="background-color: ',get(borderColor),';width:1px;height:80px;"></div>');
+            trace('tags::',tagStyle);
+            copy(hotspot[get(hsp_name)].html,line);
+            txtadd(hotspot[get(hsp_name)].onloaded,"add_tooltip_label();add_tooltip_dot();");
+            if(
+                lineDirection == 'right-top',
+                set(hotspot[get(hsp_name)].rotate,35);
+            );
+            if(
+                lineDirection == 'right-center',
+                set(hotspot[get(hsp_name)].rotate,90);
+            );
+            if(
+                lineDirection == 'right-bottom',
+                set(hotspot[get(hsp_name)].rotate,-35);
+            );
+            if(
+                lineDirection == 'left-top',
+                set(hotspot[get(hsp_name)].rotate,-35);
+            );
+            if(
+                lineDirection == 'left-center',
+                set(hotspot[get(hsp_name)].rotate,90);
+            );
+            if(
+                lineDirection == 'left-bottom',
+                set(hotspot[get(hsp_name)].rotate,35);
+            );
+        );
 
+        addhotspot(get(hsp_name));
     </action>
 
+
     <action name="add_tooltip_label">
-        txtadd(tooltipname2, 'tooltip2_', get(name)); 
-          <!-- fontSize: 12,
-        position: "top",
-        isHover: false,
-        borderColor: "",
-        isShowLine: "",
-        isTextWrap: "",
-        lineDirection: "",
-        textColor: "",
-        textDirection: "",
-        textNumPerLine: "",
-        duration: 0,
-        frameNumber: 0, -->
-        txtsplit(hotspotStyle,'|',fontSize,pos,isHover,borderColor,isShowLine,isTextWrap,lineDirection,textColor,textDirection,textNumPerLine,duration,frameNumber);
-        trace('hotspotStyle::',lineDirection);
-        addlayer(get(tooltipname2));
-        txtadd(layer[get(tooltipname2)].parent, 'hotspot[', get(name), ']');
-        set(layer[get(tooltipname2)].autowidth, true);
-        set(layer[get(tooltipname2)].width,'prop');
-        set(layer[get(tooltipname2)].height,30); 
-        set(layer[get(tooltipname2)].edge,center);
-        set(layer[get(tooltipname2)].background,false);
-        set(layer[get(tooltipname2)].x,0);
-        set(layer[get(tooltipname2)].y,-45);
-        set(layer[get(tooltipname2)].padding,0);
-        set(layer[get(tooltipname2)].type,'html');
-        set(layer[get(tooltipname2)].url,'%SWFPATH%/plugins/textfield.swf');
-        set(layer[get(tooltipname2)].border,false);
-        set(layer[get(tooltipname2)].align,center);
-        set(layer[get(tooltipname2)].ondown,'dragJQlayer();');
-     
+        txtadd(tooltipname, 'tooltip_', get(name)); 
+        txtsplit(hotspotStyle,'|',fontSize,pos,isHover,borderColor,fillColor,textColor,isShowLine,isTextWrap,lineDirection,textDirection,textNumPerLine,duration,frameNumber);
+        addlayer(get(tooltipname));
+        set(labelParent,get(name));
+        txtadd(layer[get(tooltipname)].parent, 'hotspot[', get(name), ']');
+        set(layer[get(tooltipname)].autowidth, true);
+        set(layer[get(tooltipname)].width,'prop');
+        set(layer[get(tooltipname)].height,30); 
+        set(layer[get(tooltipname)].edge,center);
+        set(layer[get(tooltipname)].background,false);
+        set(layer[get(tooltipname)].x,0);
+        set(layer[get(tooltipname)].y,-45);
+        set(layer[get(tooltipname)].padding,0);
+        set(layer[get(tooltipname)].type,'html');
+        set(layer[get(tooltipname)].url,'%SWFPATH%/plugins/textfield.swf');
+        set(layer[get(tooltipname)].border,false);
+        set(layer[get(tooltipname)].align,center);
+        set(layer[get(tooltipname)].ondown,'dragJQlayer();');
+        set(layer[get(tooltipname)].onup,js(__krfn.angle.updateHotSpotData(get(xml.scene),get(hsName),get(vath),get(vatv))));
+        <!-- set(hotspot[get(hsp_name)].onup,js(__krfn.angle.updateHotSpotData(get(xml.scene),get(name),get(ath),get(atv)))); -->
+        txtadd(labelCode, '<div style="display: flex; align-items: center; justify-content: center; position: relative; border: 0px solid rgba(255,255,255,1); padding: 6px 10px; white-space: pre; border-radius: 5px; background: rgba(0,0,0,0.5);">','<div style="text-align: left; font-size:',get(fontSize),'px; color: rgba(255,255,255,1); line-height: 1.4;">',get(hotspottitle),'</div>
+        </div>'); 
+        <!-- 个性化标签（3） -->
+        if(get(hotspottype) == 3,    
+            trace('lineDirection2::',lineDirection); 
+            txtadd(labelCode, '<div style="display: flex; align-items: center; justify-content: center; position: relative; border: 1px solid ',get(borderColor),'; padding: 6px 10px; white-space: pre; border-radius: 5px; background: ',get(fillColor),'">','<div style="text-align: left; font-size:',get(fontSize),'px; color: ',get(textColor),'; line-height: 1.4;">',get(hotspottitle),'</div></div>'); 
+            if(
+                lineDirection == 'right-top',
+                set(layer[get(tooltipname)].y,-60);
+                set(layer[get(tooltipname)].rotate,-35);
+             );
+            if(
+                lineDirection == 'right-center',
+                set(layer[get(tooltipname)].x,0);
+                set(layer[get(tooltipname)].y,-80);
+                set(layer[get(tooltipname)].rotate,-90);
+            );
+            if(
+                lineDirection == 'right-bottom',
+                set(layer[get(tooltipname)].y,60);
+                set(layer[get(tooltipname)].rotate,35);
+            );
+             if(
+                lineDirection == 'center-top',
+                set(layer[get(tooltipname)].y,-55);        
+             );
+             if(
+                lineDirection == 'center-bottom',
+                set(layer[get(tooltipname)].y,55);
+             );
+            if(
+                lineDirection == 'left-top',
+                set(layer[get(tooltipname)].y,-60);
+                set(layer[get(tooltipname)].rotate,35);
+             );
+            if(
+                lineDirection == 'left-center',
+                set(layer[get(tooltipname)].x,0);
+                set(layer[get(tooltipname)].y,80);
+                set(layer[get(tooltipname)].rotate,-90);
+             );
+            if(
+                lineDirection == 'left-bottom',
+                set(layer[get(tooltipname)].x,0);
+                set(layer[get(tooltipname)].y,60);
+                set(layer[get(tooltipname)].rotate,-35);
+             );
 
-        ifnot(get(hotspottype) LT 2,
-            set(layer[get(tooltipname2)].y,-60);
-            set(layer[get(tooltipname2)].rotate,-35);
         );
 
-        txtadd(labelCode, '<div style="display: flex; align-items: center; justify-content: center; position: relative; border: 0px solid rgba(255,255,255,1); padding: 6px 10px; white-space: pre; border-radius: 5px; background: rgba(0,0,0,0.5);">','<div style="text-align: left; font-size:',get(fontSize),'px; color: rgba(255,255,255,1); line-height: 1.4;">',get(hotspottitle),'</div>
-        </div>'); 
+     
 
-        copy(layer[get(tooltipname2)].html, labelCode);
+        copy(layer[get(tooltipname)].html, labelCode);
             
     </action>
     <!-- <style name="tooltip_dot_bg" type="container" border-radius="50%" bgcolor="0xFFFFFF" bgalpha="0.9"  height="20" width="20" keep="true"  /> -->
     <action name='add_tooltip_dot'>
         txtadd(tooldot, 'tooldot_', get(name)); 
-        trace('hey::',get(tooldot));
+        trace('hey::',get(borderColor));
         addlayer(get(tooldot));
         txtadd(layer[get(tooldot)].parent, 'hotspot[', get(name), ']');
         set(layer[get(tooldot)].width,10); 
         set(layer[get(tooldot)].height,10); 
         set(layer[get(tooldot)].padding,0); 
-        set(layer[get(tooldot)].x,0);
-        set(layer[get(tooldot)].y,40);
+       
         set(layer[get(tooldot)].align,center);
         set(layer[get(tooldot)].type,'text');
-        set(layer[get(tooldot)].background,true);
-        set(layer[get(tooldot)].backgroundcolor,0xFFFFFF); 
+        set(layer[get(tooldot)].background,false);
+        txtadd(dborderColor,'rgba(255,255,255,0.5)');
+        txtadd(line,'<div style="background-color: ',get(borderColor),';width:10px;height:10px;"></div>');
+        copy(layer[get(tooldot)].html,line);
+        set(layer[get(tooldot)].backgroundcolor,get(borderColor)); 
         set(layer[get(tooldot)].backgroundalpha,0.9); 
         set(layer[get(tooldot)].bgroundedge,5);
         set(layer[get(tooldot)].ondown,'dragJQlayer();');
-        <!-- set(layer[get(tooldot)].html, '<div style="width:100%;height:100%;border-radius:50%;background:rgba(255,255,255,0.9);"></div>'); -->
-  
+        set(layer[get(tooldotupdateHotSpotData )].onup,js(__krfn.angle.updateHotSpotData(get(xml.scene),get(hsName),get(vath),get(vatv))));
+
+        <!-- 个性化标签（3） -->
+        if(get(hotspottype) == 3,    
+            trace('lineDirection3::',lineDirection); 
+            if(
+                lineDirection == 'right-top',
+                set(layer[get(tooldot)].x,0);
+                set(layer[get(tooldot)].y,40);
+             );
+            if(
+                lineDirection == 'right-center',
+                set(layer[get(tooldot)].x,0);
+                set(layer[get(tooldot)].y,40);
+            );
+             if(
+                lineDirection == 'right-bottom',
+                set(layer[get(tooldot)].x,0);
+                set(layer[get(tooldot)].y,-40);
+            );
+             if(
+                lineDirection == 'center-top',
+                 set(layer[get(tooldot)].x,0);
+                 set(layer[get(tooldot)].y,40);
+             );
+             if(
+                lineDirection == 'center-bottom',
+                 set(layer[get(tooldot)].x,0);
+                 set(layer[get(tooldot)].y,-40);
+             );
+             if(
+                lineDirection == 'left-top',
+                 set(layer[get(tooldot)].x,0);
+                 set(layer[get(tooldot)].y,40);
+             );
+             if(
+                lineDirection == 'left-center',
+                 set(layer[get(tooldot)].x,0);
+                 set(layer[get(tooldot)].y,-40);
+             );
+             if(
+                lineDirection == 'left-bottom',
+                 set(layer[get(tooldot)].x,0);
+                 set(layer[get(tooldot)].y,-40);
+             );
+        );
+
     </action>
 
+   <action name="editJQHotspot">
+      showlog();
+      set(hsp_name,%1); 
+      set(hsp_type,%2); 
+      trace('edit');
+    </action> 
 
     <action name="dragJQlayer"> 
        txtadd(hsName, '', get(name)); 
-       txtreplace(hsName, 'tooltip2_', ''); 
+       txtreplace(hsName, 'tooltip_', ''); 
        txtreplace(hsName, 'tooldot_', ''); 
 
-       trace('drag::',hsName);
+       <!-- trace('drag::',hsName); -->
                 <!-- copy(drag_currentx, x);
         copy(drag_currenty, y);
         copy(drag_stagex, mouse.stagex); 

packages/qjkankan-editor/public/static/template/skin/vtourskin.xml

@@ -1185,28 +1185,6 @@
           set(plugin[get(tooltipname)].enabled,true);
     </action>
 
-    <action name="add_all_2_tooltip">
-        txtadd(tooltipname2, 'tooltip2_', get(name)); 
-        addlayer(get(tooltipname2));
-        txtadd(layer[get(tooltipname2)].parent, 'hotspot[', get(name), ']');
-        set(layer[get(tooltipname2)].autowidth, true);
-        set(layer[get(tooltipname2)].height,30); 
-        set(layer[get(tooltipname2)].edge,top);
-        set(layer[get(tooltipname2)].background,false);
-        set(layer[get(tooltipname2)].x,0);
-        set(layer[get(tooltipname2)].padding,0);
-        set(layer[get(tooltipname2)].type,'html');
-        set(layer[get(tooltipname2)].url,'%SWFPATH%/plugins/textfield.swf');
-        set(layer[get(tooltipname2)].border,false);
-        set(layer[get(tooltipname2)].align,center);
-        set(layer[get(tooltipname2)].ondown,draghotspot(););
-        trace('title==',%1);
-        txtadd(labelCode, '<div style="display: flex; align-items: center; justify-content: center; position: relative; border: 0px solid rgba(255,255,255,1); padding: 6px 10px; white-space: pre; border-radius: 5px; background: rgba(0,0,0,0.5);">','<div style="text-align: left; font-size: 12px; color: rgba(255,255,255,1); line-height: 1.4;">',get(%1),'</div></div>'); 
-        copy(layer[get(tooltipname2)].html, labelCode)
-            
-    </action>
-       
-
   -->
     <layer name="mapcontainer" keep="true" type="container" bgcolor="0x000000" bgalpha="0.2" align="righttop" x="95" y="0" width="400" height="300" visible="false">
         <!-- <layer name="map" url="" align="center" x="0" y="0" width="392" height="292" handcursor="false" scalechildren="false">

packages/qjkankan-editor/src/core/angle.js

@@ -17,10 +17,10 @@ export default class Angle {
    * @param {*} hotspotType 
    */
   updateHotSpotData(hsName, hpname, ath, atv) {
-    console.log('updateHotSpotData',arguments)
+    // console.log('updateHotSpotData', arguments);
     this.ath = ath;
     this.atv = atv;
-    if (ath && atv ) {
+    if (ath && atv) {
       vue.$bus.emit('updateHotSpotHV', { hsName, hpname, ath, atv })
     }
   }

packages/qjkankan-editor/src/core/hotspot.js

@@ -18,10 +18,11 @@ const initState = {
         position: "top",
         isHover: false,
         borderColor: "",
+        fillColor:"",
+        textColor: "",
         isShowLine: "",
         isTextWrap: "",
         lineDirection: "",
-        textColor: "",
         textDirection: "",
         textNumPerLine: "",
         duration: 0,

packages/qjkankan-editor/src/core/utils.js

@@ -58,7 +58,7 @@ export default class Utils {
    */
 
   edithotspot(krpano, param) {
-
+    debugger;
     // krpano.call(`editImgTextHotSpot(
     //   ${param.img},
     //   ${param.name},

packages/qjkankan-editor/src/views/hotspot/EditPanel.vue

@@ -242,7 +242,7 @@ export default {
     hotspot: {
       handler(val) {
         // console.error("this.hotspot", val);
-        console.error("hotspot-lineDirection", val.personalizedTagInfo.lineDirection);
+        console.error("hotspot", val.personalizedTagInfo);
       },
       deep: true,
     },