Разработка интерактивной карты корпусов НИУ БелГУ

Дворянин Д.М.

Разработка интерактивной карты корпусов НИУ БелГУ

09.03.02 Информационные системы и технологии

Информатика

Дипломы

Вуз: Белгородский государственный университет - национальный исследовательский университет (НИУ «БелГУ»)

ID: 5c1a556d7966e104f6f85366

UUID: 34671fe0-e5c8-0136-fdae-525400005860

Язык: Русский

Опубликовано: больше 5 лет назад

Просмотры: 235

Дворянин Д.М.

Источник: Федеральное государственное автономное образовательное учреждение высшего образования «Белгородский государственный национальный исследовательский университет»

Комментировать 0

Рецензировать 0

Скачать - 2,3 МБ

Поделиться работой

ФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ АВТОНОМНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ВЫСШЕГО ОБРАЗОВАНИЯ «БЕЛГОРОДСКИЙ ГОСУДАРСТВЕННЫЙ НАЦИОНАЛЬНЫЙ ИССЛЕДОВАТЕЛЬСКИЙ УНИВЕРСИТЕТ» (НИУ «БелГУ») ИНСТИТУТ ИНЖЕНЕРНЫХ ТЕХНОЛОГИЙ И ЕСТЕСТВЕННЫХ НАУК КАФЕДРА ИНФОРМАЦИОННЫХ И РОБОТОТЕХНИЧЕСКИХ СИСТЕМ РАЗРАБОТКА ИНТНРАКТИВНОЙ КАРТЫ КОРПУСОВ НИУ БЕЛГУ Выпускная квалификационная работа студента обучающегося по направлению подготовки 09.03.02 Информационные системы и технологии очной формы обучения, группы 07001409 Дворянина Дмитрий Михайлович Научный руководитель ст. пр. Удовенко И.В. БЕЛГОРОД 2018

« ». – , . , ( « »), 45, 19, 63, 30. : , , - , , , , , . : « ». : . : « ». : , , « », « », , . : « ».

.................................................................................................................. 3 1 ................................................................................................ 6 1.1 .................................................................. 6 1.2 ..................................................... 7 1.3 1.4 « - »« ».. 10 « - » « » ................................................................................................... 13 2 ........................................................................ 16 2.2 ...... 18 2.3 ............. 20 2.4 .................................................... 24 2.5 API ................................................................................................ 25 3 ......................................................................... 27 3.1 .................................................................. 27 3.2 ............................................................. 28 3.3 ................................................................................................. 31 3.3 ................................................................... 35 ............................................... 44 ..................................................................................................... 47 3

. , , . , , . [1]. . , , . , , . - , , , . . . , 4

, . , « ». : , , , , . « ». . : « » « »; : ; - , « »; , . 44 , 19 ,1 5 , . 61

1 1.1 . , . , , . 20 21 . , . . , . , . . , , , [2]. . , . , , 6 – ,

, , , . , . 1.2 , , . , , . , , ( , , ) [3]. . . Google, Yandex, 2GIS, Bing . . . 7

: ; - ; , 1.1. 1.1 – : ; . , API [3]. . API. [2], . 8

, Google Maps. , . , , « , ». , , , . , . , , , [4]. . , , , . , . . . , [5]. . 2Gis. , . . [6]. 9

, , API online . . 1.3 « - » « » - . . , IDEF0[]. , , . 1.2 - 1.2 – « 10 »

( 1.2) . , . , . , . - , , . . « » 1.3. 1.3 – « 11 »

, . : , , , . , - , , 1.4, . 1.4 – 12

, . . , . « ». , , . . . , . . . 1.4 « - »« » , , , , , 1.4. « »« » 1.5. 13

1.5 – « » . ( 1.5) . . , 1.6. 14

1.6 – , , . . « ». . « 15 ».

2 2.1 ( , ) [8]. : , - , ; , ; , - ; . , . 2018 , 4000 70 [9]. « « » ». « » . 20 « » ANSYS Matlab. . . , , . . 16

