cesium可视化空间数据2

圆柱圆锥体

<!DOCTYPE html>

<html>

<head>

  <!-- Use correct character set. -->

  <meta charset="utf-8">

  <!-- Tell IE to use the latest, best version. -->

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

  <title>Hello World!</title>

  <script src="../Cesium/Build/Cesium/Cesium.js"></script>

  <style>

 @import url(../Cesium/Build/Cesium/Widgets/widgets.css);

      html, body, #cesiumContainer {

          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;

      }

  </style>

</head>

<body>

  <div id="cesiumContainer"></div>

  <script>

var viewer = new Cesium.Viewer('cesiumContainer');

var greenCylinder = viewer.entities.add({//Cylinder圆柱体

    name : 'Green cylinder with black outline',

    position: Cesium.Cartesian3.fromDegrees(-100.0, 40.0, 200000.0),

    cylinder : {

        length : 400000.0,

        topRadius : 200000.0,//圆柱体的顶部半径。

        bottomRadius : 200000.0,//    圆柱体底部的半径。

        material : Cesium.Color.GREEN.withAlpha(0.5),//绿色半透明

        outline : true,//轮廓

        outlineColor : Cesium.Color.DARK_GREEN//轮廓颜色深绿色

    }

});

var redCone = viewer.entities.add({//红色圆锥体

    name : 'Red cone',

    position: Cesium.Cartesian3.fromDegrees(-105.0, 40.0, 200000.0),

    cylinder : {

        length : 400000.0,

        topRadius : 0.0,

        bottomRadius : 200000.0,

        material : Cesium.Color.RED

    }

});

viewer.zoomTo(viewer.entities);

  </script>

</body>

</html>

<!DOCTYPE html>

<html>

<head>

  <!-- Use correct character set. -->

  <meta charset="utf-8">

  <!-- Tell IE to use the latest, best version. -->

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

  <title>Hello World!</title>

  <script src="../Cesium/Build/Cesium/Cesium.js"></script>

  <style>

 @import url(../Cesium/Build/Cesium/Widgets/widgets.css);

      html, body, #cesiumContainer {

          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;

      }

  </style>

</head>

<body>

  <div id="cesiumContainer"></div>

  <script>

var viewer = new Cesium.Viewer('cesiumContainer');

var redPolygon = viewer.entities.add({//红色多边形

    name : 'Red polygon on surface',

    polygon : {

        hierarchy : Cesium.Cartesian3.fromDegreesArray([-115.0, 37.0,

                                                        -115.0, 32.0,

                                                        -107.0, 33.0,

                                                        -102.0, 31.0,

                                                        -102.0, 35.0]),//hierarchy多边形层次

        material : Cesium.Color.RED

    }

});

var greenPolygon = viewer.entities.add({//绿色多边形

    name : 'Green extruded polygon',

    polygon : {

        hierarchy : Cesium.Cartesian3.fromDegreesArray([-108.0, 42.0,

                                                        -100.0, 42.0,

                                                        -104.0, 40.0]),

        extrudedHeight: 500000.0,//多边形的挤出面和椭圆面之间的距离（以米为单位）

        material : Cesium.Color.GREEN,

        closeTop : false,

        closeBottom : false

    }

});

var orangePolygon = viewer.entities.add({//橙色多边形

    name : 'Orange polygon with per-position heights and outline',

    polygon : {

        hierarchy : Cesium.Cartesian3.fromDegreesArrayHeights([-108.0, 25.0, 100000,

                                                               -100.0, 25.0, 100000,

                                                               -100.0, 30.0, 100000,

                                                               -108.0, 30.0, 300000]),

        extrudedHeight: 0,//多边形的挤出面和椭圆面之间的距离（以米为单位）。

        perPositionHeight : true,//对每个位置使用options.positions的height，而不使用options.height来确定高度

        material : Cesium.Color.ORANGE.withAlpha(0.5),//橘色半透明

        outline : true,

        outlineColor : Cesium.Color.BLACK//黑色轮廓线

    }

});

