第一次开发app，还是遇到了很多困难，之前一直在写后端的东西，这一次写app也是一个尝试吧，直接上几个页面吧
1.登录页面后台使用的是java编写的接口，登陆过一次以后会把用户名和密码存入到本地文件中，第二次登陆会自动验证 2.首页的折线图使用了echars，生成了饼状图和折线图 function echars(){ var myChart = echarts.init(document.getElementById(‘div1’)); // 指定图表的配置项和数据 var option = { backgroundColor: ‘#D2F9FF’, title: { text: ‘温度变化表’ },
grid: { left: '1%', right: '1%', bottom: '1%', containLabel: true }, toolbox: { top:0, feature: { //点击图表可直接将柱形图与折线图进行切换 magicType: {show: true, type: ['line', 'bar']}, } }, tooltip: { trigger: 'axis' }, legend: { data:['温度变化表'] }, xAxis: { data: ["1:00","3:00","6:00","9:00","12:00","15:00","18:00"] }, yAxis: { name:'℃'}, series: [{ name: ‘出水温度:℃’, type: ‘line’, data: [30, 40, 60, 80, 88, 12, 22], itemStyle: { normal: { color: “#12cf96”,//折线点的颜色 lineStyle: { color: “#12cf96”//折线的颜色 } } }, }, { name: ‘回水温度:℃’, type: ‘line’, data: [10, 10, 20, 50, 45, 10, 15], } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option);
} function echars1(){ var myChart = echarts.init(document.getElementById('div2')); option = { title: { text: '用料分析' }, grid: { left: '1%', right: '1%', bottom: '1%', containLabel: true }, tooltip: { trigger: 'item', formatter: '{a} <br/>{b}: {c} ({d}%)' }, legend: { orient: 'vertical', left: 200, bottom:30, data: ['用料', '余料', ] }, graphic:{ type:"text", left:"center", top:"45%", style:{ text:"总供料 8t", textAlign:"center", fill:"#333", fontSize:30, fontWeight:300 } }, series: [ { name: '', type: 'pie', radius: ['50%', '70%'], avoidLabelOverlap: false, label: { show: false, position: 'left' }, emphasis: { label: { show: true, fontSize: '20', fontWeight: 'bold' } }, labelLine: { show: false }, data: [ {value: 3, name: '用料'}, {value: 5, name: '余料'}, ] } ] }; myChart.setOption(option);}
f
3.工单中的导航功能使用了百度地图的定位和路线规划功能，可以实时的获取自己的所在位置，然后根据自己所在位置和目的位置生成路线规划 3.文档的下载和预览功能实现原理是先把网络上的资源下载下来，然后系统检测本地所有的已安装软件，找出能够打开此文档的软件然后以列表的方式从app底部弹出4.工单中的上传图片功能会首先扫描手机本地资源，找出所有的图片供用户选择，然后使用一个异步把图片上传到阿里云的s3服务器，本地数据库保存一个图片的路径 function photograph(){ var src1= $api.byId(‘src1’); api.getPicture({ sourceType: ‘library’, encodingType: ‘jpg’, mediaValue: ‘pic’, destinationType: ‘base64’, allowEdit: true, quality: 50, targetWidth: 750, targetHeight: 750, saveToPhotoAlbum: false }, function(ret, err) { if (ret) { if (ret.base64Datanull||ret.base64Data"") { $api.attr(src1,‘src’, “…/image/图片框.png”)
}else{ $api.attr(src1,'src', ret.base64Data)}
} else { alert(JSON.stringify(err)); }
}); } 整个app大概就是这样，第一次写博客，大家多多包涵，如果有什么技术方面问题或者建议，欢迎评论，最后给大家一个福利http://datav.aliyun.com/tools/atlas/#&lat=30.37018632615852&lng=106.68898666525287&zoom=3.5，这个网址可以使根据你选择的地图区域生成json文件，可以远程访问或者下载到本地，功能强大。