, . . . « » « ». : – 20 Intel Sandy Bridge 2.4 - 32 - ( 2); ; – Tesla M2090 - – QDR QSFP - 10 / . – 24 - . . . « , 2.1. 1.1 – Microsoft Windows 10 Pro x64 Samsung SODIM DDR3 8 Intel(R) Core(TM) i3-3110M CPU @2.40GHz NVIDIA Geforce 710M 17 »

1.1 HDD, 500 DVD-RW Genius Qualcomm Atheros . , , . , . 2.2 , , , , , , . , , [10]. 18 2.1

2.1 – : ; - . , , . - , , . . : ; - ; ; . - , 19

, , . . , . , . [11]. 2.3 – , , , . , . : (Freeware) – , , [12]; (OpenSource) , . 20 –

[13]; (Proprietary) – , . [14]; . [15]. . , MacOS, ios , Windows, Linux, android. , - Opera; - Google Chrome; - Firefox; - Safari; - Internet Explorer 8+; - Microsoft Edge; - Yandex- : . – , , - . « - ». , - , , (HTML) (XML). 21

- , (HTTP), - . , HTTP (HTTPS). , Flash-player Adobe. Flash Player – , . Flash Player Shockwave Flash Format (SWF). . Adobe Flash JQuery, JavaScript, HTML CSS . JavaScript JSON. JavaScript – . JavaScript . , , . - JavaScript . jQuery - JavaScript, , , HTML. Ajax jQuery , HTMLWeb. HTML – , - . HTML, , , 22

. - - HTML- , . HTML , HTML . JavaScript (JS) . , - Ruby, PHP ASP.NET. , , HTML , . AJAX. HTML , , , . – (CSS). (CSS) - ( ), . CSS : (HTML) - (XHTML) (XML) - (SVG) - XML (XUL) CSS . HTML CSS HTML. , js, html, css, json – Visual Studio Code. 23 ,

. , Git, . . 2.4 , - OpenServer 5.2.2. : ; - PHP5 GD, MySQL, sqLite; - MySQL5 - Apache 2; - Nginx 1; - MariaDB 5; - MongoDB 2.4; - FTP FileZilla; - PHPMyAdmin 4. ; , . : Windows (32- 64- ): Windows 7 SP1 ; Windows (32XP SP3 64- ): Windows Windows Vista; : 500 HDD; 24 RAM 3

Microsoft Visual C++ 2005-2008-2010-2012-2013-2015 Redistributable Package; Windows; , . , /home, . ; ; 2.5 API . API . , GeoObject. , , geoObjects. , . ymaps.Placemark(), , addOverlay() . myMap.geoObjects.remove(baloon) [17]. API . , A. route, ё . , , , , 25

router.Route, . . (router.Path), . getPaths. ё . , . ё . HTTPS- . : : , , , , ё - , , , , , , , . , . . , . ( - : , ). API , , API, . , , . 26

3 , , . 3.1 . – , , . , . , , . – , , . . , , . . . . , [16]. , , . 27

, . . , , . . . . – . , . . . , , . , , , . 3.2 , . , 1.1, . , 3.1. 28

3.1 – « » , 3.1 « » . . , , . . , . , , , , , [17]. , 29

, , . . , , . API . , « ». , . 3.2. 3.2 – « 30 »

, 3.2, . , . , . , . , [18]. 3.3 . , . . favicon . , , . , , , Sans, . Google fonts. , 31 ,

, [19]. 3.3 3.3 – . 3.3 , . , , . . API. , . , , , [20]. 32

, . , DOM (Document Object Model) [21]. , DOM 3.4. 3.4 – DOM- 3.5. 3.5 – DOM33

3.5, <html>, . <html> <head>, . <body> (element-node), , (text-node). , HTML . HTML , [22]. . 3.6. 3.6 – . 3.6 . DOM html , . , 34

3.3 - – , - W3C [23]. [24]. , , , , polygon. . API 3.7. 3.7 – geometry – . , , “type”. , . . Point Point 3.8. 35

3.8 – Point Point , . balloonContent. . iconContent – Point. ( ) . Clusterer. : , . . add. , . 36

