krpano全景漫游(1.20.11版本)-添加热点动画以及文字

热点动画原理:krpano官方不推荐使用gif动画,所以我们在项目中一般用雪碧图,配合简单的动态代码,让图片动起来

1.在votourskin.xml文件中加以下代码


        

    calc(local.xframes, (caller.imagewidth /framewidth) BOR 0);
    calc(local.frames, xframes * ((caller.imageheight / frameheight) BOR 0));
    def(local.frame, integer, 0);
    calc(caller.crop, '0|0|' + framewidth + '|' + frameheight);
    
    setinterval(calc('crop_anim_' + caller.name), calc(1.0 / framerate),
        if(caller.loaded,
            inc(frame);
            if(frame GE frames, if(caller.onlastframe !== null, callwith(caller, onlastframe() ) ); set(frame,0); );
            mod(xpos, frame, xframes);
            div(ypos, frame, xframes);
            Math.floor(ypos);
            mul(xpos, framewidth);
            mul(ypos, frameheight);
            calc(caller.crop, xpos + '|' + ypos + '|' + framewidth + '|' + frameheight);
          ,
            
            clearinterval(calc('crop_anim_' + caller.name));
        );
    );
       

在tour.html文件中热点代码中做修改(此时已经有了热点动画)



用于设置热点名字的action,在votourskin.xml文件中


        txtadd(tooltipname, 'tooltip_', get(name));
        addplugin(get(tooltipname));
        txtadd(plugin[get(tooltipname)].parent, 'hotspot[', get(name), ']');
        set(plugin[get(tooltipname)].url,'%SWFPATH%/plugins/textfield.swf');
        set(plugin[get(tooltipname)].align,top);
        set(plugin[get(tooltipname)].edge,bottom);
        set(plugin[get(tooltipname)].x,0);
        set(plugin[get(tooltipname)].y,0);
        set(plugin[get(tooltipname)].autowidth,true);
        set(plugin[get(tooltipname)].autoheight,true);
        set(plugin[get(tooltipname)].vcenter,true);
        set(plugin[get(tooltipname)].background,true);
        set(plugin[get(tooltipname)].backgroundcolor,0x000000);
        set(plugin[get(tooltipname)].roundedge,5);
        set(plugin[get(tooltipname)].backgroundalpha,0.65);
        set(plugin[get(tooltipname)].padding,5);
        set(plugin[get(tooltipname)].border,false);
        set(plugin[get(tooltipname)].glow,0);
        set(plugin[get(tooltipname)].glowcolor,0xFFFFFF);
        set(plugin[get(tooltipname)].css,'text-align:center; color:#FFFFFF; font-family:MicrosoftYahei;  font-size:24px;');
        if(device.mobile,set(plugin[get(tooltipname)].css,'text-align:center; color:#FFFFFF; font-family:MicrosoftYahei; font-weight:bold; font-size:24px;');
            );
        set(plugin[get(tooltipname)].textshadow,0);
        set(plugin[get(tooltipname)].textshadowrange,6.0);
        set(plugin[get(tooltipname)].textshadowangle,90);
        if(text == '' OR text === null,
        copy(plugin[get(tooltipname)].html,scene[get(linkedscene)].title),
        copy(plugin[get(tooltipname)].html,text)
        );    
        set(plugin[get(tooltipname)].enabled,false);    

你可能感兴趣的:(krpano全景漫游(1.20.11版本)-添加热点动画以及文字)