北京地铁计价系统的实现_第1页
北京地铁计价系统的实现_第2页
北京地铁计价系统的实现_第3页
北京地铁计价系统的实现_第4页
北京地铁计价系统的实现_第5页
已阅读5页，还剩15页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、离散数学课程设计报告目 录一、地铁计价系统的实现21.设计目的22.设计内容23.实验步骤34.部分代码附录75.实验结果和结论19指导教师意见20一、 地铁计价系统的实现1. 设计目的1) 掌握dijkstra算法的思想；2) 掌握javascript数据类型之javascript对象；3) 采用模块化的思想编写程序；4) 学会用浏览器的调试功能检查代码；5) 掌握整个网页设计过程元素调用的问题，可以将各个元素正确调用；6) 学会将知识应用于实际的方法，提高分析和解决问题的能力，增加综合能力；7) 为后续计算机课程的学习打下坚实基础；2. 设计内容本次设计基于html+css+javascr

2、ipt设计了一款网页端的地铁计价系统，通过使用javascript对象存储数据，js调用数据和计算，html，css美化前端样式，js实现交互功能等，实现了一个完整的，实用的网页端地铁计价系统。3. 实验步骤1) 整体架构网页前端index.html由HTML编写，用一个subway-out的大容器承载全部元素，然后将这个容器细分为三大块，也就是使用三个form表单，分别实现起始线路与站点选择，终点线路与站点选择，提交按钮、票价显示和路程显示；HTML美化通过bootstrap和jquery实现，这里不再赘述。前端交互，线路存储，票价计算及输出等由station.js实现。2) station

3、.js结构线路数据通过一个stationData变量实现，这个变量中存储了115号线路的全部站点，并且通过stationData 进行访问。站点间距离数据通过chartData存储，这个变量中按照类似二维数组的格式存储相邻站点间距离，并且在station.js文件调用时通过dijkstra.addEdges(chartData)初始化到dijkstra算法中。函数getStartStation和getEndStation用于获取用户选择线路完毕后获取选项option的value值，根据value值向二级select元素中添加stationData线路数据。实现select选项卡的级联。函数ge

4、tSubwayData用于实现用户点击时获取表单内容(即获取select元素内text元素)，然后distance中输出根据dijkstra算法中shortest函数得到的距离数，同时输出时使用toFixed(1) 控制输出位数为1位(js中数字为浮点形式)；然后将计算的distance传入caleFare函数中计算费用并输出。函数caleFare实现票价计算：6公里以内3元、12公里以内4元、32公里以内每超出12公里10公里1元、超出32公里的部分没20公里1元，上不封顶；前两部分判断直接return，后两部分则需要调用函数math.ceil向上取整功能。3) dijkstra算法dijk

5、stra = function ()将dijkstra实例化为一个函数。函数内包括5部分：addChart将station.js中的chartData进行拆分导入：获取参数的length作为循环总数，通过charti索引二维数组并赋予变量edge，此时edge是包含两个站点和距离的一维数组。通过edgei索引edge中元素并作为参数传入函数addEdge中；addEdge则是建立图表的函数。它包括三个参数：origin,target,distance代表起始、终点、权重。通过三个参数，建立坐标为origin,target、值为distance的图表。shortest函数是最重要的算法部分：通过

6、station.js中dijkstra.shortest(origin,target)传入起点和终点，并返回最短的路径；函数首先判断传入的数据是否在chart中，如果不在，则返回一个；定义两个对象dist，vistited和一个数字numVertex，直接使用for in结构遍历图表，先认为全部的路径值都是，同时获取最大数numVertex用于下层的循环控制。在用语句distorigin = 0使得到原点的距离为0；接下来进行for循环：；循环中定义一个minDist最短路径为，再定义一个最小值v = 0；使用for in结构遍历dist ，且v不存在于已经考虑过的点中 ，判断最短路径minD

7、ist是否大于distv,如果大于则将distv中的值赋予minDist，同时将v赋予minV；如果小于则不进行操作。接下来if判断minV是否仍然为void 0，是则跳出循环。如果minV和目标target相等，则返回最短路径minDist；否则继续，令对象visitedminV存储bool值true表示已经找过；再定义一个变量edges=chartminV，新建循环，求解minDist到下一点的最短路径，如果有则记录到distv中。进行下次循环。循环结束之后的已经得到最短路径minDist；return的作用是索引函数，在station.js中通过dijkstra.shortest就可以索