var bluePolygon = viewer.entities.add({//蓝色多边形

    name : 'Blue polygon with holes and outline',

    polygon : {

        hierarchy : {

            positions : Cesium.Cartesian3.fromDegreesArray([-99.0, 30.0,

                                                            -85.0, 30.0,

                                                            -85.0, 40.0,

                                                            -99.0, 40.0]),

            holes : [{

                positions : Cesium.Cartesian3.fromDegreesArray([

                    -97.0, 31.0,

                    -97.0, 39.0,

                    -87.0, 39.0,

                    -87.0, 31.0

                ]),

                holes : [{

                    positions : Cesium.Cartesian3.fromDegreesArray([

                        -95.0, 33.0,

                        -89.0, 33.0,

                        -89.0, 37.0,

                        -95.0, 37.0

                    ]),

                    holes : [{

                        positions : Cesium.Cartesian3.fromDegreesArray([

                            -93.0, 34.0,

                            -91.0, 34.0,

                            -91.0, 36.0,

                            -93.0, 36.0

                        ])

                    }]

                }]

            }]

        },

        material : Cesium.Color.BLUE.withAlpha(0.5),

        outline : true,

        outlineColor : Cesium.Color.BLACK

    }

});

viewer.zoomTo(viewer.entities);

  </script>

</body>

</html>

<!DOCTYPE html>

<html>

<head>

  <!-- Use correct character set. -->

  <meta charset="utf-8">

  <!-- Tell IE to use the latest, best version. -->

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <!-- Make the application on mobile take up the full browser screen and disable user scaling. -->

  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

  <title>Hello World!</title>

  <script src="../Cesium/Build/Cesium/Cesium.js"></script>

  <style>

 @import url(../Cesium/Build/Cesium/Widgets/widgets.css);

      html, body, #cesiumContainer {

          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;

      }

  </style>

</head>

<body>

  <div id="cesiumContainer"></div>

  <script>

var viewer = new Cesium.Viewer('cesiumContainer');

var redLine = viewer.entities.add({

    name : 'Red line on the surface',

    polyline : {

        positions : Cesium.Cartesian3.fromDegreesArray([-75, 35,

                                                        -125, 35]),

        width : 5,//多段线的宽度（以像素为单位）。

        material : Cesium.Color.RED

    }

});

var glowingLine = viewer.entities.add({

    name : 'Glowing blue line on the surface',

    polyline : {

        positions : Cesium.Cartesian3.fromDegreesArray([-75, 37,

                                                        -125, 37]),

        width : 10,

        material : new Cesium.PolylineGlowMaterialProperty({

            glowPower : 0.2,//发光强度的属性，以总线宽度的百分比表示。

            color : Cesium.Color.BLUE

        })

    }

});

var orangeOutlined = viewer.entities.add({

    name : 'Orange line with black outline at height and following the surface',

    polyline : {

        positions : Cesium.Cartesian3.fromDegreesArrayHeights([-75, 39, 250000,

                                                               -125, 39, 250000]),

        width : 5,

        material : new Cesium.PolylineOutlineMaterialProperty({

            color : Cesium.Color.ORANGE,

            outlineWidth : 2,

            outlineColor : Cesium.Color.BLACK

        })

    }

});

var purpleArrow = viewer.entities.add({

    name : 'Purple straight arrow at height',

    polyline : {

        positions : Cesium.Cartesian3.fromDegreesArrayHeights([-75, 43, 500000,

                                                               -125, 43, 500000]),

        width : 10,

        followSurface : false,

        material : new Cesium.PolylineArrowMaterialProperty(Cesium.Color.PURPLE)

    }

});

viewer.zoomTo(viewer.entities);

  </script>

</body>

</html>

  </script>

</body>

</html>

cesium可视化空间数据2的更多相关文章

