js代码获取Cesium的czml数据

Demo举例：

北京16个区县，2016年1月1日24小时AQI数据的3D动画演变过程，Cesium1.16使用CZML格式的数据展示动画

[
  {
    "id" : "document",
    "name" : "CZML Polygon - Intervals and Availability",
    "version" : "1.0"
  }, {"id":"huairouqu",
"name":"怀柔区AQI",
"availability":"2016-01-01T00:00:00Z/2016-01-02T00:00:00Z",
"polygon":{"positions":{"cartographicDegrees":[116.6988,41.0213,0,116.6976,41.0189,0,116.6955,41.0155,0,116.6934,41.0137,0,116.6905,41.0126,0,116.6908,41.0103,0,116.6914,41.0079,0,116.6879,41.0042,0,116.6862,41.0023,0,116.6847,41.0019,0,116.6837,41.0015,0,116.6831,41.0002,0,116.6833,40.9993,0,116.6829,40.9981,0,116.6828,40.996,0,116.6829,40.995,0,116.6823,40.9945,0 ……
116.6521,41.0569,0,116.6546,41.0558,0,116.6571,41.0527,0,116.657,41.0513,0,116.6601,41.0495,0,116.6626,41.0485,0,116.6643,41.0476,0,116.6657,41.0467,0,116.6695,41.0463,0,116.6713,41.0458,0,116.6733,41.0464,0,116.6762,41.044,0,116.6777,41.0428,0,116.6803,41.0419,0,116.6841,41.0424,0,116.6891,41.0446,0,116.6911,41.0418,0,116.6922,41.0403,0,116.6913,41.0378,0,116.6925,41.0358,0,116.6944,41.0342,0,116.6959,41.0311,0,116.6952,41.0276,0,116.6966,41.0237,0]},
"material":{
"solidColor":
{"color":[
{"interval":"2016-01-01T00:00:00Z/2016-01-01T08:00:00Z","rgba":[255,255,0,255]},
{"interval":"2016-01-01T08:00:00Z/2016-01-01T19:00:00Z","rgba":[255,126,0,255]},
]
        }
      },
      "perPositionHeight" : false,
     "extrudedHeight":[{
"interval":"2016-01-01T00:00:00Z/2016-01-01T01:00:00Z","number":6900},
{"interval":"2016-01-01T01:00:00Z/2016-01-01T02:00:00Z","number":7300},
……
     ]
    }
  },
  {
    "id" : "miyunxian",
    "name" : "密云县API",
    "availability":"2016-01-01T16:20:00Z/2016-01-02T00:00:00Z",
    "polygon" : {
      "positions" : {
        "cartographicDegrees" :  [116.88697199993148, 40.801070000005474 ,0,116.88699899969563, 40.80083600024426
……

因为坐标小数点后位数较多，导致数据文件较大，因为需要处理下坐标

需要引入的js文件

 <script type="text/javascript" src="jquery-1.11.3.min.js"></script>
	
		<script type="text/javascript" src="JSON-js-master\json2.js"></script>
		<script type="text/javascript" src="beijing11.js"></script

用到了读取JSON的类库json2.js

还有jquery

beijing11.js是czml格式的数据源模板（手动拷贝粘贴处理构造出来北京几个区的，累死了，考虑用代码实现构造！），将其放在bjCZML变量里，test.json就是用ogr2ogr方法将在线的ESRI服务里面的行政区图层坐标转成的GeoJSON格式的数据源文件。

读取JSON文件：

function doJSON(){
//读czml数组内容，拷贝出16份
var czmlArr=bjCZML;
var count=bjCZML.length;
var dataroot="test.json"; 
$.getJSON(dataroot, function(data){
var features=data.features; 
var fcount=features.length;
//循环数组，得到各个区的名称和坐标
for(var i = 0; i < fcount; i++){
var feature=features[i];
var name=feature.properties.Name_CHN;
var pts=feature.geometry.coordinates[0];//[][]
var exist=false;
for(var j=0;j<czmlArr.length;j++)
{
var obj=czmlArr[j];
if(obj.name.indexOf(name)>=0)
{
exist=true;
break;
}
}
if(name.indexOf("怀柔")>=0)
exist=false;
if(!exist){
var item=bjCZML[1];
var item1={};
extend(item1,item);
item1.name=name;
item1.polygon.positions.cartographicDegrees=doSource1(name,pts);
czmlArr.push(item1);

//czmlArr[c].name=name;
//czmlArr[c].polygon.positions.cartographicDegrees=doSource1(pts);
}
}
var c=czmlArr.length;
//alert(c);
}); 
doCSVValue(czmlArr);
//输出
var str;
str=JSON.stringify(czmlArr);
document.write("str:"+str);
}

//简单数组的拷贝，修改，会影响原值，因此需要硬拷贝
function getType(o)
    {
        var _t;
        return ((_t = typeof(o)) == "object" ? o==null && "null" || Object.prototype.toString.call(o).slice(8,-1):_t).toLowerCase();
    }
    function extend(destination,source)
    {
        for(var p in source)
        {
            if(getType(source[p])=="array"||getType(source[p])=="object")
            {
                destination[p]=getType(source[p])=="array"?[]:{};
                arguments.callee(destination[p],source[p]);
            }
            else
            {
                destination[p]=source[p];
            }
        }
    }

简单的拷贝，会直接修改数据源的值，所以，需要硬拷贝。


doSource1是为了缩小数据源数据，将坐标截取小数点后四位，并隔5个留一个坐标的方法

//处理坐标
function doSource1(name,pts){

var newPts=[];
			var n=5;
			if(name.indexOf("怀柔")>=0)
			{
			n=1;
			}
			if(name.indexOf("朝阳")>=0)
			{
			pts=pts[0];
			}
			var c=pts.length/n;
			var count=Math.floor(c);
			for(var ii = 0; ii < count; ii++){
			var j=ii*n;
			var x=pts[j][0];
			var y=pts[j][1];	
			var z=0;
			x=x.toFixed(4);
			y=y.toFixed(4);
			z=z.toFixed(0);
			newPts.push(Number(x));
			newPts.push(Number(y));
			newPts.push(Number(z));
			}
			console.log(name+":"+newPts);
			//document.write(": "+newPts+"\t\n");
return newPts;
}

doCSVValue方法是读取csv格式的文件，zoneAvgAQI_GB2312.csv文件里存储了每小时行政区的AQI数值，将其读取，并给czml数组赋值，根据AQI的值进行3D拉伸

/处理数值
function doCSVValue(czmlArr){
//读csv
$.get('zoneAvgAQI_GB2312.csv',function(data){
    var dataStr = new String(data);
    var lines = dataStr.split('\n');
	//循环czml
	for(var j=10;j<czmlArr.length;j++){
	var obj=czmlArr[j];
	var name=obj.name;
	var valueIndex=0;
	for(var i=0;i<lines.length;i++){
	var cols= lines[i].split(',');
	if(name.indexOf(cols[1])>=0){
	var cValue=cols[2]*100;
	//更改czml数组内容
	obj.polygon.extrudedHeight[valueIndex].number=cValue;	
	if(valueIndex>=23){
	break;
	}
	valueIndex++;	
	}	
	}
	
	}
	
	
	console.log("csv:"+lines);
    
},dataType='text');
}

将结果输出到页面，然后就可以手工拷贝出来，存成czml的数据源了。