Графика в WEB: различия между версиями

Материал из Вики проекта PascalABC.NET
Перейти к навигацииПерейти к поиску
Нет описания правки
 
(не показано 35 промежуточных версий 4 участников)
Строка 1: Строка 1:
== HTML-элемент Canvas ==
Новый HTML-элемент canvas позволяет программировать графику в браузере http://wiki.linuxformat.ru/index.php/LXF94:Графическое_web-приложение
Новый HTML-элемент canvas позволяет программировать графику в браузере http://wiki.linuxformat.ru/index.php/LXF94:Графическое_web-приложение


Что такое Canvas http://www.linkexchanger.su/2009/86.html и как заставить его работать в IE
Здесь есть сравнение производительности canvas и SVG
http://webo.in/articles/all/2009/23-using-canvas/
Про тег html canvas - 2 http://black-zorro.com/mediawiki/%D0%9F%D1%80%D0%BE_%D1%82%D0%B5%D0%B3_html_canvas_-_2


Графические JavaScript библиотеки
Здесь есть функция, очищающая canvas http://fastcoder.org/articles/?aid=181


1. http://billmill.org/static/canvastutorial/color.html
== Графические JavaScript библиотеки ==
Поддерживается относительно поздними версиями браузеров Firefox, Safari или Opera, не поддерживается браузером Internet Explorer.
1. '''jsDraw2D''' : 2D Graphics Library for JavaScript (~66Кб)  [http://jsdraw2d.jsfiction.com/]. Популярная кросс-браузерная библиотека 2D графики. Имеются все основные графические примитивы, такие как drawRectangle, drawCircle, drawEllipse и т.п. ''Поддерживает все современные веб-браузеры. Выполнение может отличаться в различных браузерах. Тестирована в  IE 7, Mozilla Firefox 3, Google Chrome, Opera 9.64 и Safari 4 под Windows XP.''


2. http://jsxgraph.uni-bayreuth.de/wp/examples/ или http://www.linux.org.ru/view-message.jsp?msgid=3434006
2. JSXGraph — кросс-браузерная Javascript-библиотека для интерактивной геометрии, построения графиков функций и визуализации данных.[http://jsxgraph.uni-bayreuth.de/wp/examples/] или [http://www.linux.org.ru/view-message.jsp?msgid=3434006] Использует SVG и VML. Поддерживаются все основные на рынке браузеры: Internet Explorer, Mozilla Firefox (и все на Gecko), Opera, Safari (и все на основе Webkit), хотя с Internet Explorer все еще отмечаются некоторые проблемы. JSXGraph, как заверяет автор, легко внедрять, а ее отпечаток мал: 50 килобайт (автор, правда, скромно умолчал о том, что библиотека зависит от Prototype). Никакие дополнительные плагины не нужны.  
JSXGraph — кросс-браузерная Javascript-библиотека для интерактивной геометрии, построения графиков функций и визуализации данных. Использует SVG и VML. Поддерживаются все основные на рынке браузеры: Internet Explorer, Mozilla Firefox (и все на Gecko), Opera, Safari (и все на основе Webkit), хотя с Internet Explorer все еще отмечаются некоторые проблемы. JSXGraph, как заверяет автор, легко внедрять, а ее отпечаток мал: 50 килобайт (автор, правда, скромно умолчал о том, что библиотека зависит от Prototype). Никакие дополнительные плагины не нужны.  
'''Документация находится по адресу''' http://jsxgraph.uni-bayreuth.de/wiki/index.php/Documentation
'''Документация находится по адресу''' http://jsxgraph.uni-bayreuth.de/wiki/index.php/Documentation


3. jsDraw2D : 2D Graphics Library for JavaScript http://jsdraw2d.jsfiction.com/
3. http://billmill.org/static/canvastutorial/color.html
Поддерживается относительно поздними версиями браузеров Firefox, Safari или Opera, не поддерживается браузером Internet Explorer.
 
4. wz_jsgraphics.js  [http://74.125.77.132/translate_c?hl=ru&langpair=en|ru&u=http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm&prev=/translate_s%3Fhl%3Dru%26q%3DJavaScript%2B%25D0%25B3%25D1%2580%25D0%25B0%25D1%2584%25D0%25B8%25D1%2587%25D0%25B5%25D1%2581%25D0%25BA%25D0%25B0%25D1%258F%2B%25D0%25B1%25D0%25B8%25D0%25B1%25D0%25BB%25D0%25B8%25D0%25BE%25D1%2582%25D0%25B5%25D0%25BA%25D0%25B0%26tq%3DJavaScript%2Bgraphics%2Blibrary%26sl%3Dru%26tl%3Den&rurl=translate.google.ru&usg=ALkJrhhYLNA8Laui6vTnlLpjsc-6W86CJw] ''Ну очень простая библиотека.''


4. http://74.125.77.132/translate_c?hl=ru&langpair=en|ru&u=http://www.walterzorn.com/jsgraphics/jsgraphics_e.htm&prev=/translate_s%3Fhl%3Dru%26q%3DJavaScript%2B%25D0%25B3%25D1%2580%25D0%25B0%25D1%2584%25D0%25B8%25D1%2587%25D0%25B5%25D1%2581%25D0%25BA%25D0%25B0%25D1%258F%2B%25D0%25B1%25D0%25B8%25D0%25B1%25D0%25BB%25D0%25B8%25D0%25BE%25D1%2582%25D0%25B5%25D0%25BA%25D0%25B0%26tq%3DJavaScript%2Bgraphics%2Blibrary%26sl%3Dru%26tl%3Den&rurl=translate.google.ru&usg=ALkJrhhYLNA8Laui6vTnlLpjsc-6W86CJw
5. http://craic.com/ortho/ortho_introduction.html


6. Пиксельная графика. [http://74.125.77.132/translate_c?hl=ru&langpair=en|ru&u=http://www.andreas-rozek.de/JavaScript/Libraries/PixelGraphics/Demonstrator.html&prev=/translate_s%3Fhl%3Dru%26q%3DJavaScript%2B%25D0%25B3%25D1%2580%25D0%25B0%25D1%2584%25D0%25B8%25D1%2587%25D0%25B5%25D1%2581%25D0%25BA%25D0%25B0%25D1%258F%2B%25D0%25B1%25D0%25B8%25D0%25B1%25D0%25BB%25D0%25B8%25D0%25BE%25D1%2582%25D0%25B5%25D0%25BA%25D0%25B0%26tq%3DJavaScript%2Bgraphics%2Blibrary%26sl%3Dru%26tl%3Den%26start%3D20&rurl=translate.google.ru&usg=ALkJrhj3anCcevL5xUmlbHHAfP1ciRlqRw]. В Firefox 3.0.12 странно отображается canvas (через строчку).


7. Processing.js Красиво, но работает не во всех браузерах. [http://74.125.77.132/translate_c?hl=ru&langpair=en|ru&u=http://dev.jquery.com/~john/processing.js/&prev=/translate_s%3Fhl%3Dru%26q%3DJavaScript%2B%25D0%25B3%25D1%2580%25D0%25B0%25D1%2584%25D0%25B8%25D1%2587%25D0%25B5%25D1%2581%25D0%25BA%25D0%25B0%25D1%258F%2B%25D0%25B1%25D0%25B8%25D0%25B1%25D0%25BB%25D0%25B8%25D0%25BE%25D1%2582%25D0%25B5%25D0%25BA%25D0%25B0%26tq%3DJavaScript%2Bgraphics%2Blibrary%26sl%3Dru%26tl%3Den%26start%3D20&rurl=translate.google.ru&usg=ALkJrhgI-kKdjsMMRCEzaHxsYgsnNXNknw]


[ Еще... Справочник по JavaScript http://javascript.ru/manual ]
==Другие ссылки==
* [http://javascript.ru/manual Справочник по JavaScript]
* [http://black-zorro.com/mediawiki/Index_Page Здесь много чего хорошего]

Текущая версия от 23:54, 13 ноября 2009

HTML-элемент Canvas

Новый HTML-элемент canvas позволяет программировать графику в браузере http://wiki.linuxformat.ru/index.php/LXF94:Графическое_web-приложение

Что такое Canvas http://www.linkexchanger.su/2009/86.html и как заставить его работать в IE

Здесь есть сравнение производительности canvas и SVG http://webo.in/articles/all/2009/23-using-canvas/

Про тег html canvas - 2 http://black-zorro.com/mediawiki/%D0%9F%D1%80%D0%BE_%D1%82%D0%B5%D0%B3_html_canvas_-_2

Здесь есть функция, очищающая canvas http://fastcoder.org/articles/?aid=181

Графические JavaScript библиотеки

1. jsDraw2D : 2D Graphics Library for JavaScript (~66Кб) [1]. Популярная кросс-браузерная библиотека 2D графики. Имеются все основные графические примитивы, такие как drawRectangle, drawCircle, drawEllipse и т.п. Поддерживает все современные веб-браузеры. Выполнение может отличаться в различных браузерах. Тестирована в IE 7, Mozilla Firefox 3, Google Chrome, Opera 9.64 и Safari 4 под Windows XP.

2. JSXGraph — кросс-браузерная Javascript-библиотека для интерактивной геометрии, построения графиков функций и визуализации данных.[2] или [3] Использует SVG и VML. Поддерживаются все основные на рынке браузеры: Internet Explorer, Mozilla Firefox (и все на Gecko), Opera, Safari (и все на основе Webkit), хотя с Internet Explorer все еще отмечаются некоторые проблемы. JSXGraph, как заверяет автор, легко внедрять, а ее отпечаток мал: 50 килобайт (автор, правда, скромно умолчал о том, что библиотека зависит от Prototype). Никакие дополнительные плагины не нужны. Документация находится по адресу http://jsxgraph.uni-bayreuth.de/wiki/index.php/Documentation

3. http://billmill.org/static/canvastutorial/color.html Поддерживается относительно поздними версиями браузеров Firefox, Safari или Opera, не поддерживается браузером Internet Explorer.

4. wz_jsgraphics.js [4] Ну очень простая библиотека.

5. http://craic.com/ortho/ortho_introduction.html

6. Пиксельная графика. [5]. В Firefox 3.0.12 странно отображается canvas (через строчку).

7. Processing.js Красиво, но работает не во всех браузерах. [6]

Другие ссылки