ECharts制作报表模板--.NET

最新推荐文章于 2025-03-26 15:27:05 发布
最新推荐文章于 2025-03-26 15:27:05 发布
阅读量1.3k 收藏 1
点赞数
文章标签： 趋势图
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/LazyTojava/article/details/71374959
版权
本文介绍了一个用于统计子系统不合格品问题的网页应用，包括HTML布局、JS交互逻辑及后端处理流程。该应用利用ECharts展示图表，并通过AJAX获取数据。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

原文出自：http://blog.youkuaiyun.com/makang456/article/details/52873121

【效果】


【实例】

    一、html代码

[html]  view plain  copy
  在CODE上查看代码片 派生到我的代码片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">-  
  2.     <!--整体div-->  
  3.     <div id="zhengti"  style="width:900px;margin: 0 auto;margin-bottom: 10px;margin-top: 40px;">  
  4.            
  5.          <!--图形div visible="false"-->  
  6.          <div  id="main"  style="width:800px;height:450px; float:left; display:inline; margin-bottom:30px;"></div>  
  7.         <br />  
  8.          <!--列表div-->  
  9.          <div id="editor-grid" style=" border-top:none; width:800px;height:300px;"></div>  
  10.   
  11.     </div>   
  12. -</span>  

    二、js代码

