Echarts动态数据折线图

最新推荐文章于 2024-08-08 18:06:31 发布

昵称全重复

最新推荐文章于 2024-08-08 18:06:31 发布

阅读量1w

点赞数 6

分类专栏： Demo

本文链接：https://blog.csdn.net/liuzishang/article/details/93598244

版权

这篇博客详细介绍了如何使用Echarts创建动态数据折线图。从添加Echarts引用，构建HTML区域，到设置后台数据接口，以及利用window.onload进行JS操作。博主强调了初始化Echarts和option的重要性，并讲解了参数设置，特别是循环获取数据并更新折线图的实现步骤。

摘要由CSDN通过智能技术生成

1.添加引用：

 <script src="~/Scripts/jquery-3.3.1.js"></script>
 <script src="~/incubator-echarts-master/dist/echarts.min.js"></script>

2.添加html区域

 <div id="main" style="width:100%;height:500px;"></div>

3.添加后台数据接口原本想做成每次返回多个数据的后来改成了一个

 [HttpPost]
        public ActionResult AsycData() {
            var result = GetNums();
            return Json(result, JsonRequestBehavior.AllowGet);
        }
        public List<int> GetNums() {
            List<int> result = new List<int>();
            Hashtable hashtable = new Hashtable();
            Random rm = new Random();
            int RmNum = 1;
            for (int i = 0; hashtable.Count < RmNum; i++)
            {
                int nValue = rm.Next(100);
                if (!