Pintura formas em Javascript

https://stackoverflow.com/questions/949249

09-09-2019
|

Pergunta

Existe alguma boa alternativa para o html5-elemento de tela para pintar formas como hexágonos usando javascript, que funciona cross-browser (incluindo o horrível IE6)?

Eu tenho usado jQuery e jQuery maphighlight para isso, mas não me dá possibilidades suficientes para manipular as formas e cores depois que é primeira prestados.

Am I não faltando algumas características em jQuery maphighlight, ou são qualquer outro plugin para jQuery quer ou mootools, que pode fornecer-me com este capacidades pintura?

Solução

Você deve dar uma olhada em RaphaelJS. É um JavaScript, cross-browser biblioteca invólucro em torno Canvas, SVG e VML (um IE-only linguagem de marcação vector que antecede SVG, usados ??no IE6). Usando RaphaelJS, você pode gerar uma grande variedade de gráficos vetoriais usando JS que é compatível com uma ampla gama de navegadores.

http://raphaeljs.com/

RaphaelJS também é muito compatível com jQuery, e segue um monte do mesmo call-encadeamento que você vê no jQuery. Os dois fazem um grande par.

Outras dicas

Há também o famoso pintor tela.

http://caimansys.com/painter/

Tente Raphael .

Raphaël atualmente suporta Firefox 3.0+, Safari 3.0+, Opera 9.5+, Chrome 2.0+ e Internet Explorer 6.0+.

Eu gosto sempre a porta Prossessing para javascript. Você pode achar que aqui é muito bom para desenhar coisas. Talvez você pode verificá-lo. Não é um addon para jquery, mas é muito poderoso.

Ele faz usar o elemento HTML5 Canvas embora: (

Algumas versões atrás só funcionou nos novos navegadores. Eu não sei se ele já foi portado para os anteriores.

Uma outra API que eu achei que usa divs para fazer desenha é este um Se você quiser desenhar coisas limitado, é ok para usá-lo. Mas tome cuidado, pois quando a quantidade de empates aumento, o scture do HTML fica um pouco pesado

Você pode usar a implementação SVG encontrada no Amplo SDK que funciona em Internet Explorer também. Você vai ter API padrão baseado em DOM (Nível 2/3) e uma notação de marcação (SVG1.2 minúsculo).

Aqui está um par de exemplos:

Licenciado em: CC-BY-SA com atribuição

Não afiliado a StackOverflow