2012-01-26 14 views
33

HTML5 kullanarak yeni bir projeye başlıyorum. En popüler grafik araçlarından ikisi KineticJS ve RaphaelJS'dur. Bunları kullanma deneyiminiz varsa, herhangi bir tavsiyeniz var mı? Hangi özellikleri sunuyorlar ve diğerinin üzerinde bir avantaj var mı?Kineticjs vs Raphaeljs

E.g. Sadece RaphaelJS eski tarayıcılarda çalışır (ancak bu, gereksinim duymadığım bir özellik değildir).

+0

Ne tür bir proje yaptığınız, farklı tekniklerin farklı ihtiyaçlara uygun olduğu konusunda daha spesifik olmanız gerekir. – bennedich

+1

@bennedich Sadece ikisinin olasılıkları arasındaki farkların neler olduğunu bilmem gerekiyor. –

+1

RaphaelJS'in yazarı ayrıca SnapSVG'nin de yaratıldığını unutmayın: http://snapsvg.io/ modern tarayıcılar için daha uygundur. –

cevap

52

RaphaelJS ve KineticJS arasındaki en büyük fark, RaphaelJS'nin SVG'yi kullanması ve KineticJS'nin görselleştirme için HTML5 Canvas'ı kullanmasıdır.
Gerçekten ne tür bir proje yaptığınıza bağlı. İşte

Eğer Tuval vs ile ilgili SVG'yi kontrol gereken bazı yararlı linkler:

özetlemek gerekirse:

  • Bazı etkileşimli grafikler oluşturmak istiyorsanız, RaphaelJS ile gidiyorum çünkü SVG ile bunu yapmak daha kolay (KineticJS bunu yapmak için oldukça kolay olması gereken bazı soyut API'ler sağlıyor).
  • Çok sayıda şekli/nesneyi görselleştirmek istiyorsanız KineticJS'yi genellikle çizilecek çok sayıda şekil/nesne ile daha iyi bir şekilde kanvas ölçekleri olarak kullanmanızı öneriyorum ve KineticJS işleme performansını iyileştirmek için birden fazla katman kullanıyor.
+3

Aslında SVG'nin grafikler için tuvallerden daha iyi çalışmasına katılmıyorum. Bu demoya bir göz atın: http://meteorcharts.com/ Canvas, binlerce veri noktasının üstesinden gelebilir ve hatta mobil cihazlarda bile duyarlı kalır. SVG sadece bunu yapamaz. –

+1

Elbette, çizilecek çok fazla sayıda şekil/nokta ile uğraşmanız gerekiyorsa, Tuval SVG'den daha iyi ölçeklendirir (ipliklerdeki ölçütlere bakın). Ancak basit etkileşimli grafikler için (çubuk çizelgeleri, piecharts, vs) SVG yeterince hızlıdır ve [D3.js] (http://d3js.org/) kullanırsanız, nispeten az çabayla gerçekten etkileyici etkileşimli grafikler oluşturabilirsiniz. –

+0

SVG veya Tuval mi? İkisi arasında geçiş yapmak. http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/ – Cherven

İlgili konular