highcharts mysql jsp_(四)、读取数据库数据并在HighCharts上显示

X轴: xAxis: { categories: ['周一', '周二', '周三', '周四', '周五', '周六', '周日' ], //X轴的坐标值 title: {text: '周数'}, //X轴坐标标题 } Y轴: yAxis: { title: {text: '人数(人)'}, //Y轴坐标标题 } 主标题: title: { text: '图表主标题' }, //

X轴:

xAxis: {

categories: ['周一', '周二', '周三', '周四', '周五', '周六', '周日' ], //X轴的坐标值

title: {text: '周数'}, //X轴坐标标题

}

Y轴:

yAxis: {

title: {text: '人数(人)'}, //Y轴坐标标题

}

主标题:

title: { text: '图表主标题' }, //图表主标题

副标题:

subtitle: {text: '图表子标题' }, //图表副标题

Y轴数据:

series:[{ name: '人数', data: [20, 40, 30, 90, 100, 60, 50] }]

这些值我们都可以从数据库获得数据,然后动态绑定上去即可,这里后台代码中最常用的是StringBuilder,通过它来拼凑出要绑定的数据

X轴:

xAxis: {

categories:

, //X轴的坐标值

title:

, //X轴坐标标题

}

Y轴:

yAxis: {

title:

, //Y轴坐标标题

}

主标题:

title:

, //图表主标题

副标题:

subtitle:

, //图表副标题

Y轴数据:

series:

下面给出获取X轴、Y轴、标题的方法:

public string XAxisCategories = ""; //X轴

public StringBuilder seriesData = new StringBuilder(); //Y轴

public string title = ""; // 图表标题

...

标题获取

title = "{text: '" + ""+site_name

+""+"'}"; //红色标记的部分是从数据库动态获取的,怎么获取,该获取什么,根据你需要,你应该懂的

X轴获取:

StringBuilder xAxisCategories = new StringBuilder();

xAxisCategories.Append("[");

...

foreach (DataRowView drv in ds.Tables[0].DefaultView)

{

xAxisCategories.Append("'");

xAxisCategories.Append(drv["周数"] == null ? "0" : drv["周数"].ToString());

xAxisCategories.Append("',");

}

XAxisCategories = xAxisCategories.Replace(",", "", xAxisCategories.Length - 1, 1).Append("]").ToString(); //这里是去掉最后一个多余的逗号(,)

Y轴获取:

StringBuilder yAxisCategories = new StringBuilder();

...

foreach (DataRowView drv in ds.Tables[0].DefaultView)

{

yAxisCategories.Append(drv["人数"] == null ? "0" : drv["人数"].ToString());

yAxisCategories.Append(",");

}

seriesData.Append("[{name: '人数',type: 'spline',data: [");

seriesData.Append(yAxisCategories.Replace(",", "", yAxisCategories.Length - 1, 1)); //去除最后一个逗号(,)

seriesData.Append("]}]");

f68f2add0b68e4f9810432fce46917b7.png

本文原创发布php中文网,转载请注明出处,感谢您的尊重!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值