[javascript]  view plain  copy
  在CODE上查看代码片 派生到我的代码片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">-  
  2.   
  3.          //页面刷新的方法加载  
  4.          $(document).ready(function () {  
  5.              //获取隐藏控件中的值  
  6.              var rejctphenomenontypename = "";  
  7.   
  8.              //准备数据  
  9.              var json;  
  10.              $.ajax({  
  11.                  url: '../ashx/chartashx/reject_belongs_system_charts.ashx?cmd=cmd&rejctphenomenontypename=' + rejctphenomenontypename,  
  12.                  type: 'post',  
  13.                  dataType: 'json',  
  14.                  async: false,  
  15.                  success: function (data) {  
  16.                      json = data;  
  17.                  }, error: function (data) {  
  18.                      alert("加载失败，请联系管理员！");  
  19.                  }  
  20.              });  
  21.              loadcharts(json);  
  22.              loadList(json);  
  23.              document.title = "问题汇总";  
  24.          });  
  25.   
  26.          //展示图标function  
  27.          function loadcharts(json) {  
  28.   
  29.              //图表展示  
  30.              var myChart1 = echarts.init(document.getElementById('main'));  
  31.   
  32.              option = {  
  33.   
  34.                  //图表标题    
  35.                  title: {  
  36.   
  37.                      text: "子系统不合格品问题统计", //正标题    
  38.   
  39.                      x: "center", //标题水平方向位置    
  40.                      //正标题样式    
  41.                      textStyle: {  
  42.                          fontSize: 20  
  43.                      },  
  44.                      //副标题样式    
  45.                      subtextStyle: {  
  46.                          fontSize: 12,  
  47.                          color: "red"  
  48.                      }  
  49.                  },  
  50.                  tooltip: {  
  51.                      trigger: 'axis',  
  52.                      axisPointer: {            // 坐标轴指示器，坐标轴触发有效  
  53.                          type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'  
  54.                      }  
  55.                  },  
  56.   
  57.                  //工具箱配置    
  58.                  toolbox: {  
  59.                      show: true,  
  60.                      feature: {  
  61.                          mark: { show: true }, // 辅助线标志，上图icon左数1/2/3，分别是启用，删除上一条，删除全部    
  62.                          dataView: { show: true, readOnly: false },// 数据视图，上图icon左数8，打开数据视图    
  63.                          magicType: { show: true, type: ['line', 'bar', 'stack', 'tiled'] },// 图表类型切换，当前仅支持直角系下的折线图、柱状图转换，上图icon左数6/7，分别是切换折线图，切换柱形图    
  64.                          restore: { show: true }, // 还原，复位原始图表，上图icon左数9，还原    
  65.                          saveAsImage: { show: true } // 保存为图片，上图icon左数10，保存    
  66.                      }  
  67.                  },  
  68.   
  69.                  //图例内容以及位置  
  70.                  legend: {  
  71.                      //加载图例内容，这里json.a是对应的数组元素  
  72.                      data: json.tuli,  
  73.                      y: "bottom"  
  74.   
  75.                  },  
  76.                  grid: {  
  77.                      left: '0%',  
  78.                      right: '0%',  
  79.                      bottom: '20%',  
  80.                      containLabel: true  
  81.                  },  
  82.                  //x轴的数据  
  83.                  xAxis: [  
  84.                      {  
  85.                          axisLabel: {  
  86.                              rotate: 60,  
  87.                              interval: 0  
  88.                          },  
  89.                          type: 'category',  
  90.                          //加载x轴的数据，这里  
  91.                          //data: ['部门1', '部门2', '部门3', '部门4'],  
  92.                          data: json.xzhou,  
  93.                          name: "部门"  
  94.   
  95.                      }  
  96.                  ],  
  97.                  //y轴的数据  
  98.                  yAxis: [  
  99.                      {  
  100.                          type: 'value',  
  101.                          name: "数值"  
  102.                      }  
  103.                  ],  
  104.                  //图中的数据，这里是通过匹配的来的！  
  105.                  series: json.tushuju  
  106.              };  
  107.   
  108.   
  109.              //将配置好的图加载到div中  
  110.              myChart1.setOption(option);  
  111.   
  112.              //单击穿透  
  113.              myChart1.on('click', function (param) {  
  114.                   
  115.                  var rejectbelongssystemname = param.name;  
  116.                  //window.open("reject_phenomenon_type_charts.aspx?rejectbelongssystemname=" + rejectbelongssystemname);  
  117.                  window.open("reject_phenomenon_type_charts1.aspx?rejectbelongssystemname=" + rejectbelongssystemname, 'newwindow', 'height=672,width=1182,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no, location=no,status=no')  
  118.              });  
  119.   
  120.          }  
  121.   
  122.          //加载列表function  
  123.          function loadList(json) {  
  124.              var columns = [json.listbiaotou];  
  125.   
  126.              //gridData属性  
  127.              InitGrid = {  
  128.                  //nowrap: true,  
  129.                  //autoRowHeight: true,  
  130.                  striped: true,  
  131.                  singleSelect: true,  
  132.                  // url: Init.url + '&cmd=list',  
  133.                  //data: [{ "Id": 1, "region": "8号线", "SR": 100, "ST": 80 }, { "Id": 2, "region": " 北京亦庄线", "SR": 40, "ST": 80 }, { "Id": 3, "region": " 重庆3号线", "SR": 30, "ST": 80 }, { "Id": 4, "region": " 成都3号线", "SR": 10, "ST": 80 }, { "Id": 5, "region": " 大连线", "SR": 10, "ST": 80 }],  
  134.                  data: json.listshuju,  
  135.                  fitColumns: true,  
  136.                  idField: 'Id',  
  137.                  pagination: true,  
  138.                  rownumbers: true,  
  139.                  pageSize: 10,  
  140.                  pageList: [5, 10, 15, 20, 50, 80, 200],  
  141.                  //toolbar: toolbar,  
  142.                  columns: columns,  
  143.                  // fit: true,  
  144.                  //border: true  
  145.              }  
  146.   
  147.              //创建数据表格  
  148.              dataGrid = $("#editor-grid").datagrid(InitGrid);  
  149.   
  150.          }  
  151. -</span>  

    三、一般处理程序代码