cesium可视化空间数据1
---恢复内容开始--- 1.多边形我们要从经度和纬度列表中为美国怀俄明州添加一个多边形.(怀俄明被选中是因为它是一个简单的多边形.)我们可以复制并粘贴以下代码到Sandcastle中: < ...
用Cesium可视化地下设施、矿山和地质层
Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 本月的CesiumJS 1.70发布引入的一项关键改进是地下数据 ...
Cesium数据可视化-仓储调度系统可视化部分(附github源码)
Cesium数据可视化-仓储调度系统可视化部分目的仓储调度系统需要一个可视化展示物资运输实况的界面,需要配合GPS设备发送的位置信息,实时绘制物资运输情况和仓储仓库.因此,使用Cesium可视化该 ...
Cesium参考资源
Reference resources cesium官网 cesium 下载 cesium官方文档 APIs cesium-workshop github cesium 官方示例 cesium git ...
手把手教你学习R语言
本文为带大家了解R语言以及分段式的步骤教程! 人们学习R语言时普遍存在缺乏系统学习方法的问题.学习者不知道从哪开始,如何进行,选择什么学习资源.虽然网络上有许多不错的免费学习资源,然而它们多过了头,反 ...
剖析虚幻渲染体系（15）- XR专题
目录 15.1 本篇概述 15.1.1 本篇内容 15.1.2 XR概念 15.1.2.1 VR 15.1.2.2 AR 15.1.2.3 MR 15.1.2.4 XR 15.1.3 XR综述 15. ...
Cesium中级教程1 - 空间数据可视化（一）
Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ 本教程将教读者如何使用Cesium的实体(Entity)API绘 ...
Cesium中级教程4 - 空间数据可视化（二）
Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ Viewer中的Entity功能让我们看看Viewer为操作e ...
Ceisum官方教程3 -- 空间数据可视化
原文地址:https://cesiumjs.org/tutorials/Visualizing-Spatial-Data/ 这篇教程教你如何使用Cesium的Entity API去绘制空间数据,如点, ...

随机推荐

haproxy 配置mysql的代理
应用场境,是如果mysql服务器没有外网的,需要一个有外网的代理服务器做代理,这时就可以用haproxy做个四层的代理: listen mysql bind mode tcp balance roun ...
angular学习笔记(十三)
本篇主要介绍控制器的$scope中的数据是如何被改变的: 以下三种方法,都可以改变$scope中的number值: 1. 表达式: <span ng-click="number=num ...
Django内置过滤器详解附代码附效果图--附全部内置过滤器帮助文档
前言基本环境 Django版本:1.11.8 Python版本:3.6 OS: win10 x64 本文摘要提供了常用的Django内置过滤器的详细介绍,包括过滤器的功能.语法.代码和效果示例. ...
每日英语：March Remembers King's Dream
President Barack Obama on Wednesday said the entire world drew strength from the March on Washington ...
有趣的switch应用（填入种类，显示响应的价格）
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
在eclipse中配置server和database
配置server,以tomcat为例点击下图的tag 如果没有,就去这里找: 然后右键:new->server,根据你安装的server选择版本,然后finish就行了然后你右键那个serv ...
ucos-III基础教程汇总
目录: 1.ucos-III前言 2.uC/OS-III 概要 3.移植 uC/OS-III 到 STM32 4.调度器 5.uC/OS-III 时钟节拍,时间管理,时间片调度
hdu1495(经典bfs，平分水问题)
思路:搜索题,第一次做这种类型的题目吧,一开始表示不怎么明白题意所说的东东.其实就是要你判断可乐能不能被平分........ 有六种状态,从a瓶到b瓶,a-->c b-->a b- ...
3DES加密算法32个字节
简介最近开发的一个项目,使用到了3DES加密算法,加密socket服务端和客户端通信的报文,因为加密秘钥是32个字节,结果折腾了一番,现在记录下来分享! 1.Des3EncryptUtils.jav ...
ASP.new GridView获取隐藏列值的几种方法
解决方法: 原文来自:http://www.tzwhx.com/NewShow/newBodyShow/控件_32933.html 作者:lerit 1.隐藏列前获取数据看这样一个例子(以下均以此 ...

cesium可视化空间数据2

cesium可视化空间数据2的更多相关文章

随机推荐

热门专题