Farklı uygulamalardan bağlanan veri kaynakları üzerinden grafiksel ayarlamalar yapılarak uygulamaya dair bilgilerin görselleştirilmesini yönetir.
Genel Bakış
Dashboard servisi arayüz paneli üzerinden farklı data kaynaklarından (rest api , rdms db leri) çekilen bilgilerle, verinin birden çok görsel bileşen kullanılarak görselleştirilmesine, filtrelenmesine olanak sağlar . Dışarıya verilen api ucu ile farklı uygulamalar içerisinden de, dashboard arayüzü üzerinden üretilen html'ler ile ekranın embed olarak gösterilmesi sağlanır.
Idm ve cloud control servis entegrasyonları ile authentication, authorization destekler. Hangfire servis entegrasyonu ile de dataların belirli aralıklarda güncellenmesine ve zamansal işlemlere olanak sağlar.
Kullanım Senaryoları
- Görselleştirilecek bilgilerin getirileceği veri kaynağı tanımlama
- Datayı göstermek için farklı görsel bileşen kullanımları
- Tanımlanan bileşenlerin bir araya getirilmesi ve filtre eklemeleri ve ekranda nasıl görüneceği ayar tanımları
- Oluşturulan dashboar un gözlemlenmesi
- Oluşturulan dashboard un import export edilebilmesi
- Oluşturulan dashboard un export edilmiş html'inin, embedded html olarak farklı uygulamalardan iframe üzerinden gösterilebilmesi
Kullanıcı Arayüzü
Uygulama genelinde kullanılan ekranlar aşağıda açıklanmıştır:
Veri Kaynağı Ekranı :
Bu ekran üzerinden görselleştirilmek istenen datanın kaynağı ve datanın nasıl çekileceği tanımlanır. Varolan veri kaynakları eklenebilir, silinebilir, güncellenebilir. Herhangi bir uygulamanın rest api ucu üzerinden veya veritabanı üzerinden data kaynağı tanımı yapılabilir. Veritabanı kaynağı olarak MsSql, PostgreSql seçilebilir.
Rest servis veri kaynağı tipi örneği :
Rest servis kaynak adresi belirlendikten sonra header parametreleri belirlenebilir, tarih alanı varsa format verilebilir ve session dan gelen bilgilerle ilgili parametre tanımı yapılabilir. Sonrasında kontrol et tuşuna tıklanıp servisten data gelip gelmediği kontrol edilebilir.
Veritabanı veri kaynağı örneği:
Veritabanından data getirilmek istenen durumlarda sorgunun çekileceği bağlantı bilgisi ,çalıştırılacak sorgu ve sorgunun çalıştırılması için gereken parametreler girildikten sonra bağlantı kontrol edilir, örnek veri getirilip sonuç kontrol edilebilir.
Dashboard Bileşenleri Ekranı:
Bu ekran üzerinden, çekilen datanın ekranda hangi dashboard bileşenleri ile gösterileceği, datanın hangi aralıklarla çekileceği ve bileşenlere ait görsel özelliklerin ayrıntılarının bilgisi belirlenir. İsteğe göre yeni bileşen eklenir, silinir veya güncellenebilir bu ekran üzerinden.
Dashboard üzerinden tanımlanabilecek bileşen listesi şöyledir:
Bileşen eklemesi yapılırken aşağıdaki gibi bileşen tanım adımlarından geçilir. İlk adımda bir önceki veri kaynağı sayfasında tanımlanan veri kaynağı bağlanır ve bu verinin gösterilmek istendiği ekran bileşeni seçilir, ikinci adımda bu veri kaynağının scheduler(zamanlama) ayarları yapılır anlık , bir defa ve tekrarlayan şeklinde seçenekler seçilebilir. Seçilen bu bilgilere göre veri kaynağında nasıl getirilmesi belirtilen datanın, hangi zaman aralıklarında tekrar çekileceği belirlenir. Üçüncü adımda seçilen bileşen e göre grafikse X, Y eksenleri ile ilgili ayarlar(eksen adı, etiketi, formatlaması v.s) , metrikse metrik özellikleri ayarları, datagridse griddeki kolon ayarları gibi ayarlar belirlenir .Dördüncü adımda seçilen bileşene göre varsa grafiğin Legend alanı ile ilgili ayarlar yapılır. Son adımda ise oluşturulan bileşenin nasıl görüneceği ile ilgili örnek bir görsel oluşturulup onaya sunulur. Oluşturulan bileşen istenen şekilde oluşmuşsa bileşen kaydı yapılır. Seçilen bileşen tiplerine göre eksenler başlığı değişebilir, genel başlığı hiç görünmeyebilir.
Dashboard Tanımı Ekranı
Bu ekran üzerinden oluşturulan bileşenler bir araya getirilerek dashboard ekranında nasıl görselleştirileceği ile ilgili ayarlar yapılır ve dashboard un son hali oluşturulur. Tanımlanan dashboardlar silinebilir, güncellenebilir. Önceden başka bir ortamda tanımlı dashboard ekranı import edilebilir ya da var olan dashboard sayfası export edilebilir.
Önceden tanımlanmış bir dashboard örneği aşağıdaki gibidir. Dashboard un tanımının yapılacağı uygulama seçimi yapılır. Dashboard bileşenleri sayfasında tanımlanan bileşenler istenildiği sayıda Görsel Bileşen Tanımları sekmesi altından eklenir. Eklenen bileşenin dashboard ekranındaki genişlik, yükseklik ve sayfa konum ayarları yapılır. Sonrasında bu bileşenler üzerinde filtreleme yapılabilmesi için Filtre Ayarları girilir. Filtrelemesi yapılacak alanın adı ve tipi (listbox, checkbox, radio button v.s) seçilir. Ekranın sağ tarafından eklenen bileşenlerin önizlemesi gözlemlenir.
Dashboard İzleme Ekranı
Son olarak önceki adımlarda hazırlanan dashboardlar bu ekran üzerinden izlenebilir. Filtreleme ayarları yapıldıysa filtre uygulanabilir. Dashboard a eklenen bileşenlerle görsel olarak kullanıcıya çekilen data üzerinden istenen bilgiler gösterilir.
Dış uygulamalardan Erişim
Dış uygulamalar, dashboard arayüzü üzerinden oluşturulan bir dashboard'u kendi ekranlarında gösterebilir. Bunun için Dashboard service api'sinin aşağıdaki adresine Authorization token bilgisi ile post isteği gönderilmelidir. Service cevabı html olarak dashboard içeriği dönmektedir. Service call cevabı sonrasında dış uygulama ekranlarında gösterilebilir.
http://dev-linux.logo-paas.com:7100/api/dashboards/{dashboardId}/htmlresponse
Örnek ajax api call :
$.ajaxSetup({
beforeSend:function (xhr) { xhr.setRequestHeader('Authorization', 'Bearer 5c8a6a65603847aa604eb045a77f5f532276c5cd82e048ebc53c5b78930e26c2');}
});
$.post("http://dev-linux-logo-paas.com:7100/api/dashboards/1154/htmlresponse",null, function( data ) {
$( "#test" ).html( data.replace('token=""','token="5c8a6a65603847aa604eb045a77f5f532276c5cd82e048ebc53c5b78930e26c2"') ); });
İlişkili Platform Servisleri
RBMS: MsSQL , PostgreSQL
NoSQL (multiple instance çalışma durumunda session storage olarak): MongoDB
Apache Kafka
CloudControl Servis
Idm Servis
Hangfire Servis
API Dokümantasyonu
Swagger UI: http://dev-linux.logo-paas.com:7100/api-docs/
Dashboard Paneli
Swagger UI: http://dev-linux.logo-paas.com:7100/
Dashboard Konfigürasyon Paneli
Swagger UI: http://dev-linux.logo-paas.com:7100/settings/ui/