cesium图形上加载图片

<!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 entity = viewer.entities.add({

  position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),

  ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

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

  }

});

viewer.zoomTo(viewer.entities);

var ellipse = entity.ellipse; // Fo

ellipse.material = '//cesiumjs.org/images/2015/02-02/cats.jpg';

  </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 entity = viewer.entities.add({

  position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),

  ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

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

  }

});

viewer.zoomTo(viewer.entities);

var ellipse = entity.ellipse; // Fo

ellipse.material = new Cesium.CheckerboardMaterialProperty({

  evenColor : Cesium.Color.WHITE,

  oddColor : Cesium.Color.BLACK,

  repeat : new Cesium.Cartesian2(4, 4)

});

  </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 entity = viewer.entities.add({

  position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),

  ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

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

  }

});

viewer.zoomTo(viewer.entities);

var ellipse = entity.ellipse; // Fo

ellipse.material = new Cesium.StripeMaterialProperty({

  evenColor : Cesium.Color.WHITE,

  oddColor : Cesium.Color.BLACK,

  repeat : 32

});

  </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 entity = viewer.entities.add({

  position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),

  ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

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

  }

});

viewer.zoomTo(viewer.entities);

var ellipse = entity.ellipse; // Fo

ellipse.material = new Cesium.GridMaterialProperty({

  color : Cesium.Color.YELLOW,

  cellAlpha : 0.2,

  lineCount : new Cesium.Cartesian2(8, 8),

  lineThickness : new Cesium.Cartesian2(2.0, 2.0)

});

  </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 entity = viewer.entities.add({

  position: Cesium.Cartesian3.fromDegrees(-103.0, 40.0),

  ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

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

  }

});

viewer.zoomTo(viewer.entities);

var ellipse = entity.ellipse; // Fo

ellipse.material = new Cesium.GridMaterialProperty({

  color : Cesium.Color.YELLOW,

  cellAlpha : 0.2,

  lineCount : new Cesium.Cartesian2(8, 8),

  lineThickness : new Cesium.Cartesian2(2.0, 2.0)

});

ellipse.fill = false;

ellipse.outline = true;

ellipse.outlineColor = Cesium.Color.YELLOW;

ellipse.outlineWidth = 2.0;

  </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 entity = viewer.entities.add({

  polyline : {

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

                                                    -77.1, 35]),

    width : 5,

    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 entity = viewer.entities.add({

  polyline : {

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

                                                    -77.1, 35]),

  width : 5,

  material : new Cesium.PolylineOutlineMaterialProperty({

  color : Cesium.Color.ORANGE,

  outlineWidth : 3,

  outlineColor : Cesium.Color.BLACK

    })

  }

});

viewer.zoomTo(viewer.entities);

  </script>

</body>

</html>

cesium图形上加载图片的更多相关文章

iOS网络加载图片缓存策略之ASIDownloadCache缓存优化
iOS网络加载图片缓存策略之ASIDownloadCache缓存优化在我们实际工程中,很多情况需要从网络上加载图片,然后将图片在imageview中显示出来,但每次都要从网络上请求,会严重影响用 ...
【转】Android循环滚动广告条的完美实现，封装方便，平滑过渡，从网络加载图片，点击广告进入对应网址
Android循环滚动广告条的完美实现,封装方便,平滑过渡,从网络加载图片,点击广告进入对应网址关注finddreams,一起分享,一起进步: http://blog.csdn.net/finddr ...
异步加载图片到GridView上，防止OOM
图片资源: private int fore[]; private int back[]; fore = new int[]{R.drawable.a0, R.drawable.a1, R.drawa ...
iOS Safari 上加载的最大的图片尺寸
做WAP端项目时发现, 写css代码显示图片, 却显示不出.或用canvas 来加载图片的某一部分的时候显示不出, 代码如下: background: url() no-repeat -1000px ...
JQuery实现无刷新下拉加载图片
最近做的一个项目需要做页面无刷新下拉加载图片,调研了一番,大多都采用检测滚动条达到底部,然后利用ajax加载下一页数据对页面数据进行添加,根据这一逻辑,自己写了一个,具体代码如下: JQu ...
android 网络加载图片，对图片资源进行优化，并且实现内存双缓存 + 磁盘缓存
经常会用到网络文件比如查看大图片数据资源优化的问题,当然用开源的项目 Android-Universal-Image-Loader 或者 ignition 都是个很好的选择. 在这里把原来 ...
使用ajax预加载图片
使用Ajax 上面所给出的方法似乎不够酷,那现在来看一个使用Ajax实现图片预加载的方法.该方法利用DOM,不仅仅预加载图片,还会预加载CSS.JavaScript等相关的东西.使用Ajax,比直接使 ...
实例演示Android异步加载图片
本文给大家演示异步加载图片的分析过程.让大家了解异步加载图片的好处,以及如何更新UI.首先给出main.xml布局文件:简单来说就是 LinearLayout 布局,其下放了2个TextView和5个 ...
实例演示Android异步加载图片（转）
本文给大家演示异步加载图片的分析过程.让大家了解异步加载图片的好处,以及如何更新UI.首先给出main.xml布局文件:简单来说就是 LinearLayout 布局,其下放了2个TextView和5个 ...

随机推荐

android笔记-----消息提示
在/res/values目录下的文件中定义要显示的字符串,主要是考虑到后期可能需要换成英文之类的 <string name="login_checkBlank">用户名 ...
MYSQL COST optimizer
http://blog.chinaunix.net/uid-26896862-id-3326400.html https://www.slideshare.net/olavsa/mysql-optim ...
jquery+ashx checkbox 单选判断是否true 和 false 传值操作
示例图: html标签代码: <p></p> <label for="checkbox" style="float:left" & ...
理解 Linux 配置文件
介绍每个 Linux 程序都是一个可执行文件,它含有操作码列表,CPU 将执行这些操作码来完成特定的操作.例如,ls 命令是由 /bin/ls 文件提供的,该文件含有机器指令的列表,在屏幕上显示当前 ...
mac下borderless的window(无标题栏)如何实现
子类化NSWindow: - (void)awakeFromNib { [selfsetStyleMask:NSBorderlessWindowMask]; [selfsetAcceptsMouseM ...
jQuery的使用说明
jQuery是一款同prototype一样优秀js开发库类,特别是对css和XPath的支持,使我们写js变得更加方便!如果你不是个js高手又想写出优秀的js效果,jQuery可以帮你达到目的! ...
Sql Server数据库自增长字段标识列的插入或更新修改操作办法
写在前面的话:在日常的Sql server开发中,经常会用到Identity类型的标识列作为一个表结构的自增长编号.比如文章编号.记录编号等等.自增长的标识很大程度上方便了数据库程序的开发,但有时候这 ...
u-boot mkconfig文件分析
#!/bin/sh -e #遇到非0返回就退出脚本 # Script to create header files and links to configure # U-Boot for a spe ...
[已修正]安装struts找不到tld文件
今天安装的struts1.3,但是缺少tld文件,所以无法使用taglib,找了半天假设你的struts版本为1.3.10 解压后的目录为F:\struts-1.3.10-all\struts-1. ...
c++之——虚析构函数
先看代码: #include<iostream> using namespace std; class Parent { public: Parent() :a(), b(), c() { ...

cesium图形上加载图片

cesium图形上加载图片的更多相关文章

随机推荐

热门专题