cesium左侧列表定位目标

时间:2019-09-21
本文章向大家介绍cesium左侧列表定位目标,主要包括cesium左侧列表定位目标使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

cesium左侧列表定位目标

功能:根据左侧列表经纬度等信息的值,进行搜索定位。

列表:

1  点击清除按钮可以清空所有input的值

2  点击查找可以定位到位置,如果输入的值不在范围内,会有弹出框提示。

3   每个值,输入错误都有个弹出框,提示你。

下面上代码

 1  // 左侧定位查找
 2     function locationClick() {
 3         locationLon = $("#location_lon").val();
 4         locationLat = $("#location_lat").val();
 5         locationHeight = $("#location_height").val();
 6         locationCenter = Cesium.Cartesian3.fromDegrees(Number(locationLon), Number(locationLat), Number(locationHeight));
 7 
 8         locationHeading = Cesium.Math.toRadians($("#location_heading").val());
 9         locationPitch = Cesium.Math.toRadians($("#location_pitch").val());
10         locationRange = $("#location_range").val();
11 
12         if (locationLon) {
13             locationLon = Number(locationLon);
14         }
15 
16         if (locationLat) {
17             locationLat = Number(locationLat);
18         }
19 
20         if (locationHeight) {
21             locationHeight = Number(locationHeight);
22         } else {
23             locationHeight = Number(0);
24         }
25 
26         if (locationHeading) {
27             locationHeading = Number(locationHeading);
28         } else {
29             locationHeading = Number(0);
30         }
31 
32         if (locationPitch) {
33             locationPitch = Number(locationPitch);
34         } else {
35             locationPitch = Number(0);
36         }
37 
38         if (locationRange) {
39             locationRange = Number(locationRange);
40         } else {
41             locationRange = Number(0);
42         }
43 
44         if (locationLon && locationLat) {
45             locationLat = Number(locationLat);
46             locationLon = Number(locationLon);
47             $(".reminder_lat").hide();
48         } else {
49             alert("经纬度为必填项");
50         }
51 
52         // 控制输入值的范围
53         if (locationLon > 180 || locationLon < -180) {
54             alert("经度,请输入请输入(-180,180)的值");
55         }
56         if (locationLat > 90 || locationLat < -90) {
57             alert("纬度,请输入请输入(-90,90)的值");
58         }
59         if (locationHeight < 0 || locationHeight > 100000) {
60             alert("高度,请输入请输入(0,100000)的值");
61         }
62         if (locationHeading < 0 || locationHeading > 360) {
63             alert("朝向角,请输入请输入(0,360)的值");
64         }
65         if (locationPitch < -90 || locationPitch > 90) {
66             alert("俯仰角,请输入请输入(-90,90)的值");
67         }
68         if (locationRange > 10000000 || locationRange < 0) {
69             alert("距离,请输入请输入(30000,10000000)的值");
70         }
71 
72         viewer.camera.lookAt(locationCenter, new Cesium.HeadingPitchRange(Number(locationHeading), Number(locationPitch), Number(locationRange)));
73     }
74 
75     // 定位数据清除
76     $(function () {
77         $('#location_clear').click(function () {
78             $("#location_lon").val("");
79             $("#location_lat").val("");
80             $("#location_height").val("");
81             $("#location_heading").val("");
82             $("#location_pitch").val("");
83             $("#location_range").val("");
84         });
85     });

记得在合适的位置调用这个locationClick()这个函数哦~~;页面就是普通的页面;自己写就行。如有疑问,请加群讨论

 // 左侧定位查找
    function locationClick() {
        locationLon = $("#location_lon").val();
        locationLat = $("#location_lat").val();
        locationHeight = $("#location_height").val();
        locationCenter = Cesium.Cartesian3.fromDegrees(Number(locationLon), Number(locationLat), Number(locationHeight));

        locationHeading = Cesium.Math.toRadians($("#location_heading").val());
        locationPitch = Cesium.Math.toRadians($("#location_pitch").val());
        locationRange = $("#location_range").val();

        if (locationLon) {
            locationLon = Number(locationLon);
        }

        if (locationLat) {
            locationLat = Number(locationLat);
        }

        if (locationHeight) {
            locationHeight = Number(locationHeight);
        } else {
            locationHeight = Number(0);
        }

        if (locationHeading) {
            locationHeading = Number(locationHeading);
        } else {
            locationHeading = Number(0);
        }

        if (locationPitch) {
            locationPitch = Number(locationPitch);
        } else {
            locationPitch = Number(0);
        }

        if (locationRange) {
            locationRange = Number(locationRange);
        } else {
            locationRange = Number(0);
        }

        if (locationLon && locationLat) {
            locationLat = Number(locationLat);
            locationLon = Number(locationLon);
            $(".reminder_lat").hide();
        } else {
            alert("经纬度为必填项");
        }

        // 控制输入值的范围
        if (locationLon > 180 || locationLon < -180) {
            alert("经度,请输入请输入(-180,180)的值");
        }
        if (locationLat > 90 || locationLat < -90) {
            alert("纬度,请输入请输入(-90,90)的值");
        }
        if (locationHeight < 0 || locationHeight > 100000) {
            alert("高度,请输入请输入(0,100000)的值");
        }
        if (locationHeading < 0 || locationHeading > 360) {
            alert("朝向角,请输入请输入(0,360)的值");
        }
        if (locationPitch < -90 || locationPitch > 90) {
            alert("俯仰角,请输入请输入(-90,90)的值");
        }
        if (locationRange > 10000000 || locationRange < 0) {
            alert("距离,请输入请输入(30000,10000000)的值");
        }

        viewer.camera.lookAt(locationCenternew Cesium.HeadingPitchRange(Number(locationHeading), Number(locationPitch), Number(locationRange)));
    }

    // 定位数据清除
    $(function () {
        $('#location_clear').click(function () {
            $("#location_lon").val("");
            $("#location_lat").val("");
            $("#location_height").val("");
            $("#location_heading").val("");
            $("#location_pitch").val("");
            $("#location_range").val("");
        });
    });

原文地址:https://www.cnblogs.com/yaosusu/p/11561476.html