Потребовалось однажды нарисовать карту Украины. Да не абы какую, а со свистелками и перделками: с выводом некоторой статистики и подсветкой областей. Да чтобы не нужно было при изменении параметров каждый раз перерисовывать картинку.
Такие фокусы отлично умеет делать формат svg, значит рисуем (или берем готовую) карту Украины в svg. Разбираем по областям, кладём полигоны каждой области в массив, не забывая однако, что область может описываться не одним полигоном, а несколькими.
Готовим json файл с описанием характеристик каждой области и выводимой информации - в нашем случае это кружочек с циферками. А потом рисуем карту svg, пользуясь массивом полигонов для отрисовки карты и json массивом для отображения красок и деталей. В процессе читаем туториалы на русском и английском и поражаемся - как всё, оказывается, легко и просто!
Вуаля, карта готова, а если статистические данные постоянно обновляются, то можно делать ajax-запросы к json данным с заданным интервалом и обновлять данные без перезагрузки страницы - например, вот так.
В последних версиях Firefox, Google Chrome и Safari формат svg уже отображается именно так, как и хотелось, так что если понравилось - качаем исходники, пользуемся, поминаем в вечерних молитвах.
Ах да, весела пiсенька:
Ни для кого не секрет, мои маленькие радиослушатели, что в 2012 году произойдет всемирный бадабум, трансформаторы расплавятся, предохранители выгорят и ни в одном дефолт-сити не найдется столько гастарбайтеров чтобы это всё починить. А дежурные админы на это положат болт, ибо это аппаратная проблема, а значит с наступлением темноты все роутеры превратятся в тыквы, исчезнет роуминг и халява на Скайпе, растворятся в пространстве китайские боты в онлайн-RPG и отчеты в пенсионный фонд снова придется писать на папирусе. А относить взносы - овсом и борзыми щенками. Интернета не будет - настанет Судный день!
Больно слышать эдакое, но при поддержке хрен знает какого провайдера я уже сейчас готовлю неравноценную замену - итак, что мне заменит Интернет:
Эстафету никому не передаю, при желании - см. п.5.
Исключительно полезный горшочек сервис, позволяющий рисовать схемы онлайн - Glinkr.net. Используя его можно нарисовать... да какую угодно схему можно нарисовать, вот! А если серьезно, то пример ниже нарисован за пару минут:
Сервис позволяет рисовать текстовые блоки, снабдить их заголовками, описаниями, добавить к каждому список ссылок (дорвейщикам и спамерам - попуститься, ссылки непрямые). Также можно указать связи между блоками и раскрасить их в какой-нибудь веселенький цвет.
Навигация интуитивно понятная (это означает, что ничего лишнего, а что в интерфейсе есть - снабжено пиктограммками), фактически можно пользоваться даже если бы сайт был на китайском. Полученную карточку можно вставить на веб-страницу или отослать ссылку на результат на самом сервере, есть возможность совместной работы над схемами, при создании схемы (важно!) сразу указывается - под какой лицензией публикуется матриал.
Регистрация занимает минуту, на обучение уходит 2-3 минуты, с русским языком дружит (в списке также интерлингва, волапюк и точики), позволяет делать экспорт в .xml и обратно - импорт из него же, денег не просит говорит «мама» и писает чистым апельсиновым соком и вполне серьезно претендует на звание самого простого и удобного сервиса года!
Способ отображения всплывающих pop-up окон с подсказками, картинками, активным содержимым уже давно стал называться одним словом - lightbox. Я уже много раз писал о красивых всплывающих окнах, с аяксом и без, с использованием популярных фреймворков и самописных, совсем уже было собрался делать мега-обзор (в закладках уже полтора десятка скриптов накопилось), но добрые люди сделали всю работу за меня!
The Lightbox Clones Matrix - мощный пополняемый каталог скриптов, позволяющий выбрать практический любой эффект для pop-up окна - отображение подсказки, картинки, группы картинок, проигрывать видео, аудио и flash-ролики, с использованием jquery, prototype и других библиотек, практически на все вкусы и случаи жизни. Используем и не забываем послать луч умеренного оптимизма разработчикам (хотя лучше все же помочь материально, если есть возможность).
Помогли найти время и желание: Чешские светильники из хрусталя
Никак по другому я не смог коротко, внятно и SEO-friendly перевести "image zooming plugin". Плагин для jQuery, да, очень просто и красиво. Картинку запостить не могу, так что смотрим у автора.
Плагин может