2010-12-10 2 views
0

Я ищу сайт для портфолио, и я хотел сделать какой-то креативный рисунок на веб-сайте без использования изображений.Наиболее широко поддерживаемая (IE + Opera) библиотека JavaScript/рисования JavaScript

Я считал, что холст, который, я думаю, был бы крутым, плюс интересный проект, однако, я слышал, что у IE нет совместимости (это правда?), Поэтому я не могу этого сделать.

Тогда я считал Рафаэля, который, похоже, является наиболее жизнеспособным вариантом до сих пор.

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

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

ответ

1

Ну, вы можете скачать Inkscape и нарисовать то, что вы хотите использовать в кросс-браузере. Затем перейдите на мой сайт (Страница с помощью инструмента и инструкций ниже) и используйте там SVGTOHTML-конвертер. Я добавляю больше с каждым выпуском. SVG собрана в Рафаэль, и есть несколько вариантов того, какой формат вы можете иметь.

Версия находится на отметке 0.57 в точке ввода.

http://www.irunmywebsite.com/raphael/svgsource.php

2

вы хотите нарисовать векторную графику на самом сайте, или просто опубликовать Premade векторную графику делать?

  • Если первое, то взгляните на svg-edit, который может быть легко встроен в ваш сайт, и который работает в большинстве браузеров (старые версии IE требуется плагин Chrome Frame, но IE9 будет поддерживать SVG-редактирования 2.6).

  • Если последнее, то есть, вероятно, много вариантов, вот пару с верхней частью моей головы:

    • Использования SVGWeb - быстро начать с того, что с помощью шаблонов из svgboilerplate.com
    • Подавать SVG для браузеров, которые поддерживают его, и статические изображения для всех остальных

      < объект данных = "your.svg" Тип = "изображение/SVG + XML"> < IMG SRC = "staticyoursvg.png"> </объект ЭСТ>

+0

Спасибо за ссылки! Я один, который рисует векторную графику на самой странице, поэтому я могу легко модифицировать и анимировать графику. Я предполагаю, что Raphaël - это тот, который рисует их по просьбе клиента, поскольку он включает встроенный метод анимации á la jQuery. – Qcom 2010-12-10 14:40:59

1

Это не правда, что IE не поддерживает холст. IE9 будет поддерживать его, что является той же версией, которая будет поддерживать SVG.

Для разработки SVG это зависит от того, что вы хотите сделать. Для статических изображений вы можете даже использовать Illustrator или Inkscape, затем сохранять/экспортировать как SVG. Если вы это сделаете, не забудьте использовать Scour [0], поскольку автоматически сгенерированная разметка может быть немного крутой. Обычно я просто пишу SVG вручную, если я не делаю что-то сложное, и в этом случае лучше использовать редактор изображений.

Нет никаких хороших редакторов, чтобы добавлять анимации, поэтому я всегда добавляю их вручную.Такие вещи, как SMIL (используется для анимации SVG), не так уж трудно узнать, но немного многословны. Если вы используете SMIL, рекомендуется использовать FakeSMIL, который включен в SVGBoilerplate, с которым связан Erik, поскольку некоторые браузеры не поддерживают SMIL.

Если вы хотите использовать библиотеку JS для генерации SVG, а не для записи вручную или с помощью редактора, то Raphaël, вероятно, самый зрелый. Существует также Dojo GFX [1]. Что лучше всего зависит от личных предпочтений и того, что вы пытаетесь сделать. Было бы лучше попробовать их с чем-то простым и посмотреть, что вы предпочитаете.

[0] http://www.codedread.com/scour/ [1] http://docs.dojocampus.org/dojox/gfx

0

Посмотрите в SVG Web, он использует Flash, чтобы эмулировать SVG в не поддерживающих браузерах. Это написано лидерами отрасли, такими как Брэд Нойберг, и это не мешает тому, как вы хотите писать разметку SVG, поэтому, когда браузеры, не поддерживающие SVG, исчезнут, вы можете отбросить его, и ваша разметка SVG все равно будет работать. С Raphaël вам нужно написать код JavaScript вместо разметки SVG, поэтому вам нужно постоянно использовать его или перекодировать свою графику. Кроме того, Raphaël поддерживает только самый низкий общий знаменатель между SVG и VML, поэтому вы не можете многое сделать. Он даже эмулирует некоторые ошибки VML в SVG, так что обе графики выглядят одинаково. Raphaël лучше для динамически генерируемого SVG, но для других случаев я бы рекомендовал SVG Web.

Смежные вопросы