• Skyline WEB端开发 ——添加标签后移动


    针对于标签或者模型,在skyline上可以进行移动。可以让一个模型可以像无人机似的飞行,或者描述从一个点到另一个点的飞行轨迹。

    话不多说,直接上干货。

    第一步 添加标签

    参考网址:https://www.cnblogs.com/Fooo/p/12749580.html

    第二步 设置属性

    function createLable(){
      var label = sgworld.Creator.CreateLabel(labelPos, "北京科技有限公司.
    西安办事处
    ", cLabelPath2, cLabelStyle, sgworld.ProjectTree.FindItem("新建组 ##575097"), "grey_bubble");
      //在生成lable对象后,需要设置一个属性,即 
      lable.Attachment.AutoDetach = false;
    }

    对于动态对象,AutoDetach设置为默认值 false。一旦摄像机到达动态对象,它会继续按照对象的移动状态来跟踪对象。但是,如果 AutoDetach 设置为 true,一旦摄像机到达对象时,它将停止。如果客户端不断更新对象的位置(例如,作为一个 GPS 更新),它应设置此值(在创建对象的时候)为 false。这样,如果用户飞往这个对象,它后面的摄像机继续。

    可理解为如果设置为false,那么当标签进行移动的时候,摄像机的位置会跟随着移动,当停止到某一点的时候,摄像机停止,标签再次移动的时候,摄像机依然随之移动。

    如果设置为true,那么当标签进行移动的时候,摄像机的位置会跟随着移动,当停止到某一点的时候,摄像机停止,标签再次移动的时候,摄像机不再随之移动。

    第三步 添加监听

    //在每一帧渲染前都会触发该方法
    sgworld.AttachEvent("OnFrame", OnFrame);
    OnFrame事件详解参考 https://www.cnblogs.com/Fooo/p/12749622.html

    第四步 添加移动方法

    
    

    1、Lerp

    
    

    一个坐标以一定比例朝着另一个坐标移动

    function OnFrame() {
        if(lable != null) {
            //默认飞到某一个位置
            var Washington = sgworld.Creator.CreatePosition(
                116.3912630081,
                39.9074812817,
                1000,
                0,
                0.0, // 偏航角
                -43.0); // 俯仰角
            lable.Position = lable.Position.Lerp(Washington, 1);
        }
    }
    Lerp(
        Position, //需要新建一个位置坐标,或者从某个地方读取到的位置坐标
        Percentage //移动的比例
    )

    2、Move

    将标签的坐标移动一段距离

    function OnFrame(){
      if(lable != null){
        lable.Position = lable.Position.Move(100, -90, 45);
      }
    }
    Move(
        Distance,    //移动的距离。
        Yaw,       //移动坐标的方向。0=北,90=东,180=南,-90=西,-180=南
        Pitch     //移动坐标的俯仰角。0=水平,1~90=向上飞行,-90~-1=向下飞行
    )

    3、MoveToward

    移动坐标走向另一个坐标指定的距离

    function OnFrame() {
        if(lable != null) {
            //默认飞到某一个位置
            var Washington = sgworld.Creator.CreatePosition(
                116.3912630081,
                39.9074812817,
                1000,
                0,
                0.0, // 偏航角
                -43.0); // 俯仰角
            lable.Position = lable.Position.MoveToward(Washington, 1);
        }
    }
    MoveToward(
        Position,    //一个位置坐标,表示坐标朝着已选定的坐标移动
        Distance    //移动的距离
    )

    以上就是关于标签或模型的移动的内容。

    下面附上完整代码可参考

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript" src="data/data.json"></script>
        <script language="javascript">
            //初始化加载TerraExplorer工程
            $(window).load(function () {
                try {
                    var flyPath = "C:\Users\admin\Desktop\SkyglobeLB.fly";
                    // attach callback to the load finished event
                    sgworld.AttachEvent("OnLoadFinished", OnProjectLoadFinished);
                    // Load default developer fly file from www.skylineglobe.com web site.
                    // default load is in async mode
                    sgworld.Project.Open(flyPath);
                }
                catch(ex) {
                    alert(ex.message);
                }
            });
            //加载事件
            function OnProjectLoadFinished(){
                //默认飞到某一个位置
                var Washington = sgworld.Creator.CreatePosition(
                    116.3912630081,
                    39.9074812817,
                    1000,
                    0,
                    0.0, // 偏航角
                    -45.0); // 俯仰角
                sgworld.Navigate.FlyTo(Washington);
            }
            //坐标点的位置
            var lable;
            //按照俯仰角进行移动
            function move(){
                //创建点
                var labelPos = sgworld.Creator.CreatePosition(
                        116.3912630081,
                        39.9074812817,
                        10,
                        2,
                        0,//Yaw
                        -60, // Pitch偏航角
                        -26); // Roll俯仰角);
                
                var cLabelStyle = sgworld.Creator.CreateLabelStyle();
                
                cLabelStyle.TextOnImage = false;//设置文本是否显示在图像上。设置true(字在图上),设置false(字在图下)
                cLabelStyle.Bold = true;//设置粗体
                cLabelStyle.MultilineJustification = "center";//如果有多行文字的话,确定文本对齐方式
                cLabelStyle.TextAlignment = "Top";//决定了有关的背景文本的水平和垂直对齐。
    //          cLabelStyle.MaxViewingHeight = 8000000;//最大高度,如果超过此高度后,该点将隐藏
                var cLabelPath = "F:\myself\images\grey_bubble.png";//图片路径
                lable = sgworld.Creator.CreateLabel(labelPos, "guanxin"+10, cLabelPath, cLabelStyle, sgworld.ProjectTree.FindItem("新建组 ##575097"), "grey_bubble"+10);
                lable.Attachment.AutoDetach = false;
                //在每一帧渲染前都会触发该方法
                sgworld.AttachEvent("OnFrame", OnFrame);
            }
            
            function OnFrame(){
                if(lable != null){
                    lable.Position = lable.Position.Move(100, -90, $("#pitch").val());
                }
            }
            
            /*function OnFrame(){
                if(lable != null){
                    //默认飞到某一个位置
                    var Washington = sgworld.Creator.CreatePosition(
                        116.3912630081,
                        39.9074812817,
                        1000,
                        0,
                        0.0, // 偏航角
                        -43.0); // 俯仰角
                    lable.Position = lable.Position.Lerp(Washington, 1);
                }
            }
            
            function OnFrame(){
                if(lable != null){
                    //默认飞到某一个位置
                    var Washington = sgworld.Creator.CreatePosition(
                        116.3912630081,
                        39.9074812817,
                        1000,
                        0,
                        0.0, // 偏航角
                        -43.0); // 俯仰角
                    lable.Position = lable.Position.MoveToward(Washington, 1);
                }
            }*/
        </script>
        <body>
            <!--0=水平,+90=从下到上垂直,-90=从上到下垂直-->
            俯仰角:<input type="text" name="pitch" id="pitch"  />
            <input type="button" value="移动" onclick="move()" />
            <hr />
            <div id="div_tree" style="20%;height:700px;float:left;border: rgb(1,158,213) 1px solid;">
                <object id="LY_TerraExplorerInformationWindow" classid="CLSID:3a4f9193-65a8-11d5-85c1-0001023952c1" style="100%;height:100%;"></object>
            </div>
            <div id="div_3dWindow" style="height:700px;79%;float:left;border: rgb(1,158,213) 1px solid;">
                <object id="LY_TerraExplorer3DWindow" classid="CLSID:3a4f9192-65a8-11d5-85c1-0001023952c1" style="100%;height:100%;"></object>
            </div>
            <object id="sgworld" classid="CLSID:3A4F9199-65A8-11D5-85C1-0001023952C1" style="visibility:hidden;height:0 "></object>
        </body>
    </html>
    
    
    
  • 相关阅读:
    ubuntu 16.0.5 修改网卡为固定IP
    Ubuntu PostgreSQL安装和配置
    NPOI 1.2.1版本替换为2.4.0版本实体类变更
    C# 之 Math取整
    解决github 下载过慢的问题
    优伦自动语言话务员设置
    python3学习笔记 列表
    【postgresql】role "root" does not exist 解决办法
    Eclipse使用的小技巧
    Servlet
  • 原文地址:https://www.cnblogs.com/Fooo/p/12749610.html
Copyright © 2020-2023  润新知