JavaScript

GoJS – Etkileşimli Diyagramlar Çizmek İçin JavaScript Kütüphanesi

Etkileşimli diyagramlar oluşturmanın en kolay ve kullanışlı yolu ile tanışın; GoJS

GoJSNorthwoods Software tarafından oluşturulan, kendi diyagramlarınızı oluşturmak için kullanabileceğiniz bir JavaScript kütüphanesidir.

Northwoods Software, çeşitli platformlarda etkileşimli diyagram bileşenleri ve sınıf kütüphanelerinin tedarikçisi konumundadır.

2012 yılında başlatılan GoJS , modern web tarayıcıları arasında etkileşimli diyagramları uygulamak için zengin özelliklere sahiptir. Akış şeması, türlü şemalar, görsel ağaçlar ve veri akışı gibi diyagramlar oluşturmak için bizlere kolaylık sağlıyor.

“GoJs’te bir durum tablosu”

GoJS saf Javascript olduğundan kullanıcılar diğer kütüphanelerdeki eklentiler veya bağlılıklar olmadan  GoJS’den yararlanabiliyor. Dokunmatik cihazlar dahil, hem masaüstü hem de mobil cihazlardaki tüm modern tarayıcılarla uyumluluğu ise çok iyi durumda. Bir HTML5 Canvas çözümü olarak, GoJS JQuery, AngularJS gibi herhangi bir JavaScript çerçevesiyle bütünleşebilir, ancak kendi başına bağımsız da çalışabilir. Ayrıca statik ekran ve baskı ihtiyaçları için şemaların SVG ihracatını da yine bizlere sunuyorlar.

“GoJS’te Org Chart Editörü”

GoJS’deki yeni özelliklerin, kullanıcıların talepleri üzerine eklenmesi de güzel bir durum. Dikkatle hazırlanmış ve iyi desteklenmiş bir kütüphane, geliştirme döngüsünde zaman kazanmak için nadir bir fırsattır. Bu durumda projenizi hızlı ve kolay bir şekilde olgunlaştırmak için GoJS bizlere çok fazla kolaylık sağlıyor.

Sizler de diyagram ve grafik çizmek istiyorsanız, açık kaynak olan bu kütüphaneyi kullanabilirsiniz.

GoJS Nasıl Kullanılır ?

GoJS ile çalışmaya başlamak için,  tabiki de öncelikle kütüphaneyi HTML belgesinde tanıtmanız gerekir. Eklemek için CDNJS‘den alabileceğiniz GoJS bağlantısını ekleyin. Ayrıca isterseniz GoJS Kütüphanesi‘ni de indirebilirsiniz.

  <! DOCTYPE html>   
  < html > 
    < head >
    . . .
    <! - GoJS kütüphanesini dahil edin. -> 
    < script  src = "go-debug.js" ></ script >

 Div Öğesinde GoJS’i Barındırma

 <body>
    <div id="myDiagramDiv" style="border: solid 1px blue; width:400px; height:150px"></div>


Artık , JavaScript ile Diyagramı bu Div öğesinin içinde yaratabilirsiniz.

  <script>
    var diagram = new go.Diagram("myDiagramDiv");
    diagram.model = new go.GraphLinksModel(
      [{ key: "Hello" },   
       { key: "World!" }],
      [{ from: "Hello", to: "World!"}]  
    );
  </script>

Yukarıda basit bir şekilde oluşturulmuş GoJS örneği ekledim. İnceleyebilirsiniz

Bu yazımda etkileşimli diyagramlar çizmek için kullanılan Javascript kütüphanesi GoJS’den bahsettim. Sizler de yorum bölümü ile yorumlarınızı bize ileterek destek olabilirsiniz.



Yazar hakkında

Semih Baltacıoğlu

Semih Baltacıoğlu

Front-End alanında çalışmalar yapıyor ve her geçen gün yeni bilgiler edinerek kendimi geliştiriyorum. "Bilgi paylaşıldıkça çoğalır" diyerekten bildiklerimi ve öğrendiklerimi siz değerli okurlarla paylaşıyorum. Siz de yaptığınız çalışmaları, edindiğiniz bilgileri paylaşabilir, Yorum alanı ile mutfağa katkıda bulunabilirsiniz.

Yorumlar

2 Yorumlar

Bir yorum yaz

This site uses Akismet to reduce spam. Learn how your comment data is processed.

gojs-etkileimli-diyagramlar-izmek-in-javascript-ktphanesi