GoJS – Etkileşimli Diyagramlar Çizmek İçin JavaScript Kütüphanesi
GoJS, Northwoods 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 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’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>
https://codepen.io/SemihS/pen/xjdWyM
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.
2 Yorumlar
Eyvallah kardeşim.
Ne demek, iyi çalışmalar 🙂