多系列柱形图按AmCharts中的系列分组
你可以在AMCHATS中制作这样的东西吗？
这是我的数据：
"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
}]
3 个答案:
答案 0 :(得分：1)
使用Amcharts使用ASP.Net和C＃堆叠图表。
这是为我工作的代码。
<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; }
}
答案 1 :(得分：0)
答案 2 :(得分：0)
虽然这是一个老问题，但可能对其他人有帮助。 以下是您正在寻找的解决方案 1. Amcharts sample (clustered bar chart)（在示例代码中，注释 - ＆＃34;旋转＆＃34;：true）
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？