> For the complete documentation index, see [llms.txt](https://learn.vispeahen.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://learn.vispeahen.com/kumanda-tablosu/plugin-listesi/gorsel-bilesenler/measure-tile-metrik-karti.md).

# Measure Tile: Metrik Kartı

Measure Tile, kumanda tablolarında (dashboards) en kritik performans göstergelerini (KPI) veya özet sayısal değerleri tek bir bakışta, büyük puntolarla vurgulamak için kullanılan temel bileşendir. Diğer grafik türleri verilerin dağılımını, eğilimini veya birbirleriyle olan ilişkilerini gösterirken; Measure Tile doğrudan net bir sonuca odaklanır.

Measure Tile; toplam ciro, aktif müşteri sayısı, günlük sipariş adedi, hedef gerçekleşme yüzdesi veya toplam personel sayısı gibi yönetici özet ekranlarında ilk görülmesi istenen anahtar metriklerin sunumunda kullanılmak üzere tasarlanmıştır.

Bileşenin en büyük avantajı, sayfanın en üstünde veya stratejik noktalarında konumlandırılarak veri setinin en önemli sonucunu, karmaşık grafik okumalarına gerek kalmadan saniyeler içinde kullanıcıya aktarabilmesidir.

{% hint style="info" %}
**Not:** Measure Tile, tekil ve güçlü bir sayıyı vurgulamak için tasarlanmıştır. Verilerin zamana bağlı değişimini (trendini) veya kategorik kırılımlarını göstermek için kullanılamaz. Genellikle dashboard tasarımlarında üst bilgi paneli (header) olarak birden fazla Measure Tile yan yana dizilir ve alt kısımdaki detaylı grafiklerin özetini oluşturur.
{% endhint %}

## &#x20;Measure Tile Bileşeninin Eklenmesi

Measure Tile eklemek için **Plugin Listesi** içerisinden **Measure Tile** bileşeni seçilir ve kumanda tablosuna eklenir.

<figure><img src="/files/RY2heIwdIoPueCC6A78b" alt=""><figcaption></figcaption></figure>

Bileşen eklendikten sonra kutuda gösterilmek istenen sayısal ölçü alanı eşleştirilerek yapılandırma tamamlanır.

## Measure Tile Araçları

<img src="/files/CHeUNvMF9TBRJxtutFk3" alt="" height="316" width="503">

1. **Araçları Aç/Kapat:** Görsel ile ilgili düzenleme yapılan ikonların açıp kapatıldığı ikondur.
2. **Veri:** Kullanıcının kendi verileriyle görseli şekillendireceği alandır.
3. **Ayarlar:** Görselin renk/başlık gibi biçimsel özelliklerinin değiştirildiği alandır.
4. **Koşulsal Formatlama:** Grafik üzerinde tanımlanan belirli bir kural neticesinde verileri gözle daha kolay bir şekilde taramak için renksel biçimlendirmeler yapılan alandır
5. **Navigasyon:** Görselden belirlenen parametreye göre navigasyon verilen alandır
6. **Yenile:** Veri alanı ile grafiğin çalışması ve grafiğin yenilenmesini sağlar.
7. **Kaldır:** Görseli silmek için kullanılan alandır. “Kaldır” ikonuna tıklandığında “Bu görseli silmek istiyor musunuz?” şeklinde uyarı çıkmaktadır

> **Not:** Navigasyon grafiklerde ortak olduğundan ayrı başlıkta yer alacaktır.

## Veri Yapılandırması

Measure Tile Bileşeninin oluşturulabilmesi için kullanılacak veri alanlarının tanımlanması gerekmektedir. Bu işlem **Veri** ekranı üzerinden gerçekleştirilir.

<figure><img src="/files/czGhcR3WkAjep36RHG6r" alt=""><figcaption></figcaption></figure>

<mark style="color:green;">**Tablolar & Kolonlar**</mark>: Seçili modelde var olan tablo ve kolonların bulunduğu alandır.&#x20;**Tablolar & Kolonlar** bölümünde yer alan kolonlar, sağ tarafta bulunan bölümlere sürükle-bırak ile eklenir.

<mark style="color:green;">**Kolon Eşleştirmeleri**</mark>

* **Sıralama ve Limit:** Kolon verisinin artan/azalan şekilde sıralamasının yapıldığı alandır.
* **Ölçü Değeri:** Grafiği şekillendirmek için kullanılacak sayısal verinin eklendiği alandır.&#x20;
* **Saklı Alan:** Grafikte gösterilmeyen default filtrede, formülde kullanılmak üzere verinin eklendiği alandır.

## Yapılandırma Ayarları

Measure Tile Bileşenine ait görünüm ve davranış ayarları **Ayarlar** ekranı üzerinden yönetilir.

<figure><img src="/files/mN83IfIbZrPdg4OX9G0S" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
**Not:** Measure Tile bileşeninde birden fazla **Ölçü Değeri** kullanılması durumunda, her ölçü için ayrı bir yapılandırma sekmesi oluşturulur. Kullanıcı, ekranın üst kısmında yer alan ölçü sekmeleri arasında geçiş yaparak her bir ölçünün ayarlarını bağımsız olarak düzenleyebilir.

<p align="center"><img src="/files/bPqKW9xFbyKJb0AeRLw1" alt="" data-size="original"></p>

Yukarıdaki örnekte olduğu gibi, bileşende **Bakım Sayısı** ve **Arıza Sayısı** ölçüleri birlikte kullanılıyorsa; her iki ölçü için başlık, açıklama, değer stili, ikon ve benzeri ayarlar ayrı ayrı tanımlanabilir.

Bazı ayarların tüm ölçüler için aynı şekilde uygulanması istenirse, ilgili alanlarda bulunan **Bütün kolonlara uygula** seçeneği kullanılabilir.
{% endhint %}

<mark style="color:green;">**Temalar**</mark>

<figure><img src="/files/BkLopw6tSmHEeOfDja3X" alt=""><figcaption></figcaption></figure>

* **Tema Rengi:** Temanın ana rengini belirler. Seçilen renk, metin ve ikon gibi öğelerin vurgulanmasında kullanılır.
* **İkon Çerçevesini Göster:** Etkinleştirildiğinde, seçilen ikonun etrafında ince bir çerçeve görünür.

<mark style="color:green;">**Başlık Yazı Biçimlendirme**</mark>

<figure><img src="/files/vxSAX5WM6tFaJ3JSYZo1" alt=""><figcaption></figcaption></figure>

* **Performans Döşeme Başlığı:** İlgili ölçüm değerinin üzerinde görünecek başlık metnini tanımlar.
* **Başlık Açıklaması Başlık Hizası:** Başlık açıklamasının hizasını belirler (sol, orta, sağ).
* **Başlık Yazı Stili:** Başlığın kalın, italik veya altı çizili olup olmayacağını seçebilirsiniz.
* **Başlık Yazı Tipi:** Başlıkta kullanılacak fontu belirler (ör. Verdana).
* **Boyut:** Başlık metninin punto büyüklüğünü tanımlar.

<mark style="color:green;">**Başlık Açıklaması Stili**</mark>

<figure><img src="/files/ZM66GK6ECdsdbyvrE0qo" alt=""><figcaption></figcaption></figure>

* **Başlık Açıklaması:** Başlık altına eklenebilecek kısa bilgilendirici metindir.
* **Başlık Açıklaması Yazı Stili:** Kalın, italik, altı çizili gibi biçimlendirmeler uygulanabilir.
* **Başlık Açıklaması Yazı Tipi:** Açıklama metninde kullanılacak yazı tipini belirler.
* **Boyut:** Açıklama metni punto büyüklüğüdür.

<mark style="color:green;">**Değer Stili**</mark>

<figure><img src="/files/vkEq0uiv4wTdE3PRF0zX" alt=""><figcaption></figcaption></figure>

* **Değer Pozisyonu:** Sayısal değerin hizasını belirler (sol, orta, sağ).
* **Değer Yazı Stili:** Kalın, italik, altı çizili gibi seçeneklerle biçimlendirme yapılabilir.
* **Değer Yazı Tipi:** Değerin font tipini belirler (ör. Verdana).
* **Boyut:** Sayısal değerin punto büyüklüğünü ayarlar.

<mark style="color:green;">**Görsel Ekle**</mark>

<figure><img src="/files/iPpEPiBA9Ec1MO3PSc9T" alt=""><figcaption></figcaption></figure>

* **İkon:** İkon seçici yardımıyla plugine görsel bir simge ekleyebilirsiniz.
* **İkon Boyutu:** Eklenen ikonun büyüklüğünü belirler.
* **Resim mi?:** İkon yerine özel bir görsel dosyası (ör. logo) kullanılmak isteniyorsa bu seçenek etkinleştirilir.

<mark style="color:green;">**Veri Yok Ayarları**</mark>

<figure><img src="/files/hqN0NVoXaVbQ4eB4m95A" alt=""><figcaption></figcaption></figure>

* **Veri Yok Açıklaması:** Veri gelmediğinde kullanıcıya gösterilecek mesajı belirler. Default olarak *“Seçilen kriterlerde veri bulunamadı. Plugin görselleştirilemedi.” mesajı görünür.*
* **Veri Yok Yazı Stilleri:** Mesajı **kalın** , *italik* veya altı çizili yapmanı sağlar.
* **Veri Yok Yazı Stili:** Yazı tipini/fontunu belirler.
* **Veri Yok Yazı Boyutu:** Mesajın font büyüklüğünü belirler.
* **Veri Yok Yazı Rengi:** Mesajın hangi renkte gösterileceğini belirler.

<mark style="color:green;">**Genel Görünüm**</mark>

<figure><img src="/files/iz8I3ht4CJnw6DOtZQoI" alt=""><figcaption></figcaption></figure>

* **Arkaplan Rengi:** Görselin arka plan rengini belirler.
* **Süre (Saniye):** Görselin animasyon veya geçiş hızını ayarlar.
* **Koşulsal Formatlamayı Göster:** Veriye bağlı olarak renklendirme (ör. belirli eşiğin üstü yeşil, altı kırmızı) yapılmışsa, bu biçimlendirmeyi gösterir veya gizler.

<mark style="color:green;">**Sayfalama**</mark>

<figure><img src="/files/26ytcLVynDlATwYeFP7H" alt=""><figcaption></figcaption></figure>

* **Sayfalama:** Etkinleştirildiğinde birden fazla metrik veya değerin tek döşemede sıralı şekilde görüntülenmesini etkinleştirir.
* **Sayfalama Alt Butonları:** Sayfalama aktifken, alt kısımda geçiş düğmelerinin (ileri-geri okları) görüntülenmesini sağlar.

<mark style="color:green;">**Karşılaştırma**</mark>

<figure><img src="/files/P4VxihoHkqeMJEc1XTV8" alt=""><figcaption></figcaption></figure>

* **Karşılaştırma:** Measure Tile üzerinde kullanılan ölçü değerlerinin birbiriyle karşılaştırılmasını sağlar. Etkinleştirildiğinde, ana ölçü değeri ile karşılaştırma için kullanılan diğer ölçü arasındaki fark bileşen üzerinde gösterilir.
* **Karşılaştırma Pozisyonu:** Karşılaştırma sonucunun Measure Tile içerisinde hangi konumda görüntüleneceğini belirler. Karşılaştırma bilgisi sol, orta veya sağ alanda konumlandırılabilir.
* **Karşılaştırma Açıklaması:** Karşılaştırma bilgisinin yanında gösterilecek açıklama metnini belirler. Örneğin *“Geçen Aya Göre”*, *“Önceki Döneme Göre”* veya *“Hedefe Göre”* gibi ifadeler kullanılabilir.
* **Ölçüm Gösterimi:** İki ölçü arasındaki karşılaştırma sonucunun nasıl gösterileceğini belirler. Örneğin değişim miktarı yüzdesel olarak görüntülenebilir.
* **Ondalık Sayısı:** Karşılaştırma sonucunda gösterilecek ondalık basamak sayısını belirler. Böylece karşılaştırma değeri istenen hassasiyette görüntülenebilir.
* **Renkleri Özelleştir:** Karşılaştırma sonucundaki artış, azalış veya belirlenen eşik durumlarında kullanılan varsayılan renkler yerine kullanıcı tarafından özel renkler tanımlanmasını sağlar.
  * **< Değeri:** Karşılaştırma sonucu belirtilen eşik değerin altında kaldığında kullanılacak rengi belirler.
  * **≥ Değeri:** Karşılaştırma sonucu belirtilen eşik değere eşit veya üzerinde olduğunda kullanılacak rengi belirler.

<mark style="color:green;">**Başlık Ayarları**</mark>

<figure><img src="/files/JMAsmQlIcbSTYqSKzbBQ" alt=""><figcaption></figcaption></figure>

* **Başlık:** Grafiğe verilecek başlığın tanımlandığı alandır.
* **Başlık Hizası:** Grafik başlığının sola, ortaya veya sağa hizalanmasını sağlar.
* **Başlık Yazı Stilleri:** Grafik başlığının kalın, italik veya altı çizili gibi yazı stilleriyle biçimlendirilmesini sağlar.
* **Başlık Yazı Stili:** Grafik başlığında kullanılacak yazı tipini (font) belirlemenizi sağlar.
* **Başlık Yazı Rengi:** Grafik başlığının metin renginin değiştirilmesini sağlar.
* **Başlık özelliklerini rapordaki diğer pluginlere uygula:** Tanımlanan başlık ayarlarının (stil, renk, hizalama vb.) aynı dashboard içindeki diğer grafik bileşenlerinin başlıklarına da otomatik olarak uygulanmasını sağlar.

## Kullanım Örneği

<figure><img src="/files/sQQ75PlvprxqHL3b9kIk" alt=""><figcaption></figcaption></figure>

Yukarıdaki örnekte, **Measure Tile** bileşeni kullanılarak bakım ve arıza süreçlerine ait farklı performans göstergeleri tek bir görünüm üzerinden sunulmaktadır. Bileşen, tek bir ölçünün vurgulanmasının yanı sıra birden fazla ölçünün aynı döşeme içerisinde birlikte gösterilmesine ve ölçüler arasında karşılaştırma yapılmasına olanak tanır.

**Toplam Maliyet** başlıklı ilk Measure Tile içerisinde, 2024 ve 2025 yıllarına ait toplam maliyet değerleri birlikte gösterilmektedir. Döşemenin alt kısmında yer alan **Değişim** bilgisi ise bu iki ölçü arasındaki farkın yüzdesel olarak ifade edilmesini sağlar. Örnekte 2025 yılı toplam maliyetinin 2024 yılına göre azaldığı, yüzdesel değişim değeri ve aşağı yönlü gösterim ile kullanıcıya aktarılmaktadır. Bu yapı, önceki dönem ve mevcut dönem, gerçekleşen ve hedef ya da benzeri iki ölçünün karşılaştırılması gereken senaryolarda kullanılabilir.

**Tekrar Arıza Oranı** ve **Kritik Arıza Oranı** değerlerinin bulunduğu ikinci Measure Tile içerisinde ise birden fazla ölçü aynı bileşen üzerinde gösterilmektedir. Her ölçü için başlık, değer ve ikon gibi alanlar ayrı ayrı yapılandırılabildiğinden, aynı döşeme içerisinde yer alan metriklerin birbirinden kolaylıkla ayırt edilmesi sağlanır. Bu kullanım, aynı konu veya süreç ile ilişkili KPI'ların tek bir alanda toplu olarak takip edilmesi için uygundur.

**Toplam Duruş Süresi** başlıklı Measure Tile ise tek bir ölçünün ön plana çıkarıldığı kullanım örneğini göstermektedir. İlgili KPI, başlık, ikon ve sayısal değer ile birlikte sade bir yapıda sunularak kullanıcının metriğin mevcut durumunu hızlı şekilde değerlendirmesine olanak sağlar.

Bu örneklerde görüldüğü üzere Measure Tile; **tekil KPI gösterimi**, **birden fazla ölçünün aynı bileşende sunulması** ve **ölçüler arasındaki değişimin karşılaştırmalı olarak gösterilmesi** gibi farklı ihtiyaçlara göre yapılandırılabilir.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://learn.vispeahen.com/kumanda-tablosu/plugin-listesi/gorsel-bilesenler/measure-tile-metrik-karti.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
