Category Archive 'Веб-разработка':

September 7, 2009

Графики и диаграммы на веб-страницах. Часть 4

Эта статья завершит собой рассказ о методиках внедрения в html-страницы графиков, диаграмм, а также рассказ о javascript библиотеках, умеющих “рисовать” красивые и интерактивные изображения таких структур данных как графы и деревья. В прошлой статье я начал рассказ об одной из самых лучших библиотек подобного плана – jit. Read more...

August 31, 2009

Графики и диаграммы на веб-страницах. Часть 3

Согласно своему определению диаграмма (от греч. diagramma — изображение, рисунок, чертеж) - это графическое изображение, наглядно показывающее соотношение каких-либо величин. Прошлые две статьи серии были посвящены классическим видам диаграмм, т.е. линейным и столбчатым. Сегодня же я начну знакомство с парой javascript библиотек, служащих не для показа соотношения каких-либо величин, а для отображения их структуры, связей и взаимодействия. Read more...

August 20, 2009

Графики и диаграммы на веб-страницах. Часть 2

Я продолжаю начатый в прошлой статье рассказ о том, как с помощью javascript, без использования “тяжелых” серверных скриптов на php, или flash-роликов создавать и внедрять в html-странички картинки диаграмм и графиков Сегодня я завершу повествование об основных функциях библиотеки flot и посвящу материал всевозможным “красивостям”, т.е. тому как можно управлять внешним видом серий данных на диаграмме, настраивать внешний вид легенды диаграммы и ее фона. Read more...

August 10, 2009

Графики и диаграммы на веб-страницах. Часть 1

Нет лучшего и более наглядного способа отображения больших таблиц с числовыми данными, чем отображение их в виде диаграмм или графиков. Применительно к отображению диаграмм на веб-страницах у разработчиков есть и богатство подходов и конкретных инструментов, позволяющих внедрять на html-страницы не только красивые, но и обладающие некоторой долей интерактивности диаграммы. Осенью 2007 года я уже поднимал вопрос о том, как мы можем внедрять в html-страницы диаграммы. Тогда серия из двух статей была посвящена методике, когда диаграммы строились на стороне сервера, т.е. некий php-скрипт генерировал статическую картинку диаграммы и отдавал ее браузеру клиента. В ряде случаев, когда нас не устраивала статическая картинка, то использовался подход с flash-роликом внедренным в страницу, который сначала загружал с сервера поток данных в виде xml или json массива, а затем рисовал диаграмму. Сегодняшняя статья рассмотрит третий подход, когда графики строятся без использования “тяжелой артиллерии” - с помощью javascript. Read more...

June 22, 2009

PersistJS и TaffyDB. Как поселить почти настоящую базу данных в браузер. Часть 3

Эта статья завершит собой серию материалов, рассказывающих о том, как можно внутри обычного браузера “поселить” базу данных. “Браузерная” СУБД должна содержать две функции: сохранение данных и операции над ними (поиск, редактирование). В прошлых двух статьях я рассказывал о том, как библиотека persistjs позволяет организовать унифицированное хранение информации не зависимо от версии используемого браузера. Сегодня мы поговорим о том, что мы можем делать с сохраненной информацией. Read more...

June 9, 2009

PersistJS и TaffyDB. Как поселить почти настоящую базу данных в браузер. Часть 2

Ключевой частью любого приложения, и веб-приложение не исключение, является хранение данных. Помимо того, что данные нужно сохранять между перезапусками браузера или компьютера клиента, не менее важным является наличие средств быстрого и удобного поиска информации. И эти средства есть. Есть, средства предусмотренные стандартом html5, пусть и не поддерживаемые пока всеми браузерами. Есть средства, созданные как несовместимые расширения, доступные только в определенных версиях браузеров. В крайнем случае, есть возможность организовать хранение данных с помощью flash. И для того, чтобы рядовой веб-разработчик не занимался складыванием паззла из десятка возможных альтернатив технологий хранения данных и поддерживающих их браузеров, появились javascript-библиотеки, предлагающие унифицированный интерфейс взаимодействия с доступными в браузере технологиями хранения данных. Read more...

June 1, 2009

PersistJS и TaffyDB. Как поселить почти настоящую базу данных в браузер. Часть 1

Хм, база данных в браузере, да еще и “почти настоящая”, как это и, самое главное, кому это нужно? Не было бы ничего более простого, чем начать эту статью со стандартных фраз, вроде следующей: “За последние годы все более и более выраженной становится тенденция наделения веб-приложений, чертами своих старших “настольных” собратьев”. И под этим “соусом” обосновать необходимость для веб-приложения хранить данные не только на веб-сервере, но и на локальном компьютере пользователя. Затем можно быстро перейти к “немножко попрограммировать”, завершив статью рассказом о паре замечательных javascript-библиотек, вынесенных в заголовок (PersistJS и TaffyDB). Увы, все не так просто и вопрос стоит не столько “о той самой базе данных”, но и интересных направлениях в разработке ПО. Read more...

March 2, 2009

Сложные интерфейсы на javascript вместе Yahoo UI. Часть 20

Эта статья завершит рассказ о компоненте TreeView. С его помощью мы можем отображать на веб-странице иерархическую информацию в форме дерева. Если для простеньких сайтов мы вполне можем обойтись загрузкой информации из статического источника данных, т.е. данные встроены в саму веб-страницу. То для серьезных приложений, работающих с большими объемами информации, такая методика не подойдет: данные должны загружаться динамически, по мере необходимости – и это тема сегодняшней статьи. Read more...

February 28, 2009

Сложные интерфейсы на javascript вместе Yahoo UI. Часть 19

Эта статья начнет рассказ о последнем из больших и сложных компонентов YUI – TreeView. Разрабатывая с помощью YUI “богатые” пользовательские интерфейсов для веб-приложений мы нуждаемся не только в средствах удобного отображения табличной информации (DataTable), но еще и информации иерархической (например, структура организации или категории товаров). Тема сегодняшней статьи – компонент TreeView – как раз и предназначен для того, чтобы показывать информацию в форме дерева. Read more...

February 16, 2009

Сложные интерфейсы на javascript вместе Yahoo UI. Часть 18

Эта статья завершит рассказ об одном из самых “больших” и полезных компонентов в библиотеке Yahoo UI - компоненте DataTable. DataTable служит для отображения на веб-страницах информации в форме таблиц. В последних двух статьях я рассказал почти обо всех возможностях DataTable. Остались не раскрытыми только те функции DataTable, которые связаны с редактированием содержимого таблицы.

В прошлой статье я рассказывал, как можно настроить правила выделения строк в таблице. Как разрешить выделять одну строку, или целый их диапазон, как реализовать динамическую подсветку строки, над которой в этот момент времени находится курсор. Все это было подготовительными шагами для того, чтобы превратить DataTable из средства только отображения табличных данных в инструмент, позволяющий редактировать данные в таблице и даже отправлять информацию назад на сервер (сохранять ее в БД). Read more...