[csharp]  view plain  copy
  在CODE上查看代码片 派生到我的代码片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">-  
  2. #region 3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  3.         /// <summary>  
  4.         /// 3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  5.         /// </summary>  
  6.         /// <returns></returns>  
  7.         private string queryList(string rejctphenomenontypename)  
  8.         {  
  9.   
  10.             //实例化BLL层  
  11.             ProblemSpotBLL problemspotbll = new ProblemSpotBLL();  
  12.   
  13.             //查询数据  
  14.             DataSet projectProblemList = problemspotbll.queryrejectbelongssystemList(rejctphenomenontypename);  
  15.   
  16.             DataTable tables2 = new DataTable();  
  17.             tables2.Columns.Add("producttype", typeof(String));  
  18.             DataRow row = tables2.NewRow();  
  19.             row["producttype"] = "不合格品";  
  20.             tables2.Rows.Add(row);  
  21.             projectProblemList.Tables.Add(tables2);  
  22.   
  23.             StringBuilder sb = new StringBuilder();  
  24.             String resultStr = "";  
  25.             if (projectProblemList.Tables.Count > 0)  
  26.             {  
  27.                 //总括号  
  28.                 sb.Append("{");  
  29.                 #region 1、图例项对象数组  
  30.                 //第一个图例项对象数组  
  31.                 sb.Append("\"tuli\":[");  
  32.                 for (int i = 0; i < projectProblemList.Tables[2].Rows.Count; i++)  
  33.                 {  
  34.                     sb.Append("\"" + projectProblemList.Tables[2].Rows[i][0] + "\",");  
  35.                 }  
  36.                 sb.Remove(sb.Length - 1, 1);  
  37.                 sb.Append("],");  
  38.                 #endregion  
  39.  
  40.                 #region 2、x轴中的项目  
  41.                 //第一个图例项对象数组  
  42.                 sb.Append("\"xzhou\":[");  
  43.                 for (int i = 0; i < projectProblemList.Tables[1].Rows.Count; i++)  
  44.                 {  
  45.                     sb.Append("\"" + projectProblemList.Tables[1].Rows[i][0] + "\",");  
  46.                 }  
  47.                 sb.Remove(sb.Length - 1, 1);  
  48.                 sb.Append("],");  
  49.                 #endregion  
  50.  
  51.                 #region 3、图中的数据  
  52.                 //第一个图例项对象数组  
  53.                 sb.Append("\"tushuju\":[");  
  54.                 //最外层循环，循环项目  
  55.                 for (int i = 0; i < projectProblemList.Tables[2].Rows.Count; i++)  
  56.                 {  
  57.                     sb.Append("{");  
  58.                     sb.Append("\"name\":\"" + projectProblemList.Tables[2].Rows[i][0] + "\",");  
  59.                     sb.Append("\"type\":\"bar\",");  
  60.                     sb.Append("\"data\":[");  
  61.                     //定义一个临时数组，来存储下面要获得的数据  
  62.                     int[] arraylist = new int[projectProblemList.Tables[1].Rows.Count];  
  63.                     //根据项目匹配总数据中的值  
  64.                     for (int j = 0; j < projectProblemList.Tables[0].Rows.Count; j++)  
  65.                     {  
  66.                         //如果有相等的值，则进入循环部门(这里肯定会至少有一个项目名称与之匹配，因为项目名称是根据这个datatable去重筛选出来的)  
  67.                         string adsf = projectProblemList.Tables[0].Rows[j][1].ToString();  
  68.                         string asdfasdf = projectProblemList.Tables[2].Rows[i][0].ToString();  
  69.                         if (projectProblemList.Tables[0].Rows[j][1].ToString() == projectProblemList.Tables[2].Rows[i][0].ToString())  
  70.                         {  
  71.   
  72.                             //通过循环产品，向数组中加入内容  
  73.                             for (int k = 0; k < projectProblemList.Tables[1].Rows.Count; k++)  
  74.                             {  
  75.                                 if (projectProblemList.Tables[1].Rows[k][0].ToString() == projectProblemList.Tables[0].Rows[j][0].ToString())  
  76.                                 {  
  77.                                     arraylist[k] = (int)projectProblemList.Tables[0].Rows[j][2];  
  78.                                 }  
  79.   
  80.                             }  
  81.                         }  
  82.   
  83.                     }  
  84.                     //循环将数组拼接到字符串中  
  85.                     for (int k = 0; k < arraylist.Length; k++)  
  86.                     {  
  87.                         sb.Append("\"" + arraylist[k] + "\",");  
  88.                     }  
  89.                     sb.Remove(sb.Length - 1, 1);  
  90.                     sb.Append("]");  
  91.                     sb.Append("},");  
  92.                 }  
  93.                 sb.Remove(sb.Length - 1, 1);  
  94.                 sb.Append("],");  
  95.  
  96.                 #endregion  
  97.  
  98.                 #region 4、列表中的表头  
  99.                 double kuandu = (800 - 30) / (projectProblemList.Tables[1].Rows.Count + 1) - 3;  
  100.                 //第一个图例项对象数组  
  101.                 sb.Append("\"listbiaotou\":[");  
  102.                 sb.Append("{");  
  103.                 sb.Append("\"field\":\"id\",");  
  104.                 sb.Append("\"hidden\":\"true\"");  
  105.                 sb.Append("},");  
  106.                 sb.Append("{");  
  107.                 sb.Append("\"field\":\"region\",");  
  108.                 sb.Append("\"title\":\"项目\",");  
  109.                 sb.Append("\"align\":\"center\",");  
  110.                 sb.Append("\"width\":\"" + kuandu + "\"");  
  111.                 sb.Append("},");  
  112.   
  113.                 for (int i = 0; i < projectProblemList.Tables[1].Rows.Count; i++)  
  114.                 {  
  115.                     sb.Append("{");  
  116.                     sb.Append("\"field\":\"" + projectProblemList.Tables[1].Rows[i][0] + "\",");  
  117.                     sb.Append("\"title\":\"" + projectProblemList.Tables[1].Rows[i][0] + "\",");  
  118.                     sb.Append("\"align\":\"center\",");  
  119.                     sb.Append("\"width\":\"" + kuandu + "\"");  
  120.                     sb.Append("},");  
  121.                 }  
  122.                 sb.Remove(sb.Length - 1, 1);  
  123.                 sb.Append("],");  
  124.                 #endregion  
  125.  
  126.                 #region 5、列表中的数据  
  127.                 //第一个图例项对象数组  
  128.                 sb.Append("\"listshuju\":[");  
  129.                 //最外层循环，循环项目  
  130.                 for (int i = 0; i < projectProblemList.Tables[2].Rows.Count; i++)  
  131.                 {  
  132.                     sb.Append("{");  
  133.                     sb.Append("\"id\":\"" + i + "\",");  
  134.                     sb.Append("\"region\":\"" + projectProblemList.Tables[2].Rows[i][0] + "\",");  
  135.                     //定义一个临时数组，来存储下面要获得的数据  
  136.                     int[] arraylist = new int[projectProblemList.Tables[1].Rows.Count];  
  137.                     //根据项目匹配总数据中的值  
  138.                     for (int j = 0; j < projectProblemList.Tables[0].Rows.Count; j++)  
  139.                     {  
  140.                         //如果有相等的值，则进入循环部门(这里肯定会至少有一个项目名称与之匹配，因为项目名称是根据这个datatable去重筛选出来的)  
  141.                         string adsf = projectProblemList.Tables[0].Rows[j][1].ToString();  
  142.                         string asdfasdf = projectProblemList.Tables[2].Rows[i][0].ToString();  
  143.                         if (projectProblemList.Tables[0].Rows[j][1].ToString() == projectProblemList.Tables[2].Rows[i][0].ToString())  
  144.                         {  
  145.   
  146.                             //通过循环部门，向数组中加入内容  
  147.                             for (int k = 0; k < projectProblemList.Tables[1].Rows.Count; k++)  
  148.                             {  
  149.                                 if (projectProblemList.Tables[1].Rows[k][0].ToString() == projectProblemList.Tables[0].Rows[j][0].ToString())  
  150.                                 {  
  151.   
  152.                                     arraylist[k] = (int)projectProblemList.Tables[0].Rows[j][2];  
  153.                                 }  
  154.   
  155.                             }  
  156.                         }  
  157.   
  158.                     }  
  159.                     //循环将数组拼接到字符串中  
  160.                     for (int k = 0; k < projectProblemList.Tables[1].Rows.Count; k++)  
  161.                     {  
  162.                         sb.Append("\"" + projectProblemList.Tables[1].Rows[k][0] + "\":\"" + arraylist[k] + "\",");  
  163.                     }  
  164.                     sb.Remove(sb.Length - 1, 1);  
  165.                     sb.Append("},");  
  166.                 }  
  167.                 sb.Remove(sb.Length - 1, 1);  
  168.                 sb.Append("]");  
  169.  
  170.                 #endregion  
  171.   
  172.                 //最后的括号！  
  173.                 sb.Append("}");  
  174.   
  175.                 resultStr = sb.ToString();  
  176.             }  
  177.           
  178.                         
  179.             return resultStr;  
  180.         }  
  181.         #endregion  
  182. -</span>  

    四、BLL层代码

