Extension:Graph/tr

Graph uzantısı, bir etiketin çubuk grafikler, pasta grafikler, zaman çizelgeleri ve histogramlar (demo) gibi veri görselleştirmelerini Vega tabanlı grafik.

Genel bilgi
Graph uzantısı, güçlü Vega tabanlı grafiklerin viki sayfalarına eklenmesini sağlar. Grafikler hem statik hem de etkileşimli olabilir.

Grafik eklemenin en kolay yolu, gibi hazır bir şablon kullanmaktır. Bu şablonlar tüm Vega karmaşıklıklarını gizler. Deneyimli kullanıcılar, grafikler geliştirmek için Graph Deneme Tahtası kullanabilir. Graph deneme tahtası, JSON'a ek olarak viki şablonu sözdizimine izin verir.

Yararlı bağlantılar

 * Vega 2 belgesi - Vega 2 belge sayfalarını geri yükledi.
 * - vikide grafiklerin nasıl kullanılacağına dair genel öneriler.
 * - sıfırdan karmaşık bir etkileşimli grafiğin nasıl oluşturulacağı adım adım talimatlar
 * - birçok örnek ve kullanım hilesi için
 * TechTalk Video - Lyra editörünün harika bir demosunu içeren Graph uzantısını tartışan bir WMF teknoloji tartışması (ayrıca laboratuarlara yüklenmiştir).
 * Vega gelecek yetenekleri (Keynote, Jeffrey Heer) ile de ilgilenebilirsiniz.
 * Geliştiriciler için Vega - tüm Vega kaynakları arasında en iyi yer
 * Etkileşimli Vega'ya video tanıtımı
 * Etkileşimli Vega'ya video tanıtımı

Ek yapılandırma ayarları
en.wiki gibi bir üretim ortamını çoğaltmak istiyorsanız, aşağıdaki adımları tamamlamanız gerekir:

Roller (yalnızca Vagrant kullanmaya karar verdiyseniz)


 * graphs rolünü etkinleştir
 * Scribunto rolünü etkinleştir
 * imagemap rolünü etkinleştir

Şablonlar ve Lua Modülleri


 * Module:Graph yerel olarak kopyala
 * Module:Graph/doc yerel olarak kopyala
 * Template:Nowrap yerel olarak kopyala
 * Copy Template:Nowrap/styles.csslocally
 * Module:Chart yerel olarak kopyala
 * Module:Chart/Default_colors yerel olarak kopyala.
 * File:Circle_frame.svg yerel olarak kopyala

Grafik örnekleri
Birçok örnek ve kullanım püf noktası için bakın.

Kullanıcı tanımlı geri döndürme
İstemci tarafında oluşturmayı kullanırken,  kullanıcılara statik bir geri dönüş resimi sağlamak için Wikimedia Commons kullanmak mümkündür. Bu, yakında hizmet dışı bırakılacak olan Graphoid hizmetinin yerini alacak sunucu tarafında işleme sağlamak için yeni bir hizmet devreye girene kadar geçici bir çözümdür.

Kullanıcı önce statik grafiği Wikimedia Commons'a yüklemelidir.

Yedek resimlerin iki değişkeni  ve.

, bir Wikimedia Commons dosya adı ile ilgilidir.

, piksel cinsinden yedek resim genişliğidir.

Bu değişkenler aşağıdaki şekilde grafikten geçirilir:

Module:Graph gibi Lua modülleri kullanıldığında, bu değişkenler etiket işlevi aracılığıyla sağlanabilir. uyarlanmış olsaydı, şöyle görünürdü:

Daha sonra aşağıdaki şekilde bir şablonda kullanılacaktır:

fallbackWidth sağlanmadıysa ancak bir resim tanımlandıysa, uzantı genişliği sağlanan grafik genişliğinden türetecektir. Bunun nedeni, oluşturulan resim genişliğinde ve gerçek resim genişliğinde sıklıkla bir fark olmasıdır.

Dış veriler
HTTP(S) protokolü, grafik için veri almak için kullanılamaz. Bunun yerine,,   ve diğerleri gibi özel viki protokollerinden birini kullanın.

Graphoid hizmeti ve Graph uzantısı, bu protokollerin nasıl çözüleceğini kontrol etmek için  ayarını kullanır: Note that because queries rely on the structure of wikibase items, they may suddenly stop working if the underlying data is edited and changes, as it may yield incomplete, empty or invalid data that can't be used to create a graph. In these cases the graph will end up empty (see T168601).

