OpenStreetBugs — лёгкий способ сообщить об ошибке в OpenStreetMap

OpenStreetBugs — лёгкий способ сообщить об ошибке в OpenStreetMap

Вы, конечно, знаете о свободной карте OpenStreetMap. Это настоящая народная карта, создаваемая такими же людьми как и вы! Это такой же opensource-проект как Linux и как Википедия. Конечно же, как и в других картах, в OpenStreetMap имеются ошибки, но в отличие от тех же Яндекс.Карт, где ошибки не исправляются годами из-за сложной бюрократической процедуры (я уже не говорю о намеренных ошибках), в OpenStreetMap всё гораздо проще и лучше для всех нас...
Подробнее..

CloudMade Navigation поддерживает ограничения манёвров

CloudMade Navigation поддерживает ограничения манёвров

Не так давно CloudMade выделил несколько приоритетных направлений, среди которых оказалась и навигация. Решено было создать специальный проект Navi Studio, который объединял бы в себе несколько более мелких сервисов и позволял пользоваться ими, для создания полноценного навигационного программного обеспечения. В Navi Studio вошли: Работа закипела и уже появилось несколько приложений использующих данный проект. Но полноценной навигации без соблюдения правил ПДД не существует, а потому данному вопросу было также уделено не мало времени...
Подробнее..

Удали себя из интернет-социума — «Web 2.0 Suicide Machine»

Удали себя из интернет-социума — «Web 2.0 Suicide Machine»

Недавно наткнулся в сети на один занимательный интернет-сервис, именующийся Web 2.0 Suicide machine . Предназначен он для того, чтобы позволить людям, обремененным «социальной жизнью в интернете», в пару кликов удалить свои аккаунты на Facebook (в данный момент сервис блокирован администрацией по IP), Twitter, Linkedin и Myspace. В общем-то судя по количеству положительных отзывов и «успешных очищений» — пипл хавает зависимые от социальных сетей успешно пользуются сервисом и довольны...
Подробнее..




Визуализация данных на CSS

Веб разработка - CSS

визуализация данных на css

Визуализация данных графиков, диаграмм в основном решается с помощью флэш и некоторых языков программирования. Являются ли эти способы единственными? Давайте попробуем реализовать эту задачу с помощью CSS.

Предисловие
В этом примере я не буду использовать ни JavaScript, ни любые другие языки. Все, что мне нужно это хорошая разметка и код CSS.
Таким образом, наша цель состоит в том, чтобы представить данные таблицы в виде диаграммы. Можно отметить, что данные диаграммы – это объект из 2х элементов, непосредственно зависимых друг от друга. Поэтому, лучшим решением в отношении структуры и семантики будет использование списков определений.
Почему? Ну, для начала, это список элементов. Несмотря на то, что список является линейным, мы можем обозначить заголовки определений (элементы dt) как пункты по оси X и описание определений (элементы dd) как значения по оси Y.

А делать мы будем следующее:
представим

вот в таком виде

лишь с помощью CSS кода

Реализация
Для примера я использовал период последних 12 дней и мое представление работоспособности за день (что-то типа КПД рабочего дня) в процентах. Как вы заметили, на 6й день процент был самый высокий, потому что я получил зарплату, что и мотивировало меня :-)

Заголовки определений в данном случае будут сами дни по порядку от 1 до 12

<dt>Day 1</dt>


А описанием определений будут значения моего КПД в %

<dd>36</dd>


Внутри элемента dd я добавлю также элементы span и em. Не в целях изменения структуры, а для того чтобы было достаточно элементов для работы со стилями. Также присвою класс элементу, который в дальнейшим мы оформим.
Таким образом, описание определения будет выглядеть так:

<dd><span class= type2 p80 ><em>80</em></span></dd>

 


Читайте:


Добавить комментарий


Защитный код
Обновить

News image

3D API для Flash Player

Adobe Systems, не смотря на регулярную критику своей технологии Flash, продолжает модернизировать и развивать продукты на ее основе. Компания не ост...

News image

Google внедрила защиту от копирования в приложениях для Android

Компания Google предложила разработчикам добавить в свои программы модуль License Verification Library (LVL), чтобы защитить платные приложения для ...

News image

Microsoft, инновации и откровенный флейм

Учитывая то количество флейма которое летит в направлении Microsoft/.Net разработчиков, тот пост что я пишу сейчас надо было написать уже давно, даб...

News image

Разработка Web-приложений с помощью Oracle JavaServer Pages

Используйте технологии OracleJSP и сервлетов для легкой разработки и внедрения гибких WEB-приложений. В связи с увеличением числа продавцов и пот...

News image

API тем iGoogle (Лаборатория Google)

С чего начать? Загрузите шаблон XML и подпишитесь на тестовую среду. Прочтите Руководство разработчика тем. В случае необходимости, обращай...

Топ технологий:

News image

Оздана новая система беспроводной связи - она в 10

Ученые из Национального тайваньского университета разработали новую систему беспроводной передачи данных, которая позволит передавать инф...

News image

Как взломали Twitter

В Интернетах, наряду с iPad, сканерами в аэропортах и войне между Google и Apple, уже второй день подряд активно обсуждается тема взлома и...