echarts实现rose玫瑰扇形图表效果代码
代码语言:html
所属分类:图表
代码描述:echarts实现rose玫瑰扇形图表效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { background-color: #fff; font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #000; } a:link, a:visited { color: #4682b4; } a:hover { color: #4169e1; } #main { width: 800px; height: 400px; } </style> </head> <body > <!-- Must specify width and height of DOM, ref CSS --> <div id="main"></div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/echarts.5.1.1.js"></script> <script > // based ready dom, initialize echarts instance var myChart = echarts.init(document.getElementById('main')); // Specify configurations and data graphs var option = { title: { text: 'Nightingale Roses', subtext: 'Fictitious', x: 'center' }, tooltip: { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { x: 'center', y: 'bottom', data: ['rose1', 'rose2', 'rose3', 'rose4', 'rose5', 'rose6', 'rose7', 'rose8'] }, toolbox: { show: true, feature: { mark: { show: true }, dataView: { show: true, readOnly: false }, magicType: { show: true, type: ['pie', 'funnel'] },.........完整代码请登录后点击上方下载按钮下载查看
网友评论0