. 3.9. 3.9 – , . 3.9, . ListBoxLayout . . , . , , [25]. , 3.10. 37

3.10 – ListBox layout control.routePanel.geolocate('from') [26]. 3.11 3.11 – 38

3.11, . , wi-fi. OneKlick. . 3.12. 3.12 – , JavaScript – JSON. AJAX [27]. – flexbox. 39

CSS Flexible Box Layout Module . Flexbox , , . flexbox: “ - ”, “flex”. , ; , ; html - . CSS. responsive ; / , ; rtl - ltr (left-to-right). Flexbox (right-to-left), . . . , . rtl ; CSS [30]. , . 3.13. 40

3.13 – . 3.13 , , . . , . CSS flexbox , , . . . , . . 41

, , , . « ». : ; ; ; . , . . . , . , 3 , . , , , . 42 ,

. « ». . « ». , , . . , . . 43

1. [ ] / – petsu.ru. : http://dssp.petrsu.ru/p/tutorial/informatics/chapter1/4/44.htm . ., 2. ( )[ . ]/ . . . // .– : http://econf. rae. ru/article/8256. 3. Online Tech Dictionary for Students, Educators and IT Professionals [ .– ]: : https://www.webopedia.com/TERM/A/API.html Svennerberg G. Beginning Google Maps API 3. / G. Svennerberg – 4. Apress, 2010. 5. ]. / yandex.ru. – [ 2GIS [ 6. – 2004. ]. /info.2gis.ru. – 2GIS – 1999. 7. IDEF0 [ ]: – . : https://nsu.ru/smk/files/idef.pdf [ 8. ] : https://www.bsu.edu.ru/bsu/info/today/ [ 9. – : http://edulib.pgta.ru/20 , 10. . . .– . . HTML .pdf CSS. - . CSS. .– 2007 267 [ 12. Web– . ] / lifewire.com. – : https://www.lifewire.com/freeware-definition-4154271 13. , / ., 2013. - 480 . 11. / . ] / edulib.pgta.ru. pensource.com [ ] / opensource.com. – : https://opensource.com/resources/what-open-source 44

14. The IT program for leaders [ . .– ]/ . // . – . : https://www.techopedia.com/definition/4333/proprietary-software 15. The IT program for leaders [ . .– ]/ . // . – . : https://www.techopedia.com/definition/4245/commercial-software. . ., UX/UI 16. / . . . . PHP, MySQL, HTML 5 17. Web18. – 2017. – . 158-160. ./ . .– CSS 3. , 2016. - SEO 2.0 Mankov A.O. /A.O. Mankov. – . . . – 2017. – . 3. – №. 4. – . 351-356. . . 19. / . . : .– 2015. – №. 5. . 20. // . . . – 2017. – №. 11. – . 22-26. . . 21. / . . . web- .– . – 2015. – №. 1- 1. . . 22. Web- / . . .– . – 2015. – . 18. – №. 2. . . 23. Web- HTML, .(+ JavaScript, ) 4- ./ . . PHP MySQL. .– - , 2015. . . 24. . . –International Journal of Open / . . Information Technologies. – 2017. – . 5. – №. 5. 45

25. Anderson E.L..Internet use and Problematic Internet Use: A systematic review of longitudinal research trends in adolescence and emergent adulthood /E.L. Anderson. –International Journal of Adolescence and Youth. – 2017. – . 22. – №. 4. – . 430-454. 26. API [ ]: .– : https://tech.yandex.ru/maps/doc/jsapi/2.1-dev/ref/reference/control.ListBox-docpage/ 27. RoutePanel [ ]: .– : https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/reference/control.RoutePanel-docpage/. . 28. ., . . Web- ./ . . – 2016. . 29. [ ]: . – : https://tech.yandex.ru/maps/doc/jsapi/2.1/ref/reference/control.RoutePanel-docpage/. 30. The world's largest web developer site [ w3school.com. – ] / : https://www.w3schools.com/Css/css3_flexbox.asp 46

