123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354 |
- $(window).load(function(){
- $(".loading").fadeOut()
- })
- /****/
- // $(document).ready(function(){
- var whei=$(window).width()
- $("html").css({fontSize:whei/20})
- $(window).resize(function(){
- var whei=$(window).width()
- $("html").css({fontSize:whei/20})
- });
- function echarts_1() {
- // 基于准备好的dom,初始化echarts实例
- var myChart = echarts.init(document.getElementById('echarts1'));
- option = {
- // backgroundColor: '#00265f',
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- }
- },
- grid: {
- left: '0%',
- top:'40px',
- right: '0%',
- bottom: '4%',
- containLabel: true
- },
- xAxis: [{
- type: 'category',
- data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月'],
- axisLine: {
- show: true,
- lineStyle: {
- color: "rgba(255,255,255,.1)",
- width: 1,
- type: "solid"
- },
- },
- axisTick: {
- show: false,
- },
- axisLabel: {
- interval: 0,
- // rotate:50,
- show: true,
- splitNumber: 15,
- textStyle: {
- color: "rgba(255,255,255,.6)",
- fontSize: '12',
- },
- },
- }],
- yAxis: [{
- type: 'value',
- axisLabel: {
- //formatter: '{value} %'
- show:true,
- textStyle: {
- color: "rgba(255,255,255,.6)",
- fontSize: '12',
- },
- },
- axisTick: {
- show: false,
- },
- axisLine: {
- show: true,
- lineStyle: {
- color: "rgba(255,255,255,.1 )",
- width: 1,
- type: "solid"
- },
- },
- splitLine: {
- lineStyle: {
- color: "rgba(255,255,255,.1)",
- }
- }
- }],
- series: [
- {
- type: 'bar',
- data: [200, 300, 300, 900, 2500, 1200, 600],
- barWidth:'35%', //柱子宽度
- // barGap: 1, //柱子之间间距
- itemStyle: {
- normal: {
- color:'#2f89cf',
- opacity: 1,
- barBorderRadius: 5,
- }
- }
- }
- ]
- };
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- window.addEventListener("resize",function(){
- myChart.resize();
- });
- }
- function echarts_2() {
- // 基于准备好的dom,初始化echarts实例
- var myChart = echarts.init(document.getElementById('echarts2'));
- option = {
-
- title: [{
- text: '',
- left: 'center',
- textStyle: {
- color: '#fff',
- fontSize:'16'
- }
- }],
- tooltip: {
- trigger: 'item',
- formatter: "{a} <br/>{b}: {c} ({d}%)",
- position:function(p){ //其中p为当前鼠标的位置
- return [p[0] + 10, p[1] - 10];
- }
- },
- legend: {
- // top:'70%',
- // itemWidth: 10,
- // itemHeight: 10,
- // data:['故障','离线','在线'],
- // textStyle: {
- // color: 'rgba(255,255,255,.5)',
- // fontSize:'12',
- // }
- x: '90%',
- y: 'center',
- orient: 'vertical',
- itemGap: 12, //图例每项之间的间隔
- itemWidth: 10,
- itemHeight: 10,
- icon: 'rect',
- data:['故障','离线','在线'],
- textStyle: {
- color: [],
- fontStyle: 'normal',
- fontFamily: '微软雅黑',
- fontSize: 12,
- }
- },
- series: [
- {
- name:'基站状态',
- type:'pie',
- clockwise: false, //饼图的扇区是否是顺时针排布
- // minAngle: 20, //最小的扇区角度(0 ~ 360)
- center: ['50%', '50%'],
- radius: ['40%', '60%'],
- color: ['#ff1111', '#0699ff', '#06ffab'],
- label: {
- show:true,
- normal: {
- show: true,
- position: 'outside', //标签的位置
- formatter: "{b}:{d}%",
- textStyle: {
- color: '#fff',
- }
- },
- emphasis: {
- show: true,
- textStyle: {
- fontWeight: 'bold'
- }
- }
- },
- labelLine: {
- show:true
- },
- avoidLabelOverlap: true, ////是否启用防止标签重叠
- data:[
- {value:100, name:'故障'},
- {value:400, name:'离线'},
- {value:20000, name:'在线'},
- ],
- // itemStyle: { //图形样式
- // normal: {
- // borderColor: '#1e2239',
- // borderWidth: 1,
- // },
- // },
- }
- ]
- };
-
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- window.addEventListener("resize",function(){
- myChart.resize();
- });
- }
- function echarts_3() {
- // 基于准备好的dom,初始化echarts实例
- var myChart = echarts.init(document.getElementById('echarts3'));
- option = {
-
- title: [{
- text: "",
- left: 'center',
- textStyle: {
- color: '#fff',
- fontSize:'16'
- }
- }],
- tooltip: {
- trigger: 'item',
- formatter: "{a} <br/>{b}: {c} ({d}%)",
- position:function(p){ //其中p为当前鼠标的位置
- return [p[0] + 10, p[1] - 10];
- }
- },
- legend: {
- x: '90%',
- y: 'center',
- orient: 'vertical',
- itemGap: 12, //图例每项之间的间隔
- itemWidth: 10,
- itemHeight: 10,
- icon: 'rect',
- data:['破案','追踪','待处理'],
- textStyle: {
- color: [],
- fontStyle: 'normal',
- fontFamily: '微软雅黑',
- fontSize: 12,
- }
- },
- series: [
- {
- name:'案件处理',
- type:'pie',
- clockwise: false, //饼图的扇区是否是顺时针排布
- // minAngle: 20, //最小的扇区角度(0 ~ 360)
- center: ['50%', '50%'],
- radius: ['40%', '60%'],
- color: ['#0699ff', '#06ffab','#ff00aa'],
- label: {
- show:true,
- normal: {
- show: true,
- position: 'outside', //标签的位置
- formatter: "{b}:{d}%",
- textStyle: {
- color: '#fff',
- }
- },
- emphasis: {
- show: true,
- textStyle: {
- fontWeight: 'bold'
- }
- }
- },
- labelLine: {
- show:true
- },
- avoidLabelOverlap: true, ////是否启用防止标签重叠
- data:[
- {value:37,name:'破案'},
- {value:7, name:'追踪'},
- {value:4, name:'待处理'}
- ],
- }
- ]
- };
-
- // 使用刚指定的配置项和数据显示图表。
- myChart.setOption(option);
- window.addEventListener("resize",function(){
- myChart.resize();
- });
- }
-
- //加载地图
- function initMap(){
- // 百度地图API功能
- var map = new BMap.Map("map_container"); // 创建Map实例
- map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); // 初始化地图,设置中心点坐标和地图级别
- //添加地图类型控件
- var size1 = new BMap.Size(10, 50);
- map.addControl(new BMap.MapTypeControl({
- offset: size1,
- mapTypes:[
- BMAP_NORMAL_MAP,
- BMAP_HYBRID_MAP,
-
- ]}));
- // 编写自定义函数,创建标注
- function addMarker(point){
- var marker = new BMap.Marker(point);
- map.addOverlay(marker);
- }
- // 随机向地图添加25个标注
- var bounds = map.getBounds();
- var sw = bounds.getSouthWest();
- var ne = bounds.getNorthEast();
- var lngSpan = Math.abs(sw.lng - ne.lng);
- var latSpan = Math.abs(ne.lat - sw.lat);
- for (var i = 0; i < 25; i ++) {
- var point = new BMap.Point(sw.lng + lngSpan * (Math.random() * 0.7), ne.lat - latSpan * (Math.random() * 0.7));
- addMarker(point);
- };
-
- map.setCurrentCity("北京"); // 设置地图显示的城市 此项是必须设置的
- map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
- //设备地图颜色
- var mapStyle={
- // style:"midnight"
- };
- map.setMapStyle(mapStyle);
-
-
- //加载城市控件
- var size = new BMap.Size(10, 50);
- map.addControl(new BMap.CityListControl({
- anchor: BMAP_ANCHOR_TOP_LEFT,
- offset: size,
- }));
- }
- // });
|