8、引到函数中。Shortest函数的流程展示:4. 部分代码附录1) index.html: <!-2016.11.24 nevil-><!DOCTYPE HTML><html><head><meta charset="UTF-8"><title>Subway</title><link rel="stylesheet" type="text/css" href="./css/bootstrap.css"><scrip

9、t src="./js/jquery.min.js"></script><script src="./js/bootstrap.min.js"></script> <script charset="UTF-8" src="./js/dijkstra.js"></script> <script charset="UTF-8" src="./js/station.js"></script>&

10、lt;style>bodymargin-left: auto;margin-right: auto;margin-top: 200px;width: 25em;</style></head><body><div class="subway-out"><form class="form-inline" role="form"><div class="form-group"><span class="label label-i

11、nfo">start</span></div> <div class="form-group"> <select class="form-control" id="startLine" onChange = "getStartStation()" > <option selected disabled>起始站</option> <option value="one">1 号线</option

12、> <option value="two">2 号线</option> <option value="four">4 号线</option> <option value="five">5 号线</option> <option value="six">6 号线</option> <option value="seven">7 号线</option> <option

13、value="eight">8 号线</option> <option value="nine">9 号线</option> <option value="ten">10 号线</option> <option value="thirteen">13 号线</option> <option value="fourteen">14 号线</option> <option valu

14、e="fifteen">15 号线</option> </select> </div> <div class="form-group"><p></p></div> <div class="form-group"> <select class="form-control" id="startStation" style="width: 9.5em;"> </s

15、elect> </div> </form> <form class="form-inline" role="form" style="margin-top: 8px;"><div class="form-group"><span class="label label-warning" style="margin-left:3px;margin-right:3px;">end</span></d

16、iv> <div class="form-group"> <select class="form-control" id="endLine" onChange = "getEndStation()"> <option selected disabled>终点站</option> <option value="one">1 号线</option> <option value="two">2

17、 号线</option> <option value="four">4 号线</option> <option value="five">5 号线</option> <option value="six">6 号线</option> <option value="seven">7 号线</option> <option value="eight">8 号线</option

18、> <option value="nine">9 号线</option> <option value="ten">10 号线</option> <option value="thirteen">13 号线</option> <option value="fourteen">14 号线</option> <option value="fifteen">15 号线</option&

19、gt; </select> </div> <div class="form-group"><p></p></div> <div class="form-group"> <select class="form-control" id="endStation" style="width: 9.5em;"> </select> </div> </form> <for

20、m class="form-inline" role="form" style="margin-top: 8px;"> <div class="from-group" style="margin-top:2em;"> <button type="button" class="btn btn-default" style="width: 9em;" onclick="getSubwayData()&quo

21、t;>Submit</button> <div class="form-group" style="margin-left:0.6em;"><p>￥</p></div> <input type="text" class="form-control" id="fare" style="width: 50px;" value=0 readonly> <div class="form-gr

22、oup"><p>-</p></div> <input type="text" class="form-control" id="distance" style="width: 55px;" value=0 readonly> <div class="form-group"><p>km</p></div> </div> </form></div><

23、;/body></html>2) station.js/菜单级联function getStartStation()var startLine = document.getElementById("startLine");var startStation = document.getElementById("startStation");/获取1,2级菜单idvar add = .concat(stationDatastartLine.value);startStation.length=0;/清空二级菜单for (var i = 0;

24、 i < add.length; i+) var str = new Option();str.text = addi;startStation.add(str);/text的值添加到二级select中;function getEndStation()var endLine = document.getElementById("endLine");var endStation =document.getElementById("endStation");var add = .concat(stationDataendLine.value);endS

25、tation.length=0;for (var i = 0; i < add.length; i+) var str = new Option();str.text = addi;endStation.add(str);function getSubwayData()var startStation = document.getElementById("startStation");var endStation = document.getElementById("endStation");var fare = document.getEleme

