Ignite RSS Feeds Главная Программы на заказ Портфолио Контакты Геокодирование – еще один способ получения координат июня 13

Alex Рубрика: web

Нет ответов
В прошлой статье, я рассказывал, как можно получить координаты для карт того или иного объекта вручную геокодирование Геокодирование – это чрезвычайно сложный процесс преобразования адреса в координаты широты и долготы. К счастью, множество сервисов в интернете облегчили нам с вами эту задачу. Я не буду рассказывать про все из них, не буду рассказывать, как они работают, просто продемонстрирую, как можно решить поставленную задачу с использованием Google Geocoding Web Service. Для того, чтобы воспользоваться веб сервисом, нужно послать запрос на сервер Google следующего вида: C# http : //maps.google.com/maps/api/geocode/[type]?address=[address]&sensor=false

C# http : //maps.google.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&sensor=false вам приходит ответ следующего вида (json): C# "results" : [ { "geometry" : { "lng" : -122.08506470 }, ], } 1 6 7 8 12 13 {    "results" : [        {          "address_components" : [ . . . ] ,          "formatted_address" : "1600 Амфитеатр-Паркуэй, Маунтин-Вью, Калифорния 94043, Соединённые Штаты Америки" ,          "geometry" : {              "location" : {                "lat" : 37.42285760 ,                "lng" : - 122.08506470              } ,                       } ,                 }    ] , }

,

Получение координат для карт

Alex web Нет ответов

использовании замечательной библиотеки leaflet карты бесплатных Wi-Fi источников .

X и Y – это значения широты и долготы. Существует несколько способов их получения. Сегодня я расскажу о самом прямолинейном и простом из них – ручном поиске. Он идеально подходит, если вы заранее знаете какие объекты вы хотите выделить и их количество не слишком велико. Для реализации этого метода нам потребуется ВикиМапия -  http://wikimapia.org/

JavaScript L . marker ( [ 37.6200783 , - 89.5172882 ] ) . addTo ( map ) ;

,

leaflet – создание карт для web

июня 12

Автор: Alex Рубрика: web Нет ответов

У меня уже запущен один проект, который базируется исключительно на этой библиотеке – это интерактивная карта бесплатных точек Wi-Fi в городе Донецке . Подключаем библиотеку

XHTML <!--[if lte IE 8]> <![endif]--> 1 2 3 5 <link rel = "stylesheet" href = "http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" /> <!--[if lte IE 8]>      <link rel="stylesheet" href="http://alexbard.org.ua/cdn.leafletjs.com/leaflet-0.5/leaflet.ie.css" /> <![endif]--> <script src = "http://cdn.leafletjs.com/leaflet-0.5/leaflet.js" > </script> XHTML <div style = "height=150px;" id = "map" > </div>

Создаем карту с координатами карты x, y и приближением z:

JavaScript var map = L . map ( 'map' ) . setView ( [ x , y ] , z ) ; JavaScript L . tileLayer ( 'http://{s}.tile.osm.org/{z}/{x}/{y}.png' , {      attribution: '&copy; <a href="http://alexbard.org.ua/osm.org/copyright">OpenStreetMap</a> contributors' } ) . addTo ( map ) ;

JavaScript L . marker ( [ x , y ] ) . addTo ( map )      . bindPopup ( 'A pretty CSS3 popup. <br> Easily customizable.' )      . openPopup ( ) ;

,
Встраивать html5 видео все еще слишком сложно

июня 9

Alex Рубрика: web Нет ответов

Как встроить видео на сайт?

Короткий ответ – воспользуйтесь Youtube или Vimeo. Там работают чрезвычайно умные люди, которые уже решили совершенно все проблемы, которые могут возникнуть при встраивании видео на сайт.

Как это сделать без помощи сторонних сервисов?

  1. Устаревшие браузеры (IE)

В оставшейся части этого поста я уделю внимание тому, как можно осуществить поддержку всех этих устройств и браузеров у себя на сайте. Самый простой случай. Видео-проигрыватель в одну строчку:

XHTML <video src = "video.mp4" width = height = 360 >

Поддержка устаревших браузеров

Для поддержки устаревших браузеров (в первую очередь под этой фразой следует понимать IE7+) будем использовать javasript-библиотеку html5media.js, которая будет создавать flash видеоплеер для случая устаревшего браузера: XHTML <script src="http://api.html5media.info/1.1.5/html5media.min.js"></script> <body> </body> 2 3 5 6      <head>          <script src = "http://api.html5media.info/1.1.5/html5media.min.js" > </script>      </head>      <body>          <video src = "video.mp4" = height = 360 > </video>      </body> , чтобы устаревшие браузеры не расстраивались от увиденного.
На данный момент наш проигрыватель поддерживает следующие браузеры:

  • Chrome
  • IE9+
  • Поддержка браузеров с open source кодеками

    XHTML <script src="http://api.html5media.info/1.1.5/html5media.min.js"></script> <body> </video> </body> 3 8      <head>          <script src = "http://api.html5media.info/1.1.5/html5media.min.js" > </script>      </head>      <body>          <video src = "video.mp4" width = = >              <source src = "video.mp4" > </source>              <source src = "video.webm" > </source>          </video>      </body>