İleri görselleştirme: seaborn, plotly ve doğru grafik

Doğru soruya doğru grafik

matplotlib ile görselleştirme dersinde Figure/Axes yapısını, çizgi, çubuk ve histogramı kurdun. Gerçek işte bunun bir üst katı gelir: "Sepet tutarı şehirlere göre nasıl dağılıyor?" sorusu için kutu grafiği, "Hangi değişkenler birlikte hareket ediyor?" için korelasyon ısı haritası, "Her şehirde trend aynı mı?" için küçük çoklu grafikler (small multiples), yöneticinin fareyle üzerine gelip değer okuyacağı etkileşimli bir grafik. Bu işler için Python dünyasında iki yıldız vardır: seaborn (istatistiksel grafik, matplotlib üstüne kurulu) ve plotly (etkileşimli, tarayıcıda çalışan grafik).

Ama araçtan önemlisi karardır: hangi soru, hangi grafik, hangi renk ve hangi eksen. Kötü seçilmiş bir grafik, doğru veriyle yanlış karar aldırır. Bu ders hem araçları hem de bu karar rehberini verir.

seaborn: tidy veri ile tek satırlık grafikler

seaborn'un sihri şudur: veriyi uzun (tidy) biçimde verirsin, sütun adlarını eksenlere ve renk (hue), panel (col, row) gibi görsel kanallara bağlarsın; gruplama, renk paleti ve gösterge (legend) kendiliğinden gelir.

import seaborn as sns
import matplotlib.pyplot as plt

sns.set_theme(style="whitegrid")              # tutarlı tema
# df: siparis_id, sehir, kategori, adet, tutar, segment

sns.histplot(data=df, x="tutar", bins=20, kde=True)               # dağılım
sns.boxplot(data=df, x="sehir", y="tutar")                        # gruplara göre dağılım
sns.violinplot(data=df, x="sehir", y="tutar", inner="quartile")   # dağılımın şekli
sns.scatterplot(data=df, x="adet", y="tutar", hue="segment")      # ilişki + renkle grup
sns.pairplot(df[["adet", "tutar", "indirim"]])                    # tüm ikili ilişkiler

kor = df[["adet", "tutar", "indirim"]].corr()
sns.heatmap(kor, annot=True, fmt=".2f", cmap="vlag", vmin=-1, vmax=1)

g = sns.FacetGrid(aylik, col="sehir", col_wrap=3, sharey=True)    # küçük çoklu grafikler
g.map_dataframe(sns.lineplot, x="ay", y="ciro")
plt.show()

seaborn fonksiyonları iki türdür. Eksen düzeyi (axes-level: histplot, boxplot, scatterplot, heatmap) tek bir Axes'e çizer ve ax= parametresi alır; matplotlib'in alt grafiklerine yerleştirebilirsin. Figür düzeyi (figure-level: relplot, displot, catplot, pairplot, FacetGrid) kendi figürünü kurar ve col=/row= ile panellere böler.

Aynı grafikleri matplotlib ile kurmak

seaborn'un yaptığı işin altında matplotlib nesneleri vardır. Gruplara göre kutu ve keman grafiği (violin plot) için veriyi önce gruplara bölmek yeterlidir.

import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt
import pandas as pd

df = pd.DataFrame({
    "sehir": ["Ankara"] * 6 + ["İzmir"] * 6 + ["Bursa"] * 6,
    "tutar": [120, 340, 95, 410, 260, 1500, 80, 150, 210, 175, 140, 190, 300, 320, 280, 350, 310, 900],
})
sehirler = sorted(df["sehir"].unique())
gruplar = [df.loc[df["sehir"] == s, "tutar"].to_numpy() for s in sehirler]

fig, (ax1, ax2) = plt.subplots(1, 2, figsize=(10, 4), sharey=True)
ax1.boxplot(gruplar)
ax1.set_xticks(range(1, len(sehirler) + 1), sehirler)
ax1.set_title("Kutu grafiği")
ax1.set_ylabel("Sepet tutarı (TL)")
ax2.violinplot(gruplar, showmedians=True)
ax2.set_xticks(range(1, len(sehirler) + 1), sehirler)
ax2.set_title("Keman grafiği")
fig.savefig("dagilim.png", dpi=100, bbox_inches="tight")
plt.close(fig)

