java怎么从数据库里获得动态数据生成统计图

java怎么从数据库里获得动态数据生成统计图,第1张

我这个是使用的echarts的饼图,如果需要使用到其他的图形,可以在echarts的官网上面去找找,上面各种的图都有例子

option = {

title : {

//图中2的位置

text: '某站点用户访问来源',

subtext: '纯属虚构',

x:'center'

},

tooltip : {

trigger: 'item',

formatter: "{a} <br/>{b} : {c} ({d}%)"

},

legend: {

orient: 'vertical',

left: 'left',

data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']//图中1的位置

},

series : [   //图中3的位置

{

name: '访问来源',

type: 'pie',

radius : '55%',

center: ['50%', '60%'],

data:[

//这下面就是你从数据库中查询的结果

{value:335, name:'直接访问'},

{value:310, name:'邮件营销'},

{value:234, name:'联盟广告'},

{value:135, name:'视频广告'},

{value:1548, name:'搜索引擎'}

],

itemStyle: {

emphasis: {

shadowBlur: 10,

shadowOffsetX: 0,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

} }]}

数据具体怎么从后台传送到前台来,楼主应该知道的吧,我这儿就不说了,望采纳!

//参考地址http://echarts.baidu.com/去网站下js控件,下面是饼图的代码,下图是我的代码效果

function query1(housetype,redStatisticsList,text0,cashingSum,tranferSum){

<!--红包发放数据-->

var myrodiusred = echarts.init(document.getElementById('mainrodius'))//ID

var redHousehold = housetype

var redMoney = redStatisticsList

var allMoney = 0//总金额

$.each(redStatisticsList,function(index,item){

allMoney =allMoney+ Number(item.value)

})

optionTwo = {

title : {

text: text0,

subtext: "总金额:"+allMoney+"\n\n提现总额:"+cashingSum+"\n\n到账总额:"+tranferSum,

x:'center'

},

tooltip : {

trigger: 'item',

formatter: "{a} <br/>{b} ({d}%)"

},

legend: {

orient: 'vertical',

left: 'left',

data: housetype

},

series : [

{

type: 'pie',

radius : '55%',

center: ['50%', '60%'],

data:redMoney,

itemStyle: {

emphasis: {

shadowBlur: 10,

shadowOffsetX: 0,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

}

}

]

}

        myrodiusred.setOption(optionTwo)

      }


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/sjk/6802897.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-28
下一篇 2023-03-28

发表评论

登录后才能评论

评论列表(0条)

保存