AmCharts 시리즈로 그룹화 된 다중 시리즈 기둥 형 차트

-2

AMCHATS에서 이와 비슷한 것을 만들 수 있습니까?AmCharts 시리즈로 그룹화 된 다중 시리즈 기둥 형 차트

이

"dataProvider": [{ 
    "EjeX": "2009", 
    "Tipo": "CA", 
    "Sexo": "FEMENINO", 
    "Dato": 0.63, 
    "Tipo": "CA", 
    "Sexo": "MASCULINO", 
    "Dato": 0.625, 
    "Tipo": "IC", 
    "Sexo": "FEMENINO", 
    "Dato": 0.883, 
    "Tipo": "IC", 
    "Sexo": "MASCULINO", 
    "Dato": 0.856, 
    "Tipo": "IICG", 
    "Sexo": "FEMENINO", 
    "Dato": 0.844, 
    "Tipo": "IICG", 
    "Sexo": "MASCULINO", 
    "Dato": 0.812 
}, { 
    "EjeX": "2010", 
    "Tipo": "CA", 
    "Sexo": "FEMENINO", 
    "Dato": 0.535, 
    "Tipo": "CA", 
    "Sexo": "MASCULINO", 
    "Dato": 0.579, 
    "Tipo": "IC", 
    "Sexo": "FEMENINO", 
    "Dato": 0.827, 
    "Tipo": "IC", 
    "Sexo": "MASCULINO", 
    "Dato": 0.778, 
    "Tipo": "IICG", 
    "Sexo": "FEMENINO", 
    "Dato": 0.765, 
    "Tipo": "IICG", 
    "Sexo": "MASCULINO", 
    "Dato": 0.738 
}, { 
    "EjeX": "2011", 
    "Tipo": "CA", 
    "Sexo": "FEMENINO", 
    "Dato": 0.639, 
    "Tipo": "CA", 
    "Sexo": "MASCULINO", 
    "Dato": 0.617, 
    "Tipo": "IC", 
    "Sexo": "FEMENINO", 
    "Dato": 0.796, 
    "Tipo": "IC", 
    "Sexo": "MASCULINO", 
    "Dato": 0.754, 
    "Tipo": "IICG", 
    "Sexo": "FEMENINO", 
    "Dato": 0.748, 
    "Tipo": "IICG", 
    "Sexo": "MASCULINO", 
    "Dato": 0.745 
}, { 
    "EjeX": "2012", 
    "Tipo": "CA", 
    "Sexo": "FEMENINO", 
    "Dato": 0.567, 
    "Tipo": "CA", 
    "Sexo": "MASCULINO", 
    "Dato": 0.604, 
    "Tipo": "IC", 
    "Sexo": "FEMENINO", 
    "Dato": 0.761, 
    "Tipo": "IC", 
    "Sexo": "MASCULINO", 
    "Dato": 0.742, 
    "Tipo": "IICG", 
    "Sexo": "FEMENINO", 
    "Dato": 0.75, 
    "Tipo": "IICG", 
    "Sexo": "MASCULINO", 
    "Dato": 0.733 
}, { 
    "EjeX": "2013", 
    "Tipo": "CA", 
    "Sexo": "FEMENINO", 
    "Dato": 0.596, 
    "Tipo": "CA", 
    "Sexo": "MASCULINO", 
    "Dato": 0.58, 
    "Tipo": "IC", 
    "Sexo": "FEMENINO", 
    "Dato": 0.614, 
    "Tipo": "IC", 
    "Sexo": "MASCULINO", 
    "Dato": 0.6, 
    "Tipo": "IICG", 
    "Sexo": "FEMENINO", 
    "Dato": 0.609, 
    "Tipo": "IICG", 
    "Sexo": "MASCULINO", 
    "Dato": 0.596 
}]

출처

2014-04-11 user3402286

지금까지 해보신 것은 무엇입니까? amChart가 작동하지 않는 것을 보여주는 코드를 추가해보십시오. – ugo

당신은 ASP.Net과 C#을 사용하여 Amcharts를 사용하여 3D Stacked Column Chart 또는 어쩌면 Column with rotated series.

출처

2014-04-11 16:55:15 bigmike7801

스택 차트 같은 것을 사용할 수 있습니다

http://www.anychart.com/products/anychart/docs/users-guide/Samples/sample-multi-series-column-chart.html

