Наиболее широко поддерживаемая (IE + Opera) библиотека JavaScript / холст для JavaScript - PullRequest
0 голосов
/ 10 декабря 2010

Я хочу создать сайт-портфолио и хотел сделать несколько креативных рисунков на сайте, не используя изображения.

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

Затем я рассмотрел Raphaël, что на данный момент кажется наиболее жизнеспособным вариантом.

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

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

Ответы [ 4 ]

2 голосов
/ 10 декабря 2010

Хотите нарисовать векторную графику на самом сайте или просто опубликовать готовую векторную графику?

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

  • Если последнее, то, вероятно, есть много вариантов, вот пара из головы:

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

      image

1 голос
/ 11 декабря 2010

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

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

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

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

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

1 голос
/ 10 декабря 2010

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

Версия на 0,57 в момент ввода этого.

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

0 голосов
/ 17 января 2011

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

...