print("eksen etiketleri:", [t.get_text() for t in ax1.get_xticklabels()])
print(df.groupby("sehir")["tutar"].describe()[["min", "25%", "50%", "75%", "max"]])

Kutu grafiği beş sayıyı (min, Q1, medyan, Q3, maks) ve aykırı değerleri gösterir: Ankara'daki 1500 TL'lik sipariş ayrı bir nokta olarak görünür. Keman grafiği ise dağılımın şeklini (iki tepeli mi, çarpık mı) da gösterir.

Korelasyon ısı haritası (heatmap) da bir imshow ve her hücreye bir text'tir. Dikkat: imshow'da x ekseni sütun, y ekseni satır indeksidir; hücre yazısı ax.text(j, i, ...) ile yazılır.

import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt
import pandas as pd

df = pd.DataFrame({
    "adet": [1, 3, 2, 5, 4, 6, 2, 8],
    "tutar": [120, 310, 260, 480, 450, 640, 190, 820],
    "indirim": [0, 5, 0, 10, 10, 15, 0, 20],
    "teslim_gun": [3, 2, 4, 1, 2, 1, 5, 1],
})
kor = df.corr().round(2)
fig, ax = plt.subplots(figsize=(5, 4))
im = ax.imshow(kor.to_numpy(), cmap="RdBu_r", vmin=-1, vmax=1)
ax.set_xticks(range(len(kor.columns)), kor.columns, rotation=45)
ax.set_yticks(range(len(kor.index)), kor.index)
for i in range(len(kor.index)):
    for j in range(len(kor.columns)):
        ax.text(j, i, f"{kor.iloc[i, j]:.2f}", ha="center", va="center")
fig.colorbar(im, ax=ax)
ax.set_title("Korelasyon matrisi")
plt.close(fig)
print(kor)
print("hücre yazısı:", len(ax.texts), "| renk skalası:", im.get_clim())

Grafik için veri hazırlamak

Görselleştirme işinin yarısı pandas'tır. seaborn ve plotly uzun biçim ister; ayların takvim sırasında çizilmesi için sıralı kategori gerekir; şehirleri ciroya göre sıralamak okunurluğu artırır. (melt'i ileri pandas dersinde gördün.)

import pandas as pd

genis = pd.DataFrame({
    "sehir": ["Ankara", "İzmir", "Bursa"],
    "Oca": [1200, 800, 600], "Şub": [1500, 950, 720], "Mar": [1400, 1010, 690],
})
aylar = ["Oca", "Şub", "Mar"]
uzun = genis.melt(id_vars="sehir", var_name="ay", value_name="ciro")
uzun["ay"] = pd.Categorical(uzun["ay"], categories=aylar, ordered=True)
print(uzun.sort_values(["sehir", "ay"]).head(4))

# Çubuk grafik için: büyükten küçüğe sırala, payı hesapla
toplam = uzun.groupby("sehir")["ciro"].sum().sort_values(ascending=False)
pay = (toplam / toplam.sum() * 100).round(1)
print(pd.DataFrame({"ciro": toplam, "pay_%": pay}))

plotly express: etkileşimli grafik

plotly grafiği bir HTML/JavaScript nesnesidir: fareyle üzerine gelince değer görünür (hover), yakınlaştırılır, seriler göstergeden açılıp kapanır. Panolar (dashboard), Jupyter keşfi ve e-postayla gönderilecek tek dosyalık raporlar için idealdir. plotly.express (px) seaborn'a çok benzer bir arayüz sunar.

import plotly.express as px

fig = px.line(aylik, x="ay", y="ciro", color="sehir", markers=True,
              title="Anadolu Market aylık ciro")
fig.show()                                      # tarayıcıda / Jupyter'de etkileşimli

fig = px.scatter(df, x="adet", y="tutar", color="segment",
                 hover_data=["siparis_id", "sehir"], facet_col="kategori")