26、ntById("fare")var distance = document.getElementById("distance");/获取当前select的元素，这里用到selectIndex属性origin = startStation.optionsstartStation.selectedIndex.text;target = endStation.optionsendStation.selectedIndex.text;/*if (origin = target) fare.value = "3"distance.value =

27、 "0" else*/distance.value = dijkstra.shortest(origin,target).toFixed(1);fare.value = caleFare(distance.value);/;/对传入的距离 计算fare 起步6公里内每人次3元，6-12公里每人次4元，12-32公里每10公里加1元，32公里以上每20公里加1元，票价不封顶function caleFare(distance)if(distance<=6) return 3;if(distance<=12) return 4;if(distance<=32)

28、 return 4+ Math.ceil(distance-12)/10);else return 6+ Math.ceil(distance-32)/20)/初始化算法function initDijkstra()dijkstra.addChart(chartData);initDijkstra();/初始化3) dijkstra.js/* * 2016.11.24 nevil */dijkstra = function () function addEdge(origin,target,distance)if(!(origin in chart) chartorigin=;if(!(tar

29、get in chart) charttarget=;chartorigintarget = distance,charttargetorigin = distancefunction addChart(chart) for (var i = 0; i < chart.length; +i) var edge = charti;addEdge(edge0,edge1,edge2);function shortest(origin,target)if (!(origin in chart)|!(target in chart) return 1 / 0;var dist = ;visite

30、d = ;numVertex = 0;for (var v in chart) distv = 1 / 0,numVertex+;distorigin = 0;for (var i = 0; i < numVertex; +i) var minDist = 1 / 0,minV = void 0;for (var v in dist) if (!(v in visited)if(minDist > distv) minDist = distv,minV = velse;if (void 0 = minV) break;if (minV = target) return minDis

31、t;visitedminV = true;var edges = chartminV;for (var v in edges) if (!(v in visited)var newDist = minDist + edgesv;if (distv > newDist) distv = newDistelse;return 1 / 0var chart = ;returnaddEdge: addEdge,addChart: addChart,shortest: shortest();4) 线路数据var stationData = "one":"苹果园&quo

32、t;,"古城","八角游乐园","八宝山","玉泉路","五棵松","万寿路","公主坟","军事博物馆","木樨地","南礼士路","复兴门","西单","天安门西","天安门东","王府井","东单","建国门","永安里","

33、;国贸","大望路","四惠","四惠东","two":"西直门","车公庄","阜成门","复兴门","长椿街","宣武门","和平门","前门","崇文门","北京站","建国门","朝阳门","东四十条","东直门",&qu

34、ot;雍和宫","安定门","鼓楼大街","积水潭","four":"安河桥北","北宫门","西苑","圆明园","北大东门","中关村","海淀黄庄","人民大学","魏公村","国家图书馆","动物园","西直门","新街口","平安

35、里","西四","灵境胡同","西单","宣武门","菜市口","陶然亭","北京南站","马家堡","角门西","公益西桥","five":"宋家庄","刘家窑","蒲黄榆","天坛东门","磁器口","崇文门","东单",&q

36、uot;灯市口","东四","张自忠路","北新桥","雍和宫","和平里北桥","和平西桥","惠新西街南口","惠新西街北口","大屯路东","北苑路北","立水桥南","立水桥","天通苑南","天通苑","天通苑北","six":"海淀五路居"

37、;,"慈寿寺","花园桥","白石桥南","车公庄西","车公庄","平安里","北海北","南锣鼓巷","东四","朝阳门","东大桥","呼家楼","金台路","十里堡","青年路","褡裢坡","黄渠","常营","草房&q

38、uot;,"物资学院","通州北关","北运河西","郝家府","东夏园","潞城","seven":"北京西站","湾子","达官营","广安门内","菜市口","虎坊桥","珠市口","桥湾","磁器口","广渠门内","广渠门外",&

39、quot;九龙山","大郊亭","百子湾","化工","南楼梓庄","欢乐谷景区","双合","焦化厂","eight":"朱辛庄","育知路","平西府","回龙观东大街","霍营","育新","西小口","永泰庄","林翠桥","森林公

40、园南门","奥林匹克公园","奥体中心","北土城","安华桥","安德里北街","鼓楼大街","什刹海","南锣鼓巷","nine":"郭公庄","丰台科技园","科怡路","丰台南路","丰台东大街","七里庄","六里桥","六里桥东",&qu

41、ot;北京西站","军事博物馆","白堆子","白石桥南","国家图书馆","ten":"巴沟","苏州街","海淀黄庄","知春里","知春路","西土城","牡丹园","健德门","北土城","安贞门","惠新西街南口","芍药居","

42、太阳宫","三元桥","亮马桥","农业展览馆","团结湖","呼家楼","金台夕照","国贸","双井","劲松","潘家园","十里河","分钟寺","成寿寺","宋家庄","石榴庄","大红门","角门东","角门西",&q

43、uot;草桥","纪家庙","首经贸","丰台站","泥洼","西局","六里桥","莲花桥","公主坟","西钓鱼台","慈寿寺","车道沟","长春桥","火器营","thirteen":"东直门","柳芳","光熙门","芍药居&qu

44、ot;,"望京西","北苑","立水桥","霍营","回龙观","龙泽","西二旗","上地","五道口","知春路","大钟寺","西直门","fourteen":"张郭庄","园博园","大瓦窑","郭庄子","大井","七里

45、庄","西局","fifteen":"俸伯","顺义","石门","南发信","后沙峪","花梨坎","国展","孙河","马泉营","崔各庄","望京","望京西","关庄","大屯路东","安立路","奥林匹克公园",&quo

46、t;北沙滩","六道口","清华东路西口"5) 站点间距离var chartData = "苹果园","古城",2.5,"古城","八角游乐园",1.9,"八角游乐园","八宝山",1.9,"八宝山","玉泉路",1.5,"玉泉路","五棵松",1.8,"五棵松","万寿路",1.8,"万寿路&qu

47、ot;,"公主坟",1.3,"公主坟","军事博物馆",1.2,"军事博物馆","木樨地",1.2,"木樨地","南礼士路",1.3,"南礼士路","复兴门",0.5,"复兴门","西单",1.6,"西单","天安门西",1.2,"天安门西","天安门东",0.9,"天安门东",

48、"王府井",0.9,"王府井","东单",0.8,"东单","建国门",1.2,"建国门","永安里",1.4,"永安里","国贸",0.8,"国贸","大望路",1.4,"大望路","四惠",1.7,"四惠","四惠东",1.7,"西直门","车公庄",0.

49、9,"车公庄","阜成门",1,"阜成门","复兴门",1.8,"复兴门","长椿街",1.2,"长椿街","宣武门",0.9,"宣武门","和平门",0.9,"和平门","前门",1.2,"前门","崇文门",1.6,"崇文门","北京站",1,"北京站",

50、"建国门",1,"建国门","朝阳门",1.8"朝阳门","东四十条",1,"东四十条","东直门",0.8,"东直门","雍和宫",2.2,"雍和宫","安定门",0.8,"安定门","鼓楼大街",1.2,"鼓楼大街","积水潭",1.8,"积水潭","西直门&quo

51、t;,1.9,"安河桥北","北宫门",1.4,"北宫门","西苑",1.2,"西苑","圆明园",1.7,"圆明园","北大东门",1.3,"北大东门","中关村",0.9,"中关村","海淀黄庄",0.9,"海淀黄庄","人民大学",1,"人民大学","魏公村",1,&quo

52、t;魏公村","国家图书馆",1.7,"国家图书馆","动物园",1.5,"动物园","西直门",1.4,"西直门","新街口",1,"新街口","平安里",1.1,"平安里","西四",1.1,"西四","灵境胡同",0.9,"灵境胡同","西单",1,"西单",&q

53、uot;宣武门",0.8,"宣武门","菜市口",1.1,"菜市口","陶然亭",1.2,"陶然亭","北京南站",1.6,"北京南站","马家堡",1.5,"马家堡","角门西",0.8,"角门西","公益西桥",1,"宋家庄","刘家窑",1.6,"刘家窑","蒲黄榆&quo

54、t;,0.9,"蒲黄榆","天坛东门",1.9,"天坛东门","磁器口",1.2,"磁器口","崇文门",0.9,"崇文门","东单",0.8,"东单","灯市口",0.9,"灯市口","东四",0.8,"东四","张自忠路",1,"张自忠路","北新桥",0.8,"北

55、新桥","雍和宫",0.9,"雍和宫","和平里北桥",1.2,"和平里北桥","和平西桥",1,"和平西桥","惠新西街南口",1,"惠新西街南口","惠新西街北口",1.1,"惠新西街北口","大屯路东",3,"大屯路东","北苑路北",1.3,"北苑路北","立水桥南",1.3,&q

56、uot;立水桥南","立水桥",1.3,"立水桥","天通苑南",1.5,"天通苑南","天通苑",1,"天通苑","天通苑北",0.9,"海淀五路居","慈寿寺",1.5,"慈寿寺","花园桥",1.4,"花园桥","白石桥南",1.1,"白石桥南","车公庄西",1.7,"车

57、公庄西","车公庄",0.9,"车公庄","平安里",1.4,"平安里","北海北",1.3,"北海北","南锣鼓巷",1.3,"东四","朝阳门",1.4,"朝阳门","东大桥",1.7,"东大桥","呼家楼",0.8,"呼家楼","金台路",1.5,"金台路",&q

58、uot;十里堡",2,"十里堡","青年路",1.3,"青年路","褡裢坡",4,"褡裢坡","黄渠",1.2,"黄渠","常营",1.9,"常营","草房",1.4,"草房","物资学院",2.1,"物资学院","通州北关",2.5,"通州北关","北运河西",3,&

59、quot;北运河西","郝家府",0.9,"郝家府","东夏园",1.3,"东夏园","潞城",1.2,"北京西站","湾子",0,9,"湾子","达官营",0.7,"达官营","广安门内",1.9,"广安门内","菜市口",1.4,"菜市口","虎坊桥",0.9,"虎坊桥&qu

60、ot;,"珠市口",1.2,"珠市口","桥湾",0.9,"桥湾","磁器口",1,"磁器口","广渠门内",1.1,"广渠门内","广渠门外",1.3,"广渠门外","九龙山",2.6,"九龙山","大郊亭",0.8,"大郊亭","百子湾",0.9,"百子湾","化工

61、",0.9,"化工","南楼梓庄",1.5,"南楼梓庄","欢乐谷景区",1.7,"欢乐谷景区","双合",3,"双合","焦化厂",1,"朱辛庄","育知路",2.3,"育知路","平西府",2,"平西府","回龙观东大街",2,"回龙观东大街","霍营",1.1,&

62、quot;霍营","育新",1.9,"育新","西小口",1.5,"西小口","永泰庄",1,"永泰庄","林翠桥",2.6,"林翠桥","森林公园南门",2.6,"森林公园南门","奥林匹克公园",1,"奥林匹克公园","奥体中心",1.7,"奥体中心","北土城",0.9,"

63、北土城","安华桥",1,"安华桥","安德里北街",1.2,"安德里北街","鼓楼大街",1,"鼓楼大街","什刹海",1.2,"什刹海","南锣鼓巷",0.9,"郭公庄","丰台科技园",1.3,"丰台科技园","科怡路",0.8,"科怡路","丰台南路",1.6,"丰台南路

64、","丰台东大街",1.6,"丰台东大街","七里庄",1.3,"七里庄","六里桥",1.8,"六里桥","六里桥东",1.3,"六里桥东","北京西站",1.2,"北京西站","军事博物馆",1.4,"军事博物馆","白堆子",1.9,"白堆子","白石桥南",0.9,"白石

65、桥南","国家图书馆",1.1,"巴沟","苏州街",1.1,"苏州街","海淀黄庄",1,"海淀黄庄","知春里",1,"知春里","知春路",1.1,"知春路","西土城",1.1,"西土城","牡丹园",1.3,"牡丹园","健德门",1,"健德门","

66、北土城",1,"北土城","安贞门",1,"安贞门","惠新西街南口",1,"惠新西街南口","芍药居",1.7,"芍药居","太阳宫",1,"太阳宫","三元桥",1.8,"三元桥","亮马桥",1.5,"亮马桥","农业展览馆",0.9,"农业展览馆","团结湖",

67、0.9,"团结湖","呼家楼",1.2,"呼家楼","金台夕照",0.7,"金台夕照","国贸",0.8,"国贸","双井",1.8,"双井","劲松",1,"劲松","潘家园",1,"潘家园","十里河",1,"十里河","分钟寺",1.8,"分钟寺","成寿寺",1,"成寿寺","宋家庄",1.7,"宋家庄","石榴庄",1,3,"石榴庄","大红门",1.1,"大红门","角门东

人人文库> 全部分类> 教育资料 > 辅导培训

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论