Index.html. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, maximum-scale=1" /> <link rel="stylesheet" href="reset.css"> <link rel="stylesheet" href="style.css"> <link rel="shortcut icon" href="image/favicon.png" type="image/png"> <title> </title> </head> <body> <div class="wrapper"> <div class="header"> <div class="logo"> <a href="#!"> <img src="image/logo_name.jpg" alt=""> </a> </div>  </div>  <div id="map"></div>  <div class="footer"></div>  </div> <script src="https://api-maps.yandex.ru/2.1/?lang=ru-RU" type="text/javascript"></script> <script src="https://yandex.st/jquery/2.2.3/jquery.min.js" type="text/javascript"></script> <script src="object_manager_balloon.js" type="text/javascript"></script>  </body> </html> 47

object_manager_balloon.js ymaps.ready(init) function init () { var listBoxItems = [] var myMap = new ymaps.Map('map', { center: [50.59424709568916, 36.577003783652714], zoom: 13, controls: ['searchControl', 'routeButtonControl', 'zoomControl'] }, { searchControlProvider: 'yandex#search' }) var control = myMap.controls.get('routeButtonControl') // control.routePanel.geolocate('from') // . menu = $('<ul class="menu"/>') . myMap.behaviors.disable([ 'scrollZoom' ]) objectPointManager = new ymaps.ObjectManager({ clusterize: true, clusterDisableClickZoom: true, showInAlphabeticalOrder: true }) objectPolyManager = new ymaps.ObjectManager({ }) myMap.geoObjects.add(objectPointManager) myMap.geoObjects.add(objectPolyManager) $.getJSON('data.json').done(function (data) { objectPointManager.add(data.point) myMap.geoObjects.add(objectPointManager) objectPolyManager.add(data.poly) myMap.geoObjects.add(objectPolyManager) for (i in data.point.features) { if (data.point.features[i].properties && data.point.features[i].geometry.type == 'Point') { listBoxItems.push( new ymaps.control.ListBoxItem({ data: { content: data.point.features[i].properties.balloonContent, 48

center: data.point.features[i].geometry.coordinates, zoom: 18 } })) } } ListBoxLayout = ymaps.templateLayoutFactory.createClass( "<button id='my-listbox-header' class='btn' data-toggle='dropdown'>" + "{{data.title}} <span class='caret'></span>" + '</button>' + // . // , , // . "<ul id='my-listbox'" + " class='dropdown-menu' role='menu' aria-labelledby='dropdownMenu'" + " style='display: {% if state.expanded %}block{% else %}none{% endif %};'></ul>", { build: function () { // build // . ListBoxLayout.superclass.build.call(this) this.childContainerElement = $('#my-listbox').get(0) // , // . this.events.fire('childcontainerchange', { newChildContainerElement: this.childContainerElement, oldChildContainerElement: null }) }, // , // . getChildContainerElement: function () { return this.childContainerElement }, clear: function () { // // . // , // domthis.events.fire('childcontainerchange', { newChildContainerElement: null, oldChildContainerElement: this.childContainerElement }) this.childContainerElement = null // clear // . ListBoxLayout.superclass.clear.call(this) 49 ie.

} }), // . ListBoxItemLayout = ymaps.templateLayoutFactory.createClass( '<li><a>{{data.content}}</a></li>' ), // 2 // , listBox = new ymaps.control.ListBox({ items: listBoxItems, data: { title: ' ' }, options: { // layout: ListBoxLayout, // // // 'item' . itemLayout: ListBoxItemLayout } }) listBox.events.add('click', function (e) { // , // // var item = e.get('target') // if (item != listBox) { myMap.setCenter( item.data.get('center'), item.data.get('zoom') ) } }) 2 . , . . . . myMap.controls.add(listBox) }) } data.json { "point": { "type": "FeatureCollection", 50

