<! DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>淘宝数据分析可视化</title> <script src="https:/ /cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/echarts/3.6.2/echarts.min.js"></script> </head> <body> <h1 align="center ">Spark淘宝数据分析可视化图表</h1> <div class="empty"></div> <div class="contain"> <div id="box1" class="public"></div> <div id="box2" class="public"></div> <div id="box3" class="public"></div> <div id="box4" class="public"></div> </div> <script type="text/javascript"> $.getJSON( " /static/result1.json ", function(data) { var name = [ ] var value = [ ] $.each(data,function(key,val) { name. push(val[ "action" ]); value.push({ " value " : val[ "count"], "name " : val[ "action "] }) }); var mychart1 = echants. init(document.getElementById( ' box1')); //指定图表的配置项和数据 var option1 = { } </script> <script type="text/javascript"></script> <script type="text/javascript"></script> <script type="text/javascript"></script> <script type="text/javascript"></script> </body> 帮我补充var option1中的代码

时间: 2024-03-06 17:48:11 浏览: 129

HTML

淘宝数据分析.html

可以根据数据的具体情况来补充相应的代码，以下是一些可能会用到的常见配置项和数据设置： 1. 饼图配置项和数据设置： ``` var option1 = { title : { text: '用户行为统计', x:'center' }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { orient: 'vertical', left: 'left', data: name }, series : [ { name: '用户行为', type: 'pie', radius : '55%', center: ['50%', '60%'], data: value.sort(function (a, b) { return a.value - b.value; }), itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; ``` 2. 柱状图配置项和数据设置： ``` var option1 = { title: { text: '用户行为统计', x: 'center' }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, legend: { data: name, x: 'left' }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'category', data: name }, yAxis: { type: 'value' }, series: [ { name: '用户行为', type: 'bar', data: value, itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; ``` 3. 折线图配置项和数据设置： ``` var option1 = { title: { text: '用户行为统计', x: 'center' }, tooltip: { trigger: 'axis' }, legend: { data: name, x: 'left' }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'category', boundaryGap: false, data: name }, yAxis: { type: 'value' }, series: [ { name: '用户行为', type: 'line', stack: '总量', data: value, itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; ```

阅读全文

相关推荐

CSDN会员

开通CSDN年卡参与万元壕礼抽奖

海量 VIP免费资源千本正版电子书商城会员专享价千门课程&专栏

全年可省5,000元立即开通