fig.write_html("siparisler.html")               # tek dosya, her tarayıcıda açılır

fig = px.bar(toplam_df, x="sehir", y="ciro", text_auto=".2s")
fig.update_layout(yaxis_title="Ciro (TL)")

altair ise "grafiğin dilbilgisi" (grammar of graphics) yaklaşımını Python'a getirir: veriyi, işareti (mark) ve kodlamayı (encode) bildirirsin.

import altair as alt   # pip install altair

alt.Chart(df).mark_point().encode(
    x="adet", y="tutar", color="segment", tooltip=["siparis_id", "sehir"]
).interactive()

Grafik seçimi rehberi

Grafiği seçerken "hangi veriye sahibim?" diye değil "hangi soruya cevap arıyorum?" diye başla.

Renk ve erişilebilirlik

Rengin üç işi vardır ve her biri farklı palet ister: kategorik (şehirler: birbirinden ayrışan renkler), sıralı (sequential: az → çok, tek renk tonu, örn. viridis), iki uçlu (diverging: negatif ↔ pozitif, ortası nötr). Erkeklerin yaklaşık %8'inde bir tür renk görme farklılığı vardır; en yaygını kırmızı-yeşil ayrımıdır. "Kırmızı kötü, yeşil iyi" grafiği bu izleyiciler için tek renktir.

• Renk körü dostu paletler kullan: viridis, cividis, seaborn'da palette="colorblind".
• Rengi tek bilgi taşıyıcısı yapma: işaret şekli, çizgi stili ya da doğrudan etiket ekle.
• Metin ile arka plan arasında yeterli kontrast bırak (WCAG: normal metin için en az 4.5:1).
• Kategori sayısı 6-7'yi geçiyorsa renk ayrımı zorlaşır; grupları birleştir ya da küçük çoklu grafiğe geç.

import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt

aylar = ["Oca", "Şub", "Mar", "Nis"]
seriler = {"Ankara": [12, 15, 14, 18], "İzmir": [8, 9, 10, 11], "Bursa": [6, 7, 7, 9]}
renkler = ["#0072B2", "#E69F00", "#009E73"]          # Okabe-Ito: renk körü dostu
isaretler = ["o", "s", "^"]
cizgiler = ["-", "--", ":"]

fig, ax = plt.subplots(figsize=(7, 4))
for (sehir, y), r, m, c in zip(seriler.items(), renkler, isaretler, cizgiler):
    ax.plot(aylar, y, color=r, marker=m, linestyle=c, label=sehir)
    ax.annotate(sehir, (len(aylar) - 1, y[-1]), xytext=(5, 0), textcoords="offset points")
ax.set_title("Aylık ciro (bin TL)")
ax.legend()
plt.close(fig)
print([(l.get_label(), l.get_marker(), l.get_linestyle()) for l in ax.lines])

Yanıltıcı grafikler

Çoğu yanıltıcı grafik kötü niyetle değil, varsayılan ayarla üretilir. En sık beş tuzak:

import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt

sube = ["Kadıköy", "Çankaya"]
ciro = [1000, 1020]                     # yalnızca %2 fark
fig, (a, b) = plt.subplots(1, 2, figsize=(8, 3))
a.bar(sube, ciro); a.set_ylim(990, 1025); a.set_title("Yanıltıcı")
b.bar(sube, ciro); b.set_ylim(0, 1100); b.set_title("Dürüst")
plt.close(fig)

def gorunen_oran(ax):
    alt = ax.get_ylim()[0]
    return round((ciro[1] - alt) / (ciro[0] - alt), 2)

print("gerçek oran:", round(ciro[1] / ciro[0], 2))
print("yanıltıcı grafikte görünen:", gorunen_oran(a))
print("dürüst grafikte görünen:", gorunen_oran(b))

import pandas as pd
import seaborn as sns
import matplotlib.pyplot as plt

d = pd.DataFrame({"sehir": ["Van", "İzmir", "Van", "İzmir"], "tutar": [10, 40, 30, 20]})
sns.barplot(data=d, x="sehir", y="tutar", estimator="sum", errorbar=None)
plt.show()