Bilinen hatalar ve sınırlamalar

 * tag/graph - Graph uzantı hataları
 * tag/graphoid/ - Graphoid hizmet hataları
 * ISO 8601 zaman ölçekleri uygulanamadığından zaman çizelgelerinde yalnızca Miladi takvimler kullanılabilir
 * Çoğu tarayıcıda resim yükseltme varsayılan olarak bulanık olabilir. Çözülecek uygun image-rendering özelliğini ayarlayın.

Dahili
Ayrıştırırken, Graph uzantısı tüm şablon parametrelerini/ifadelerini genişletir ve kimlikler için grafik karmaları kullanarak tüm grafik tanımlarını  sayfa özelliğinde saklar. Bu, bir vikinin grafiklerini [ Special:PageWithProps] veya [//www.mediawiki.org/w/api.php?action=query&list=pageswithprop&continue=&formatversion=2&pwppropname=graph_specs eylem API] ile kolayca bulabileceğiniz anlamına gelir.

Graph uzantısı, grafiklerin gitmesi gereken sayfaya HTML ekler, etiketi içeren bir. Örnek:

etiketinin  özniteliği, [//www.mediawiki.org/api/rest_v1/page/graph/png/Extension%3AGraph%2FDemo/1686336/d243aa924db2f82926e0f317217fcce591fe8cd4.png statik bir resminin] sağlayan #Graphoid hizmetini işaret eder.

Graph uzantısı etkileşim için yapılandırılmışsa ve istemci tarayıcısında JavaScript etkinse ve ResourceLoader'ın JavaScript göndermediği eski bir tarayıcı değilse, istemci tarayıcısı anında grafikleri oluşturur. Graph uzantısı, Vega kitaplığını içeren sayfaya bir  ResourceLoader JavaScript modülü ekler ve grafik tanımlarının JSON'unu bir JavaScript   adlı değişkene   koyar. İstemci bu modülü yükledikten sonra, Vega JavaScript kitaplığı her bir HTML tuvali ile doldurur ve statik resminin yerini alarak grafiği içine çizer. , Wikimedia vikileri bu etkileşimli oluşturmayı yalnızca düzenleme önizlemesi için etkinleştirir.

Graph uzantısını her zaman yalnızca etiketini kullanacak şekilde yapılandırabilir ve Vega kitaplıklarını veya grafik tanımı JSON'sunu eklemeyebilirsiniz. kaydetme sonrasına kadar güncellenmeyeceği için bu mod düzenleme sırasında çalışmayacaktır. Kaydedildikten sonra, Graphoid hizmeti yeni grafik tanımına eylem API'si üzerinden erişebilecektir.

Güvenlik Özellikleri
, güvenilmeyen veri kaynaklarına başvurmaya izin vermeyecek şekilde yapılandırılabilir (örneğin, Wikimedia yalnızca Wikimedia sitelerinden gelen verilere izin verir). Ayrıca harici verilere her erişildiğinde ekstra başlıklar gönderebilir, örn. MediaWiki'nin CSRF saldırılarını önlemek için kullandığı  başlığı.

Lisans
Vega kitaplığı, kullanmamız için kabul edilebilir [$url BSD lisansla değiştirilmiş] altında dağıtılmaktadır.

Bu, bazı küçük (kabul edilebilir) değişikliklerle birlikte BSD lisansının bir kopyası gibi görünüyor. İdeal olarak lisansta böyle değişiklikler yapmasalar da, onu kullanmak bizim için bir sorun değil. İnsanların lisanslarında bu değişiklikleri yapmaması, lisansın açık kaynak kullanımı için güvenli olup olmadığı konusunda kafa karışıklığını (bunun gibi) önlemek için daha iyidir.

wgGraphIsTrusted
(varsayılan) ise, tüm grafik verisi istekleriyle Treat-as-Untrusted:1 üstbilgisini iletir

wgGraphImgServiceUrl
&lt;img> etiketi için bir arka uç hizmeti istek URL'si oluşturmak için bir biçim dizesi. Örneğin:

Bu URL'yi üretir:

//graphoid.wikimedia.org/mediawiki.org/v1/png/Extension:Graph/0/be66c7016b9de3188ef6a585950f10dc83239837.png /{domain}/v1/png/{title}/{revid}/{hash}.png

Parametreler şu sırayla sağlanacaktır: 1=server, 2=title, 3=revid, 4=graph-hash-id. Tüm parametrelerden rawurlencode ile çıkış yapılacaktır. Değer  (varsayılan) ise, hiçbir  url oluşturulmaz

Diğer değişkenler
wgGraphUrlBlacklist değişkeni 787d64a11 içinde kaldırıldı (7 Aralık 2015).

e0813f85a (28 Ocak 2016) içinde wgGraphDataDomains kaldırıldı. Bunun yerine wgGraphAllowedDomains kullanın.

wgGraphUserServiceAlways değişkeni b735f63ff4b içinde kaldırıldı (30 Eylül 2015).

Graph ad alanını etkinleştirme
Grafik tanımlarını bağımsız sayfalar olarak kendi ad alanlarında saklamak için yapılandırın.

Graphoid hizmeti
Graphoid bir node.js hizmeti, gelişmiş tarayıcılarda çalışan aynı Vega kitaplık kodunu kullanarak bir grafik tanımını statik bir PNG resmine dönüştürür. Graphoid'in başlangıçta geliştirilmesinin nedeni statik bir resim sağlamaktı, böylece Vega ve d3 kaynak yükleyici modüllerini her sayfa yanıtıyla bir araya getirmek zorunda kalmayacağız. Ayrıntılar için T211881 sayfasına bakın. Hizmet, https://www.mediawiki.org/api/rest_v1/#/Page%20content/get_page_graph_png__title___revision___graph_id_ üzerindeki Wikimedia kümesinde mevcuttur.

Kendiniz kurabilirsiniz:

(not: bu paket korunmuyor (T211881 ve kurulum başarısız olabilir, T196001, T239100 bakınız. npm i --build-from-source yardım edebilir.)

Hizmet URL'leri sayfanın etki alanını (örneğin mediawiki.org), hizmet sürümünü (v1), grafiğin bulunduğu sayfanın başlığını (PageTitle), sayfanın revizyon kimliğini (12345, ancak mevcut için 0 olabilir) içerir ve grafiğin kendi karma kimliği (grafik tanımını tanımlamak için HTML sayfasında da kullanılır), örneğin:

http://localhost:6927/mediawiki.org/v1/PageTitle/12345/a64b022a8fa5b7fc5e40a2c95cd0a114b2ae1174.png (deprecated url)

https://www.mediawiki.org/api/rest_v1/page/graph/png/Extension%3AGraph/3420825/72edc224f0a10b343c1e84f63dbfc97cac9bc957.png

Graph uzantısını LocalSettings.php'deki Graphoid hizmetini aşağıdaki gibi bir satırla kullanacak şekilde yapılandırırsınız:

Graphoid hizmetlerini yapılandırın


Hizmeti kendi yapılandırma dosyası üzerinden daha fazla yapılandırabilirsiniz.

Görsel Düzenleyici modülü
Graph uzantısı, 2015 yazından bu yana, Görsel Düzenleyici içinde grafik düzenlemeyi sağlayan bir modül (ext.graph.VisualEditor) ile birlikte gelir.

Bu modül, bir Google Summer of Code 2015 projesinin sonucudur. Ayrıntılar için T89287 sayfasına bakın.

Bu modül, kullanıcıların yabancı uzantı düğümlerinin aksine, Görsel Düzenleyici içindeki grafikleri görmelerine olanak tanır. Ayrıca, kullanıcılar bir grafiğin türünü, verilerini ve dolgusunu düzenlemek için bir iletişim kutusu açabilir. Kullanıcı arabirimi ayrıca, daha ileri düzey kullanıcıların kullanıcı arabirimi tarafından desteklenmeyen ayarları değiştirmek istemesi durumunda klasik vikimetin düzenleyiciye geçmek zorunda kalmadan VE içinde bir grafiğin ham JSON belirtimini düzenlemenin bir yolunu sunar.

Bu ilk adım, Görsel Düzenleyici içinde grafik düzenleme ile birçok olasılık için bir atlama taşı görevi görür ve modülün geliştirilip genişletilebileceği birçok yol vardır.

Bozuk grafiklerde sorun giderme
Grafiklerle ilgili hatalar, geliştirici konsoluna kaydedilir.

Hata: Hatalı yapıcı bağımsız değişkenleri (T277906)
Düzeltmek için: filepath:Earthmap1000x500compac.jpg olarak filepath:Earthmap1000x500.jpg ile değiştirin

Örnek.

TypeError: undefined is not an object (evaluating 'datum.firstYear.value')
To fix: Make sure you have not set default as null

Example.

Ayrıca bakınız

 * — kenarlarla birbirine bağlanmış köşe kümelerinin grafikler görüntülemek için (yani, bu uzantı gibi grafikler değil)
 * Plotly — Açık kaynak JavaScript grafik kitaplığı (3 boyutlu grafik yetenekleri ile)
 * D3 — Veriye Dayalı Belgeler