[csharp]  view plain  copy
  在CODE上查看代码片 派生到我的代码片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">-  
  2. #region 最终报表3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  3.         /// <summary>  
  4.         /// 最终报表3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  5.         /// </summary>  
  6.         /// <returns></returns>  
  7.         public DataSet queryrejectbelongssystemList(string rejctphenomenontypename)  
  8.         {  
  9.             return dal.GetrejectbelongssystemList(rejctphenomenontypename);  
  10.         }  
  11.         #endregion   
  12. -</span>  

    五、DAL层代码

[csharp]  view plain  copy
  在CODE上查看代码片 派生到我的代码片
  1. <span style="font-family:KaiTi_GB2312;font-size:18px;">-  
  2.  #region 最终报表3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  3.         /// <summary>  
  4.         /// 3、子系统不合格品问题统计-马康-2016年9月28日17:16:23  
  5.         /// </summary>  
  6.         /// <returns></returns>  
  7.         public DataSet GetrejectbelongssystemList(string rejctphenomenontypename)  
  8.         {  
  9.             StringBuilder builder = new StringBuilder();  
  10.             if (rejctphenomenontypename =="")  
  11.             {  
  12.                 //总数据  
  13.                 builder.Append(" SELECT sELECT3,replace(IsActive,'1','不合格品'),COUNT(sELECT3) num FROM Pts_Problems WHERE ProjectID IN (197, 29) AND ProblemStateID NOT IN (1870, 250) AND Select3 IN ('VOBC子系统','DCS子系统','ATS子系统','MSS子系统','CI子系统','ZC/DSU子系统')  GROUP BY sELECT3,IsActive ");  
  14.   
  15.                 //所属系统个数  
  16.                 builder.Append("   SELECT DISTINCT(sELECT3) FROM Pts_Problems WHERE ProjectID IN (197, 29) AND ProblemStateID NOT IN (1870, 250) AND Select3 IN ('VOBC子系统','DCS子系统','ATS子系统','MSS子系统','CI子系统','ZC/DSU子系统')  GROUP BY sELECT3  ");  
  17.   
  18.             }  
  19.             else  
  20.             {  
  21.                 //总数据  
  22.                 builder.Append(" SELECT sELECT3,replace(IsActive,'1','不合格品'),COUNT(sELECT3) num FROM Pts_Problems WHERE ProjectID IN (197, 29) AND ProblemStateID NOT IN (1870, 250)  and MultiSelect1 = '" + rejctphenomenontypename + ";' AND Select3 IN ('VOBC子系统','DCS子系统','ATS子系统','MSS子系统','CI子系统','ZC/DSU子系统')  GROUP BY sELECT3,IsActive ");  
  23.   
  24.                 //所属系统个数  
  25.                 builder.Append("   SELECT DISTINCT(sELECT3) FROM Pts_Problems WHERE ProjectID IN (197, 29) AND ProblemStateID NOT IN (1870, 250) AND Select3 IN ('VOBC子系统','DCS子系统','ATS子系统','MSS子系统','CI子系统','ZC/DSU子系统')  GROUP BY sELECT3  ");  
  26.   
  27.             }  
  28.             
  29.             return SqlHelper.ExecuteDataset(sqlConnstring, CommandType.Text, builder.ToString());  
  30.         }  
  31. -</span>  