import veri
import pandas as pd

s = veri.oku("kesit_bi", "Satislar")
s = s[s["Durum"] != "İptal"].copy()
s["YilAy"] = s["Tarih"].str[:7]

def kpi(df):
    ciro = df["Tutar"].sum()
    siparis = df["SiparisNo"].nunique()
    return {"ciro": round(ciro), "siparis": siparis, "sepet": round(ciro / siparis),
            "marj": round(1 - df["Maliyet"].sum() / ciro, 3)}

bu = kpi(s[s["YilAy"] == "2024-12"])
onceki = kpi(s[s["YilAy"] == "2024-11"])
for ad in bu:
    degisim = (bu[ad] - onceki[ad]) / onceki[ad]
    print(f"{ad:<8} {bu[ad]:>10,}  ({degisim:+.1%} geçen aya göre)")

# pano.py
import pandas as pd
import plotly.express as px
import streamlit as st

st.set_page_config(page_title="Kesit Satış Panosu", layout="wide")

@st.cache_data
def yukle():
    s = pd.read_csv("Satislar.csv")
    return s[s["Durum"] != "İptal"].assign(YilAy=lambda d: d["Tarih"].str[:7])

s = yukle()
kanallar = st.sidebar.multiselect("Kanal", sorted(s["Kanal"].unique()), default=sorted(s["Kanal"].unique()))
ay = st.sidebar.selectbox("Ay", sorted(s["YilAy"].unique(), reverse=True))
f = s[s["Kanal"].isin(kanallar)]

k1, k2, k3 = st.columns(3)
bu, onceki = f[f["YilAy"] == ay], f[f["YilAy"] < ay]
k1.metric("Ciro", f"{bu['Tutar'].sum():,.0f} TL")
k2.metric("Sipariş", bu["SiparisNo"].nunique())
k3.metric("Ortalama sepet", f"{bu['Tutar'].sum() / max(bu['SiparisNo'].nunique(), 1):,.0f} TL")

aylik = f.groupby("YilAy", as_index=False)["Tutar"].sum()
st.plotly_chart(px.line(aylik, x="YilAy", y="Tutar", title="Aylık ciro"), use_container_width=True)
st.dataframe(bu.groupby("Kanal")["Tutar"].sum().sort_values(ascending=False))

from dash import Dash, Input, Output, dcc, html
import plotly.express as px

app = Dash(__name__)
app.layout = html.Div([
    dcc.Dropdown(sorted(s["Kanal"].unique()), "Mobil", id="kanal"),
    dcc.Graph(id="grafik"),
])

@app.callback(Output("grafik", "figure"), Input("kanal", "value"))
def guncelle(kanal):
    aylik = s[s["Kanal"] == kanal].groupby("YilAy", as_index=False)["Tutar"].sum()
    return px.bar(aylik, x="YilAy", y="Tutar")

app.run(debug=True)

import base64, html, io
import matplotlib
matplotlib.use("Agg")
import matplotlib.pyplot as plt

aylik = s[s["YilAy"].str.startswith("2024")].groupby("YilAy")["Tutar"].sum()
fig, ax = plt.subplots(figsize=(6, 2.5))
ax.plot(aylik.index.str[5:], aylik.values, color="#2a6f97")
ax.set_title("2024'te ciro yıl sonuna doğru yükseldi")
tampon = io.BytesIO()
fig.savefig(tampon, format="png", dpi=100, bbox_inches="tight")
plt.close(fig)
png = base64.b64encode(tampon.getvalue()).decode()

rapor = f"""<!doctype html><html lang="tr"><meta charset="utf-8">
<title>{html.escape("Satış Raporu — Aralık 2024")}</title>
<h1>Aralık 2024</h1><p>Ciro: {bu['ciro']:,} TL</p>
<img alt="Aylık ciro" src="data:image/png;base64,{png}"></html>"""
print(len(rapor), "karakter; görsel gömülü:", "data:image/png;base64," in rapor)