"features": [ { "type": "Feature", "id": 0, "geometry": { "type": "Point", "coordinates": [50.621523, 36.578564] }, "properties": { "balloonContent": " №1", "iconContent": "1", "clusterCaption": " №1", "hintContent": " №1", "balloonContentBody": "<img class='image' src='image/korp_1.jpg' /> <hr> <div class='mark'> :</div><ul><li> ;</li><li> <p><div class='mark'> :</div> ;</p> <div class='mark'> </div> <hr> <div class='mark'> :</div>(4722) 30-18-80, 30-18-90, 30-18-79 <hr> <div class='mark'> :</div> – 9.00 18.00 <br> 13.00 14.00 ", "balloonContentHeader": " №1" } }, { "type": "Feature", "id": 1, "geometry": { "type": "Point", "coordinates": [50.621442, 36.577685] }, "properties": { "balloonContent": " ", "iconContent": " ", "clusterCaption": " ", "hintContent": " " } }, { "type": "Feature", "id": 2, "geometry": { "type": "Point", "coordinates": [50.621743, 36.577154] }, "properties": { "balloonContent": " №3", "iconContent": "3", "clusterCaption": " №3", "hintContent": " №3" } }, { "type": "Feature", "id": 3, "geometry": { "type": "Point", "coordinates": [50.622769, 36.576818] }, "properties": { "balloonContent": " №4", "iconContent": "4", "clusterCaption": " №4", 51 ;</li></ul> -

"balloonContentBody": "<img class='image' src='image/korp_4.jpg' /> <hr> <div class='mark'> :</div><ul><li> ;</li><li> <div class='mark'> :</div>(4722) 30-18-51<hr>", "hintContent": " №4" } }, { "type": "Feature", "id": 4, "geometry": { "type": "Point", "coordinates": [50.622885, 36.577542] }, "properties": { "balloonContent": " №5", "iconContent": "5", "clusterCaption": " №5", "hintContent": " №5" } }, { "type": "Feature", "id": 5, "geometry": { "type": "Point", "coordinates": [50.593511, 36.576539] }, "properties": { "balloonContent": " №10", "iconContent": "10", "clusterCaption": " №10", "hintContent": " №10" } }, { "type": "Feature", "id": 6, "geometry": { "type": "Point", "coordinates": [50.594515, 36.576719] }, "properties": { "balloonContent": " №11", "iconContent": "11", "clusterCaption": " №11", "hintContent": " №11" } }, { "type": "Feature", "id": 7, "geometry": { "type": "Point", "coordinates": [50.594093, 36.577247] }, "properties": { "balloonContent": " №12", "iconContent": "12", "clusterCaption": " №12", "balloonContentBody": "<img class='image' src='image/korp_12.jpg' /> <hr> <div class='mark'> :</div><ul><li> 52 </li></ul><hr>

</li></ul><div class='mark'> </div><hr> <div class='mark'> :</div>(4722) 24-54-01, 24-54-00<hr>", "hintContent": " №12" } }, { "type": "Feature", "id": 8, "geometry": { "type": "Point", "coordinates": [50.594112, 36.575986] }, "properties": { "balloonContent": " №13", "iconContent": "13", "clusterCaption": " №13", "hintContent": " №13" } }, { "type": "Feature", "id": 9, "geometry": { "type": "Point", "coordinates": [50.593757, 36.575176] }, "properties": { "balloonContent": " №14", "iconContent": "14", "clusterCaption": " №14", "hintContent": " №14" } }, { "type": "Feature", "id": 10, "geometry": { "type": "Point", "coordinates": [50.593343, 36.575841] }, "properties": { "balloonContent": " №15", "iconContent": "15", "clusterCaption": " №15", "hintContent": " №15" } }, { "type": "Feature", "id": 11, "geometry": { "type": "Point", "coordinates": [50.594556, 36.575675] }, "properties": { "balloonContent": " №17", "iconContent": "17", "clusterCaption": " №17", "balloonContentBody": "<img class='image' src='image/korp_17.jpg' /> <hr> <div class='mark'> :</div><ul><li> ;</li><li> ;</li></ul><div class='mark'> :</div><ul><li> </li></ul><hr> <div class='mark'> :</div>(4722) 24-54-01, 24-54-00<hr>", 53

"hintContent": " №17" } } ] }, "poly": { "type": "FeatureCollection", "features": [ { "type": "Feature", "id": 12, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.622009273633964, 36.578889376590396], [50.62209117595371, 36.578889376590396], [50.622116770398094, 36.57913345761075], [50.622079231874885, 36.57914150423779], [50.62210141373315, 36.5793212122418], [50.62181917140516, 36.57939555744998], [50.62181405248484, 36.57937141756884], [50.621750919088115, 36.57936873535982], [50.621737268612755, 36.579231942700076], [50.62170996765009, 36.5792373071181], [50.621725324447155, 36.57938214640492], [50.62158391942547, 36.57942704060463], [50.6215071351756, 36.57942704060463], [50.621450826645564, 36.57891205647376], [50.62140089209172, 36.57891088517659], [50.62136505931725, 36.57860243113987], [50.62142136795053, 36.57858633788579], [50.621379736048375, 36.57822944516085], [50.62191381201173, 36.578071194828944], [50.621987182993024, 36.57806851261993], [50.6220144837939, 36.57829650038618], [50.621669810013564, 36.5784064709558], [50.62162544587714, 36.57840378874678], [50.62169369837728, 36.57898046368498], [50.622009273633964, 36.578889376590396] ] ] } }, { "type": "Feature", "id": 13, "options": { "fillColor": "#00FF0088" }, 54

"properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.621590466453775, 36.578166413249], [50.62137888291218, 36.57823346847438], [50.62126626547557, 36.57724373334788], [50.62140106510259, 36.577203500212654], [50.6214744368882, 36.57720886463068], [50.621590466453775, 36.578166413249] ] ] } }, { "type": "Feature", "id": 14, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.62139988525295, 36.57720315099515], [50.62139135364229, 36.57713341356079], [50.621725791615155, 36.57703417182722], [50.62177015566717, 36.57703953624522], [50.621770155656385, 36.57702612520018], [50.6222103811842, 36.576900061376435], [50.62228716427964, 36.576900061376435], [50.62230593346156, 36.57709854484354], [50.62182305120698, 36.57724070192134], [50.62182987643264, 36.5772889816836], [50.62149885184086, 36.57739358783517], [50.62147666969684, 36.57721119762217], [50.62139988525295, 36.57720315099515] ] ] } }, { "type": "Feature", "id": 15, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ 55

[50.62256968898317, 36.57676326871643], [50.62255603874678, 36.576637204892734], [50.622890468392015, 36.57653796315919], [50.62301843828696, 36.576540645368205], [50.62307815745143, 36.57707976938019], [50.62290070599649, 36.57712804914245], [50.622774442051295, 36.57712804914245], [50.62276761696347, 36.57707440496216], [50.62264305893563, 36.57711195588837], [50.62256968898317, 36.57676326871643] ] ] } }, { "type": "Feature", "id": 16, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.62279406419483, 36.57713073135144], [50.62279918300789, 36.577157553441594], [50.62276847012106, 36.57716560006864], [50.6228640212583, 36.57795685172801], [50.6229169155539, 36.57795685172801], [50.62309095442691, 36.577905889756735], [50.62299540375327, 36.57711732030637], [50.622962984730364, 36.577125366933416], [50.622959572200344, 36.57710390926128], [50.62279406419483, 36.57713073135144] ] ] } }, { "type": "Feature", "id": 17, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.593622499469575, 36.57627451478483], [50.59405957519912, 36.57643544732577], [50.594029270277474, 36.5766567295695], [50.593992136050254, 36.57665002404693], 56