여기 내 데이터입니다. 다음은 나를 위해 작동하는 코드입니다.

 <script src="amcharts/amcharts.js"></script> 
    <script src="amcharts/serial.js"></script> 
    <script src="ammap/themes/light.js"></script> 
    <script src="JSfiles/jquery-1.10.2.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      var chartDataResults = new Array(); 
      var chartgraphs = new Array(); 
      $.ajax({ 
       type: 'POST', 
       dataType: 'json', 
       contentType: 'application/json', 
       url: 'Premiumsmssuccess.aspx/Chartload', 
       data: {}, 
       success: 
        function (response) { 
         drawVisualization(response.d); 
        } 
      }); 
      function drawVisualization(dataValues) { 
       for (var i = 0; i < dataValues.length; i++) { 
        var dataitem = dataValues[i]; 
        var countrydate = dataitem.date; 
        var CNcountry = dataitem.CN 
        var IDcountry = dataitem.ID 
        var KHcountry = dataitem.KH 
        var MYcountry = dataitem.MY 
        var THcountry = dataitem.TH 
        var VNcountry = dataitem.VN 
        var CNsucess = dataitem.SUCCESSRateCN 
        var IDsucess = dataitem.SUCCESSRateID 
        var KHsucess = dataitem.SUCCESSRateKH 
        var MYsucess = dataitem.SUCCESSRateMY 
        var THsucess = dataitem.SUCCESSRateTH 
        var VNsucess = dataitem.SUCCESSRateVN 

        //alert(KHsucess); 

        chartDataResults.push({ 
         date: countrydate, 
         CN: CNcountry, 
         ID: IDcountry, 
         KH: KHcountry, 
         MY: MYcountry, 
         TH: THcountry, 
         VN: VNcountry, 
         SUCCESSRateCN: CNsucess, 
         SUCCESSRateID: IDsucess, 
         SUCCESSRateKH: KHsucess, 
         SUCCESSRateMY: MYsucess, 
         SUCCESSRateTH: THsucess, 
         SUCCESSRateVN: VNsucess 
        }); 
        var chart = AmCharts.makeChart("chartdiv", { 
         "type": "serial", 
         "theme": "light", 
         "depth3D": 20, 
         "angle": 30, 
         "legend": { 
          "horizontalGap": 10, 
          "useGraphSettings": true, 
          "markerSize": 10 
         }, 
         "dataProvider": chartDataResults, 
         "valueAxes": [{ 
          "stackType": "regular", 
          "axisAlpha": 0, 
          "gridAlpha": 0 
         }], 
         "graphs": [{ 
          "balloonText": "[[China]], [[date]]<br><span style='font-size:14px;'><b>[[CN]]</b> ([[SUCCESSRateCN]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateCN]]%", 
          "lineAlpha": 0.5, 
          "title": "China", 
          "type": "column", 
          "valueField": "CN" 
         }, { 
          "balloonText": "[[Indonesia]], [[date]]<br><span style='font-size:14px;'><b>[[ID]]</b> ([[SUCCESSRateID]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateID]]%", 
          "lineAlpha": 0.5, 
          "title": "Indonesia", 
          "type": "column", 
          "valueField": "ID" 
         }, { 
          "balloonText": "[[Cambodia]], [[date]]<br><span style='font-size:14px;'><b>[[KH]]</b> ([[SUCCESSRateKH]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateKH]]%", 
          "lineAlpha": 0.5, 
          "title": "Cambodia", 
          "type": "column", 
          "valueField": "KH" 
         }, { 
          "balloonText": "[[Malaysia]], [[date]]<br><span style='font-size:14px;'><b>[[MY]]</b> ([[SUCCESSRateMY]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateMY]]%", 
          "lineAlpha": 0.5, 
          "title": "Malaysia", 
          "type": "column", 
          "valueField": "MY" 
         }, { 
          "balloonText": "[[Thailand]], [[date]]<br><span style='font-size:14px;'><b>[[TH]]</b> ([[SUCCESSRateTH]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateTH]]%", 
          "lineAlpha": 0.5, 
          "title": "Thailand", 
          "type": "column", 
          "valueField": "TH" 
         }, { 
          "balloonText": "[[Vietnam]], [[date]]<br><span style='font-size:14px;'><b>[[VN]]</b> ([[SUCCESSRateVN]]%)</span>", 
          "fillAlphas": 0.9, 
          "fontSize": 11, 
          "labelText": "[[SUCCESSRateVN]]%", 
          "lineAlpha": 0.5, 
          "title": "Vietnam", 
          "type": "column", 
          "valueField": "VN" 
         }], 

         "categoryField": "date", 
         "categoryAxis": { 
          "gridPosition": "start", 
          "axisAlpha": 0, 
          "gridAlpha": 0 
         }, 
         "export": { 
          "enabled": true 
         } 

        }); 
        jQuery('.chart-input').off().on('input change', function() { 
         var property = jQuery(this).data('property'); 
         var target = chart; 
         chart.startDuration = 0; 

         if (property == 'topRadius') { 
          target = chart.graphs[0]; 
          if (this.value == 0) { 
           this.value = undefined; 
          } 
         } 

         target[property] = this.value; 
         chart.validateNow(); 
        }); 
       } 
      } 
     }); 
    </script> 
