2010-03-17 18 views
18

Özellikle uğraştığım şey sadece bir grafiğin düzeni değil, bir kullanıcı bir grafik düğümü seçtiğinde ve onu ekran alanı etrafında sürüklemeye başladığında, satırın neye benzeyeceğini yansıtmak için sürekli olarak yeniden çizilmesi gerekir. ise kullanıcı düğümünü serbest bırakacaktı. Sanırım bu düzen algoritmasının bir parçası mı?Grafik düğümleri arasında çizgi çizmek için bazı iyi algoritmalar nelerdir?

Ayrıca bazı uygulamalar biraz süslü olur ve çizgiyi düzgün bir şekilde bükemez, aynı zamanda kare şekilli düğüm çevresindeki çizgiyi neredeyse dik açılarda bükebilir. Ekli görüntüye bakın ve bir düğümün sürüklendiğinden, çizginin karıncalar olarak çizildiğini ve kavisli stilini koruyarak güzelce yeniden düzenlendiğini unutmayın.

alt text http://img260.imageshack.us/img260/5458/nodesr.png

cevap

8

sizin diyagramlar deli değilseniz tam bunun için ekstra fantezi algoritması gerekmez, ama sadece biraz sağduyu kullanın.

  1. kapak yüzeyinde dikdörtgen ızgara ile ve daha sonra açıları minimum sayıda ızgara hattı boyunca düz çizgiler ile kutular bağlanmak için bir yol bulmak: kutuları aynı ızgara çizgileri ile ilgili değildir ve 'don Bağlandığınız yerde dikkatli olun, aralarında başka bir düğüm yoksa bir açıya ihtiyacınız vardır. Eğer varsa düğümler en az bir açıya ihtiyaç duyduğunuz şekilde.

  2. Daha dolu diyagramlar için ikinci adım olarak, yalnızca minimum kenar sayısı için değil, aynı zamanda satırların minimum uzunluğu için de optimize edilen bir kod ekleyin. Şemalarınız çılgın değilse, bu uygulama yanıtı açısından pek fark edilmemelidir.

  3. Her iki bacağın uzunluğunu dikkate alarak ve yüzeydeki diğer cisimlerle kesişen noktaları kontrol ederek açıları yuvarlak bir şekilde uzatın. 90 ° 'lik çemberler kullanırdım ve çemberin yarıçapını ayarlardım (görünüşte yukarıda ne yapılmadığı) - daha uzun bacaklar için yarıçap daha büyük olmalıdır. Belki kullandığınız araç seti burada size yardımcı olabilir.

+1

1 tam bir ızgara için gerekli değildir, bağlantı noktalarının hanan ızgarası ve önlemek için bitler yeterli olmalıdır diye düşünüyorum –

+0

Teşekkürler, tekerleği yeniden icat etmeye çalışmıyorum, ancak eminim hepsi ince ayarlanmış algoritmaların yakın yaklaşımları ile gelir. Ben zaten orada bir şey var mı diye merak ediyorum. – ApplePieIsGood

+1

cevabının kendisi ile başa çıkmak için önemsiz olmayan bazı konular ortaya çıkar (bir süreci açıklar ancak “nasıl yapılır” bölümlerinden yoksundur). Bunu kapatmak için "klasik" algoritmalar var mı? – gpilotino

0

Graphviz? Düzenleme algoritmalarının "dinamik" ve yeniden boyutlandırıldığından emin değilim, ancak iyi bir başlangıç ​​noktası olabilir.

0

@honk yanıtını genişletmek için: daha düzgün eğriler için 3 veya 4 pivot noktası alabilir ve bunları kuadratik/kübik bezier hatları kullanarak bağlayabilirsiniz.

bu

doğrudan Kartezyen koordinatlarda üzerine çizim ötesinde dramatik bir şey için bir ihtiyaç Yok gerçekten bir example in javascript from raphael plotting library

0

olduğunu. Basit sezgisel yöntemler, yolun üstesinden gelmek için ve çoğu zaman en düşük minimum açı sayısına ulaşması muhtemeldir, ve büyük olasılıkla en kısa uzunluk yolu daha sık görülür. Tüm bunlar, ihtiyaç duyduğunuz gibi dinamik bir şekilde yapılabilir, ancak ekranın kesilmesi gerekmeden daha hassas bir şekilde ekrana gelmeden (pikseller en ayrık seviye olmalıdır) ve karmaşık algoritmalara ihtiyaç duymadan grafik hassasiyetini korur. Kaplama için, tüm pikselleri çizgilerinizin rengine göre ayarlayın ve pikselin çizginin bir parçası olup olmadığına bağlı olarak alfa kanalı bitlerini saydam veya opak olarak değiştirin. Çizginin bir parçası olan bitlerin biraz geometri gerektirdiğini anlamak için, her şey hazır olduğunda bir parça kek.

Satırınızı alfa kanalına nasıl çizeceğinizi öğrenmek için, çizgilerinizin stilini anlamanız gerekir. Yapacağınız şeylerin çoğu, stile bağlı. Ortak bir stil, yatay ve yatay olarak doğru açılarda çeyrek daire ile hizalanmış düz çizgiler kullanıyor.

"Kaçınma" algoritmaları için, düğümlerinizi temsil eden "kutuları" ndan kaçınmak istediğinizde bunların uygulanması çok zor değildir ... tüm satırları küçültmek bir görevden biraz daha büyüktür ve Visio bile işe yaramıyor. Kutuların/düğümlerin önüne geçmek için, kutunun kenarları arasındaki orta nokta kullanılarak (geo1 ve geo3 arasındaki dikey kenarlar gibi) simetri yapmak ve bağlantı hatlarını tutmak için önceden tanımlanmış bir mesafe seçmek daha iyidir (satırlar) Bu kutuya bağlı olmayan) kutulardan uzakta da iyi çalışır. Bunun için genelleştirilmiş bir algoritmanın yapılması basittir, ama burada açıklamak için biraz fazla ayrıntıdır, fakat esas olarak yatay ve dikey olarak hizalanan çizgiler ve çeyrek dönüşler üzerinde çalışan genelleştirilmiş kontroller ve anahtarlar kümesidir. Bunun nasıl yapılacağına dair daha fazla ayrıntı isteyen sonuçlara ulaşırsanız, bu cevaba bir yorum gönderin.

Sizin için önceden yapılmış bir şey arıyorsanız, istediğiniz bağlantı türü ve yeniden düzenleme gerçekten uygulamaya bağlıdır ve pek çok kişi talep düşük veya talep fazla spesifik olmayan araçlar yapar . Açıkçası bu tür yazılımlar, Visio ve diğerleri tarafından kullanıldığından beri oradadır, fakat açık kaynak olarak ya da kesin olmayan diğer ücretsiz kütüphanelerin bir parçası olarak kullanılabilir olsun ya da olmasın.

İlgili konular