2016-03-30 20 views
0

Bir pasta grafik oluşturmaya çalışıyorum. Birçok farklı kütüphane olduğunu gördüm ve tercih ettiğimlerden biri olduğu için Chart.js'yi denedim. Bu kütüphaneyi kullanmaya devam etmeye kararlı değilim, bu yüzden problemime başka bir çözüme açığım. Bir bölüme bir görüntü yüklemePasta Grafiği: görüntüyü segmente yükleyin ve tıklayın

  1. :

    Ben iki ana sorunları vardır.
  2. Seçili bölüme göre bir div görünecek şekilde bölümleri tıklanabilir hale getirmek.

Bu benim HTML

<body> 
    <canvas id="mycanvas"></canvas> 
</body> 

Bu benim JS

<script> 
    $(document).ready(function(){ 
     var ctx = $("#mycanvas").get(0).getContext("2d"); 

     var data = [ 
      { 
       value: 51, 
       color: "cornflowerblue", 
       highlight: "lightskyblue", 
       label: "Corn Flower Blue"   
      }, 
      { 
       value: 51, 
       color: "lightgreen", 
       highlight: "yellowgreen", 
       label: "Lightgreen" 
      }, 
      { 
       value: 51, 
       color: "orange", 
       highlight: "darkorange", 
       label: "Orange" 
      }, 
      { 
       value: 51, 
       color: "beige", 
       highlight: "bisque", 
       label: "Beige" 
      }, 
      { 
       value: 51, 
       color: "aliceblue", 
       highlight: "cadetblue", 
       label: "AliceBlue" 
      }, 
      { 
       value: 51, 
       color: "brown", 
       highlight: "chocolate", 
       label: "Brown" 
      }, 
      { 
       value: 51, 
       color: "darkviolet", 
       highlight: "deeppink", 
       label: "DarkViolet" 
      } 
     ]; 

     var piechart = new Chart(ctx).Pie(data); 

    }); 
</script> 

Sadece her bir segmente bir BackgroundImage verebilir herhangi bir yolu var mı nedir? Her birinin içinden geçip, bir tıklama etkinliğini de atayarak özelliği eklerken?

Teşekkür ederiz.

cevap

0

Ticari grafik kitaplıklarına açık iseniz, ChartDirector. Resimleri bölüm etiketlerine yükleyebilir ve etiketler bölümlere konabilir. Ayrıca bölümleri doldurmak için görüntüleri "duvar kağıdı" olarak kullanabilir. Bölümler ayrıca fare olaylarına (fare tıklatılmış gibi) yanıt verilebilir. Bazı örnek görüntülerdir:

2

3

ChartDirector sunucu tarafında çalışan ve birden fazla programlama dili destekler.

VB/C# Icon Pie Chart

VB/C# Texture Donut Chart

+0

teşekkür ederiz: adresinden Başvuru için, C# ASP.NET çerçevesinde yukarıdaki grafiklerde kodu/VB vardır! Ne yazık ki bir ticari grafik kütüphanesi kullanamıyorum, ama böyle bir şey olduğunu bilmek güzel, muhtemelen gelecekte kullanacağım. Bunu Photoshop'ta yapmaya ve üzerinde bir resim haritası kullanmaya karar verdim. Şimdi bulabildiğim en hızlı ve en kolay çözüm buydu, şimdi de Foundation'ı kullanırken görüntü haritasına yanıt vermenin bir yolunu bulmam gerekiyor. – RaDi