---c# code 
//Load Chart Event 
     [WebMethod(EnableSession = true)] 
     public static List<ChartDetails1> Chartload() 
     { 
      string Constring = System.Configuration.ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString.ToString(); 
      List<ChartDetails1> dataList = new List<ChartDetails1>(); 
      string country = string.Empty; 
      using (SqlConnection con = new SqlConnection(Constring)) 
      { 

       string StartDate = DateTime.Now.AddDays(-180).ToString("yyyy-MM-dd"); 
       string EndDate = DateTime.Now.ToString("yyyy-MM-dd"); 
       SqlCommand cmd = new SqlCommand("usp_PremiumSms_Aggrerator", con); 
       cmd.CommandTimeout = 50; 
       cmd.CommandType = CommandType.StoredProcedure; 
       cmd.Parameters.AddWithValue("@country", country); 
       cmd.Parameters.AddWithValue("@istartdate", StartDate); 
       cmd.Parameters.AddWithValue("@ienddate", EndDate); 
       cmd.Parameters.AddWithValue("@icomponents", ""); 
       con.Open(); 
       SqlDataAdapter da = new SqlDataAdapter(cmd); 
       da.SelectCommand = cmd; 
       DataTable dt = new DataTable(); 
       da.Fill(dt); 
       con.Close(); 
       foreach (DataRow dtrow in dt.Rows) 
       { 
        ChartDetails1 details = new ChartDetails1(); 
        details.date = dtrow[0].ToString(); 

        //details.CN = dtrow[0].ToString(); 

        details.CN = dtrow[1].ToString() == "" ? 0 : Convert.ToDouble(dtrow[1].ToString()); 
        details.ID = dtrow[2].ToString() == "" ? 0 : Convert.ToDouble(dtrow[2].ToString()); 
        details.KH = dtrow[3].ToString() == "" ? 0 : Convert.ToDouble(dtrow[3].ToString()); 
        details.MY = dtrow[4].ToString() == "" ? 0 : Convert.ToDouble(dtrow[4].ToString()); 
        details.TH = dtrow[5].ToString() == "" ? 0 : Convert.ToDouble(dtrow[5].ToString()); 
        details.VN = dtrow[6].ToString() == "" ? 0 : Convert.ToDouble(dtrow[6].ToString()); 
        details.SUCCESSRateCN = dtrow[8].ToString() == "" ? 0 : Convert.ToDouble(dtrow[8].ToString()); 
        details.SUCCESSRateID = dtrow[9].ToString() == "" ? 0 : Convert.ToDouble(dtrow[9].ToString()); 
        details.SUCCESSRateKH = dtrow[10].ToString() == "" ? 0 : Convert.ToDouble(dtrow[10].ToString()); 
        details.SUCCESSRateMY = dtrow[11].ToString() == "" ? 0 : Convert.ToDouble(dtrow[11].ToString()); 
        details.SUCCESSRateTH = dtrow[12].ToString() == "" ? 0 : Convert.ToDouble(dtrow[12].ToString()); 
        details.SUCCESSRateVN = dtrow[13].ToString() == "" ? 0 : Convert.ToDouble(dtrow[13].ToString()); 

        dataList.Add(details); 
       } 
      } 

      return dataList; 
     } 
    public class ChartDetails1 
     { 
      public string date { get; set; } 
      public double CN { get; set; } 
      public double ID { get; set; } 
      public double KH { get; set; } 
      public double MY { get; set; } 
      public double TH { get; set; } 
      public double VN { get; set; } 
      public double SUCCESSRateCN { get; set; } 
      public double SUCCESSRateID { get; set; } 
      public double SUCCESSRateKH { get; set; } 
      public double SUCCESSRateMY { get; set; } 
      public double SUCCESSRateTH { get; set; } 
      public double SUCCESSRateVN { get; set; } 
     }

출처

2016-04-29 04:27:51

이전 질문이지만 다른 사람에게 도움이 될 수 있습니다. 찾고있는 솔루션은 다음과 같습니다 (샘플 코드에서 "rotate": true)

출처

2017-11-01 06:17:39 arj

AmCharts 시리즈로 그룹화 된 다중 시리즈 기둥 형 차트

답변

관련 문제