[50.59398786774143, 36.57666611730106], [50.593904208898046, 36.57667148171908], [50.59369768352715, 36.576595361851055], [50.59358164616434, 36.576556792909344], [50.593622499469575, 36.57627451478483] ] ] } }, { "type": "Feature", "id": 18, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.594362162299255, 36.576278861940146], [50.59441679612729, 36.57627617973113], [50.594502161359635, 36.57631373065734], [50.5945106978703, 36.576297637403265], [50.59458581912909, 36.57629495519425], [50.59465581837541, 36.57633518832947], [50.59465069649389, 36.57637005704662], [50.594688257015015, 36.57637810367371], [50.59458752642904, 36.57705402034544], [50.594409966902276, 36.57697891849302], [50.59425118713976, 36.576973554074996], [50.59436216229925, 36.576278861940146] ] ] } }, { "type": "Feature", "id": 19, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.59424709568916, 36.577003783652714], [50.59425221762766, 36.57697427935352], [50.59441099738669, 36.57698232598056], [50.594597093400765, 36.57706011004207], [50.594585995959655, 36.57712045974488], [50.59461886147053, 36.57712917692417], [50.594608831090156, 36.57717376864903], 57

[50.594586742917556, 36.5771719246303], [50.59457911340598, 36.57721660017425], [50.59456676215448, 36.57720943364705], [50.59452026485774, 36.577491945693474], [50.594450692249175, 36.57748088158126], [50.594379412218785, 36.57745908863297], [50.594314107663024, 36.577437295684724], [50.59425221764421, 36.5774181849455], [50.59423450426809, 36.57745188019628], [50.594198330565426, 36.57749018549378], [50.59414501699283, 36.57749780254829], [50.59409853261638, 36.577494690766734], [50.5940713355711, 36.577465909406705], [50.59403895652731, 36.577408603382466], [50.594038047228636, 36.577332656648515], [50.593966738745564, 36.577314890587246], [50.59394472199681, 36.57725589664452], [50.593784411759174, 36.57719153828377], [50.593810021697344, 36.57705474562402], [50.59375197250981, 36.577019876906746], [50.59377928977131, 36.57684285111182], [50.59388471724716, 36.57684955663437], [50.593973071261935, 36.57689113087411], [50.594074229999585, 36.57693002290482], [50.59419246166858, 36.576976961562586], [50.59424709568916, 36.577003783652714] ] ] } }, { "type": "Feature", "id": 20, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.59409820097001, 36.57543034116526], [50.59433722484462, 36.57553226510784], [50.59419893260879, 36.57649249593515], [50.59418185946494, 36.576487131517126], [50.59415624974112, 36.57666683952114], [50.59409222536668, 36.57666818062563], [50.594094359520454, 36.57665007571471], [50.594031615541454, 36.57662928859492], [50.59405978631042, 36.576433487336836], [50.59395820070534, 36.576398618619635], [50.59409820097001, 36.57543034116526] 58

] ] } }, { "type": "Feature", "id": 21, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.59376706481484, 36.57531232396876], [50.59380462605589, 36.575044103067285], [50.59423828547478, 36.575194306772126], [50.5942297489108, 36.57525063316143], [50.59435779720703, 36.57529623071468], [50.59433560219411, 36.575526900689965], [50.59409657831121, 36.5754276589564], [50.59393267551482, 36.57536596814907], [50.59376706481484, 36.57531232396876] ] ] } }, { "type": "Feature", "id": 22, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.5938043302427, 36.57504338084728], [50.5935426814204, 36.57495620905429], [50.593458594940294, 36.574952185740806], [50.59345091190669, 36.574991077771486], [50.59342274076042, 36.574976325621954], [50.59332542215099, 36.57498169003993], [50.593310056027775, 36.57511043607269], [50.59323322537642, 36.575107753863676], [50.59309151516722, 36.57612967549834], [50.59316663870673, 36.57616186200647], [50.593141028423986, 36.57633352338347], [50.59329298257354, 36.57638850866825], [50.593284445839984, 36.57645422278912], [50.59357981601417, 36.57655614673159], [50.5938043302427, 36.57504338084728] 59

] ] } }, { "type": "Feature", "id": 23, "options": { "fillColor": "#00FF0088" }, "properties": {}, "geometry": { "type": "Polygon", "coordinates": [ [ [50.59452792799162, 36.57607435735981], [50.5945149098023, 36.57606949436216], [50.59454340040404, 36.57586039309992], [50.59449959742862, 36.57586026728774], [50.594445257140045, 36.575836566388354], [50.59440826996661, 36.57577087896759], [50.594401727517194, 36.575708530958025], [50.594406992825384, 36.57561566614591], [50.59445913733842, 36.57562019571115], [50.59446301462063, 36.57558222735852], [50.59433372197016, 36.57552816575183], [50.594342258515184, 36.57548525040759], [50.5943610389124, 36.575276038104406], [50.59443786771306, 36.57527872031342], [50.59475201084574, 36.57538869088304], [50.59480664421887, 36.57545574610842], [50.59482371713489, 36.5755442590059], [50.594825424426155, 36.57561131423128], [50.59476054731451, 36.57608874743594], [50.594734937903574, 36.57611288731706], [50.5946888409286, 36.576115569526074], [50.59465469499194, 36.576332828456295], [50.594586403043934, 36.576297959739094], [50.59450786718059, 36.576297959739094], [50.59451981829871, 36.57622017567766], [50.5945044525822, 36.57621481125956], [50.5945279279916, 36.57607435735981] ] ] } } ] } } 60

