回到頂部

MVC實現EChatrs動態折線圖

時間:3年前   作者:個人天使   瀏覽:626   [站內原創,轉載請注明出處]

標簽: ECharts   ASP.NET  

namespace Echarts數據搭配.Controllers
{
    public class HomeController : Controller
    {
        Random r = new Random();
        int index = 0;
        #region 靜態帶面積折線圖
        public ActionResult Index()
        {
            return View();
        }
        public JsonResult GetJson()
        {
            int[] data1 = { 120, 132, 101, 134, 90, 230, 210 };
            int[] data2 = { 20, 232, 11, 144, 90, 30, 90 };
            int[] data3 = { 180, 12, 161, 84, 60, 230, 10 };
            var id1 = new { name = "測試數據1", data = data1, };
            var id2 = new { name = "測試數據2", data = data2, };
            var id3 = new { name = "測試數據3", data = data3, };
            List<object> data = new List<object>();
            data.Add(id1);
            data.Add(id2);
            data.Add(id3);
            string[] xcontent = { "a", "b", "c", "d", "e", "f", "g" };
            var tld = new
            {
                xcontent = xcontent,
                data = data
            };
            return Json(tld);
        }
        #endregion
        #region 動態折線圖 多條
        public ActionResult NextLine()
        {



            return View();
        }
        public ActionResult GetNextLineJson()
        {

            List<Record> records = new List<Controllers.Record>();
            for (int i = 0; i < 200; i++)
            {
                records.Add(new Record(i, r));
            }

            DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(List<Record>));
            MemoryStream stream = new MemoryStream();
            serializer.WriteObject(stream, records);
            byte[] dataBytes = new byte[stream.Length];
            stream.Position = 0;
            stream.Read(dataBytes, 0, (int)stream.Length);
            string jsonstring = Encoding.UTF8.GetString(dataBytes);
            return Content(jsonstring);
        }
        public ActionResult GetNetxtLineAjax()
        {
            index++;
            var records = new Record(index, r);
            DataContractJsonSerializer serializer = new DataContractJsonSerializer(typeof(Record));
            MemoryStream stream = new MemoryStream();
            serializer.WriteObject(stream, records);
            byte[] dataBytes = new byte[stream.Length];
            stream.Position = 0;
            stream.Read(dataBytes, 0, (int)stream.Length);
            string jsonstring = Encoding.UTF8.GetString(dataBytes);

            return Content(jsonstring);
        }
        #endregion
        #region 動態折線圖 一條
        public ActionResult NetTowLine()
        {
            return View();
        }
        #endregion
    }
    [Serializable]
    public class Record
    {

        private string taizhan_num;    //臺站名
        private String tem;            //溫度
        private String hum;            //濕度
        private String pa;            //壓強
        private String rain;        //雨量
        private String win_dir;        //風向
        private String win_sp;        //風速
        private String dateStr;        //觀測日期(用于Echarts顯示格式)
        private DateTime date;        //觀測日期(原始格式)

        public Record(int i, Random r)
        {
            this.taizhan_num = "臺站名" + i;
            date = DateTime.Now;
            tem = (r.Next(0, 100)).ToString();
            hum = (r.Next(0, 100)).ToString();
            pa = (r.Next(0, 1000)).ToString();
            rain = "0.0";
            win_dir = (r.Next(0, 100)).ToString();
            win_sp = (r.NextDouble() * 20).ToString();
            dateStr = date.ToString();



        }
        /// <summary>
        /// @return 觀測日期值
        /// </summary>
        /// <returns></returns>
        public String getDateStr()
        {
            return dateStr;
        }
        /// <summary>
        /// 設置觀測日期(用于echarts圖表展示
        /// </summary>
        /// <param name="dateStr">待設置觀測日期值</param>
        public void setDateStr(String dateStr)
        {
            this.dateStr = dateStr;
        }
        /// <summary>
        /// 獲取產生該觀測記錄的臺站名稱;       
        /// </summary>
        /// <returns>臺站名稱</returns>
        public string getTaizhan_num()
        {
            return taizhan_num;
        }

        /// <summary>
        /// 設置產生該觀測記錄的臺站名稱;
        /// </summary>
        /// <param name="taizhan_num">待設置臺站名稱</param>
        public void setTaizhan_num(String taizhan_num)
        {
            this.taizhan_num = taizhan_num;
        }

        /// <summary>
        /// 獲取溫度;
        /// </summary>
        /// <returns>溫度值</returns>
        public String getTem()
        {
            return tem;
        }

        /// <summary>
        /// 設置溫度;
        /// </summary>
        /// <param name="tem">待設置溫度值</param>
        public void setTem(String tem)
        {
            this.tem = tem;
        }

        /// <summary>
        /// 獲取濕度;
        ///</summary>
        /// <returns>濕度值</returns>
        public String getHum()
        {
            return hum;
        }

        /// <summary>
        /// 設置濕度;
        /// </summary>
        /// <param name="hum">待設置濕度值</param>
        public void setHum(String hum)
        {
            this.hum = hum;
        }

        /// <summary>
        /// 獲取壓強;
        /// </summary>
        /// <returns>壓強值</returns>
        public String getPa()
        {
            return pa;
        }

        /// <summary>
        /// 設置壓強;
        /// </summary>
        /// <param name="pa">待設置壓強值</param>
        public void setPa(String pa)
        {
            this.pa = pa;
        }

        /// <summary>
        ///  獲取雨量;
        /// </summary>
        /// <returns>雨量值</returns>
        public String getRain()
        {
            return rain;
        }

        /// <summary>
        /// 設置雨量;
        /// </summary>
        /// <param name="rain">待設置雨量值</param>
        public void setRain(String rain)
        {
            this.rain = rain;
        }

        /// <summary>
        /// 獲取風向;
        /// </summary>
        /// <returns>風向值</returns>
        public String getWin_dir()
        {
            return win_dir;
        }

        /// <summary>
        /// 設置風向;
        /// </summary>
        /// <param name="win_dir">待設置風向值</param>
        public void setWin_dir(String win_dir)
        {
            this.win_dir = win_dir;
        }

        /// <summary>
        /// 獲取風速;
        /// </summary>
        /// <returns>風速值</returns>
        public String getWin_sp()
        {
            return win_sp;
        }

        /// <summary>
        /// 設置風向;
        /// </summary>
        /// <param name="win_sp">待設置風向值</param>
        public void setWin_sp(String win_sp)
        {
            this.win_sp = win_sp;
        }

        /// <summary>
        /// 獲取觀測日期;
        /// </summary>
        /// <returns>觀測日期</returns>
        public DateTime getDate()
        {
            return date;
        }

        /// <summary>
        /// 設置觀測日期; 
        /// </summary>
        /// <param name="date">觀測日期值</param>
        public void setDate(DateTime date)
        {
            this.date = date;
        }


    }



效果圖展示:

圖一:

圖二:

圖三:






個人天使最后編輯于:3年前

內容均為作者獨立觀點,不代表八零IT人立場,如涉及侵權,請及時告知。

評論努力加載中...
暫無評論
暫無評論

手機掃碼閱讀

熱門相關

加載中...
關于我們   聯系我們   申請友鏈   贊助記錄   站點地圖
? 2014 - 2017 www.1255315.live All Rights Reserved. 京ICP備14042174號-1
本站遵循 CC BY 4.0 協議,轉載請注明出處 。
辽宁十一选五走实图 私募基金管理人可以管理自有资产吗 黑马计划软件官方网 开奖特马料四不像 陕西11选5前三直选 湖北新十一选五走势图 吉林11选5前三组遗漏 贵州快三开奖结果 一定牛 河北十一选五走势图带坐标 22选5河南最新开奖今 快乐十分钟开奖走势图云南