LazyTojava
关注
echarts模版
07-22
echarts模版
ECharts制作报表模板
热门推荐
一直在奋起，一直在路上
10-20 2万+
最近公司的问题汇总平台差不多接近尾声，回顾前段时间领导任命做的报表真是别有一番成长波折；在这之前以为问题汇总平台就差不多完结了，结果原来压轴的在后面呢，报表的设计涵盖了本平台80%的核心内容，既然这么重要就更得放上十足的精神干了O(∩_∩)O~
Echarts使用
最新发布
weixin_40017062的博客
03-26 980
Echarts 生成折线图、柱状图、饼状图、地图、热力图、轨迹图、散点图，整理学习下。
echarts .NET类库开源
weixin_34209406的博客
03-03 316
前言： 　　２０１２年从长沙跑到深圳，２０１６年又从深圳回到长沙，兜兜转转一圈，又回到了原点．４年在深圳就呆了一家公司，回长沙也是因为深圳公司无力为继，长沙股东老板挽留，想想自己年纪也不小了．就回来了，在长沙工作几月，也没什么太多的不适应．不用赶着项目上线，不用加班，想想其实也不错.　 　　从１２年在长沙就想写点开源的东西，不过实在不敢献丑．这次机缘巧合，有个朋友一个项目需要用到大量报表，我找...
ECharts 图形化看板 模板（简单实用）
qq_65142821的博客
06-04 1202
select: {name: "商品展示",},},
echarts报表展示
qq_38761664的博客
09-12 737
总结了一下，echarts公共可配置x项和一些私有配置项，看代码做 let echarts = require('echarts/lib/echarts'); const draw={ //基础属性配置项公有 drawBase(currentAttr){ var base={}; return base={ title : {            text: current
Echart的基础开发模板
weixin_33813128的博客
08-02 228
1 &lt;!DOCTYPE html&gt; 2 &lt;html lang="en"&gt; 3 &lt;head&gt; 4 &lt;meta charset="UTF-8"&gt; 5 &lt;title&gt;Echarts图表&lt;/title&gt; 6 &lt;script src="../js/ec
报表技术-图形报表-Echarts(含代码、文档).zip
11-21
本资料包包含了ECharts的图形报表相关的代码示例和文档，是学习和使用ECharts进行数据可视化的宝贵资源。 一、ECharts的基本概念与特点 1. 基本概念：ECharts是一个使用HTML5 Canvas绘制图表的开源库，支持多种...
python + django + echarts做报表展示 https://blog.csdn.net/m0_51197424
03-29
标题中的“python + django + echarts做报表展示”揭示了一个基于Python的Web开发项目，其中使用了Django框架和ECharts库来创建数据可视化报表。这个项目可能涉及到以下几个关键知识点： 1. Python：Python是一种...
HTML5图表框架echarts实战项目(50套源码)，大数据平台展示可视化效果
02-09
最近接了个任务需要用H5在前台两个大电视上做两页数据展示公司的产品数据，效果要高大上，还好之前接触过HTML5，所以第一时间想到就是echarts，这个框架对于数据展示尤其图表类处理的还是非常强大和炫酷的。...
android动态生成echarts图形报表
05-10
在压缩包中的`EchartST`文件可能包含了示例代码、HTML模板或完整的项目结构，你可以参考这些文件来更好地理解和实现Android动态生成Echarts图形报表的功能。在实际开发中，你还需要根据具体需求调整图表样式、响应式...
ECHARTS模板
03-18
4个ECHARTS模板，基于大数据DASHBOARD的几个漂亮的ECHART模板，
Echarts实现图形报表
04-26
java+mysql实现图形报表，附带数据库代码。用servlet实现
echarts模板.rar
08-21
主要是一些有关echarts的模板，方便使用，避免浪费大量时间去做，并不需要积分
echarts模版.rar
06-24
echarts各类模版，仅仅个人使用
Echarts模板20套精华.zip
09-24
最新Echarts的开发前端样式 +完整脚本+样式+图片20套，做报表再也不愁了。
.Net 5 下的可打印图文报表解决方案
网尘的技术专栏
02-06 987
最近需要处理一个有关打印的问题，有一些界面上的要求。首要选择是ECharts渲染图，因为其界面的表现是非常酷的；其次要求支持渲染表格；再次是需要可以打印、导出为word、pdf、excel等格式，有关打印，之前也处理过很多，最近的应用基本都是基于Fast-report，利用后台产生pdf完成的，当然前端也有很多的插件，比如vue-print等，针对这个功能，又有什么更好的方案呢？ 先比对几个商业产品看看，毕竟商业版的比较重产品化。 1、纯后端方案 1.1、Fastreport.Net 最新版本支持.NE.
echarts模板
longbao_1的博客
11-22 485
一、成果样式 二、代码配置 数据内容 cdata: { category: [ "50", "31", "42", "33", "54", "55", "56", "57", "58", "59", "60", "11", .
echarts模板 html,echarts5.html
weixin_39638086的博客
06-26 261
后台登录-X-admin2.2特别声明：ECharts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器(IE8/9/10/11，Chrome，Firefox，Safari等)，底层依赖轻量级的 Canvas 类库 ZRender，提供直观，生动，可交互，可高度个性化定制的数据可视化图表。如需使用，详细了解可以访问官网 ECharts。 x-ad...
Echarts报表页面设计与实现方法
1. **报表生成器**：使用报表工具如FineReport、润干报表等，可以设计模板并设定数据源，然后将ECharts图表嵌入到报表模板中。 2. **后端数据处理**：报表工具后端将处理数据聚合、转换等任务，然后将结果传递给前端...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值