Style.css @import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700&subset=cyrillic,cyrill ic-ext'); .wrapper { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; } .wrapper > * { padding: 0; flex: 1 100%; } .header { } .logo img{ padding: 15px; padding-left: 36px; width: 380px; height: 80px; } .btn text{ display: inline-block; position: relative; border: none; text-decoration: none; white-space: nowrap; font-size: 13px; line-height: 26px; padding: 0 12px; } .btn{ box-shadow: 0 1px 2px 1px rgba(0,0,0,.15), 0 2px 5px -3px rgba(0,0,0,.15); border-color: transparent; background-color: #ffdb4d; 61

box-sizing: border-box!important; border-width: 1px; border-style: solid; border-radius: 3px; background-clip: border-box; color: #000; vertical-align: middle; text-decoration: none; font-family: Arial,Helvetica,sans-serif; cursor: pointer; -webkit-transition: background-color .15s ease-out,border-color .15s easeout,opacity .15s ease-out; transition: background-color .15s ease-out,border-color .15s ease-out,opacity .15s ease-out; display: inline-block; text-align: left; height: 28px; } #my-listbox{ width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.5); cursor: pointer; } #map { padding: 0; margin: 0; width: 100%; height: 100vh; } .image { display: flex; align-items: center; width: 400px; } .container{ display: flex; flex-direction: column; align-content: center } .description{ } .mark{ font-weight: bold; 62

} a:link { font-size: 16px; font-weight: bold; text-decoration: none; color: #3F4BA2; font-family: 'PT Sans', Tahoma, Verdana, Helvetica, Arial, sans-serif; } .ballon_header { font-size: 16px; margin-top: 0; margin-bottom: 10px; color: #708090; } .ballon_body { font-size: 14px; text-align: left; } .ballon_footer { font-size: 12px; text-align: right; border-top: 1px solid #7D7D7D; color: #7D7D7D; margin-top: 10px; } .footer { background: lightgreen; } @media all and (min-width: 800px) { .header { order: 1; } #map{ order: 2; } .footer { order: 3; } } @media all and (max-width: 625px) { .logo img{ padding: 15px; 63

padding-left: 15px; width: 190px; height: 40px; } #map { width: 100%; height: 500px; } .menu{ padding-top: 0; padding-left: 15px; margin: 0; margin-right: 0; } .btn{ margin-top: 10px } } @media all and (max-width: 400px) { .btn{ margin-top: 0; } } 64

1. 110700026.09.03.02.229. 46 . 2. 110700026.09.03.02.229. 15 ( ) ( 3. - . . . . . . .*5 1 CD 110700026.09.03.02.229. . . . . . 4) 15 . « » . « » ._07001409___ . . . . 65 .

. . «___» ________________ _____ . ____________________ ( д ись) _________________ (Ф.И.О.) 66

Рецензии:

Авторизуйтесь, чтобы добавить рецензию

- у работы пока нет рецензий -

Отзывы:

Авторизуйтесь, чтобы оставить отзыв