真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

使用Echarts怎么動(dòng)態(tài)加載多條折線圖

使用Echarts怎么動(dòng)態(tài)加載多條折線圖?很多新手對此不是很清楚,為了幫助大家解決這個(gè)難題,下面小編將為大家詳細(xì)講解,有這方面需求的人可以來學(xué)習(xí)下,希望你能有所收獲。

專注于為中小企業(yè)提供網(wǎng)站建設(shè)、成都網(wǎng)站制作服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)商河免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動(dòng)了上千家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

//氣象數(shù)據(jù)
	function serchQx(beginTime, endTime, str, parameter) {
		$("#rr").html("");//將循環(huán)拼接的字符串插入下拉列表 
		var t = $("#imageParameter").val();
		$
				.ajax({
					type : "POST",
					data : {
						"str" : str,
						"beginTime" : beginTime,
						"endTime" : endTime,
						"parameter" : parameter,
						"t" : t
					},
					url : "${pageContext.servletContext.contextPath}/dataAnalysis/serch.action",
					success : function(result) {
						var aa = [];
						var tmp=[];
						if (parameter == 1) {
							aa.push('單位(℃)');
							//option.yAxis[0].name = aa;
						} else if (parameter == 2) {
							aa.push('單位(%)');
							//option.yAxis[0].name = aa;
						} else if (parameter == 3) {
							aa.push('單位(KPa)');
							//option.yAxis[0].name = aa;
						} else if (parameter == 4) {
							aa.push('單位(w/㎡)');
							//option.yAxis[0].name = aa;
						} else if (parameter == 5) {
							aa.push('單位(mm)');
							//option.yAxis[0].name = aa;
						} else if (parameter == 6) {
							aa.push('單位(m/s)');
							//option.yAxis[0].name = aa;
						}
						//處理數(shù)據(jù)
						//將從后臺(tái)接收的json字符串轉(zhuǎn)換成json對象
						var jsonobj = eval("(" + result + ")");
						//給圖標(biāo)標(biāo)題賦值
						//option.legend.data = jsonobj.legend;
						//讀取橫坐標(biāo)值
						//option.xAxis[0].data = jsonobj.axis;
						var series_arr = jsonobj.series;
						//驅(qū)動(dòng)圖表生成的數(shù)據(jù)內(nèi)容,數(shù)組中每一項(xiàng)代表一個(gè)系列的特殊選項(xiàng)及數(shù)據(jù)
						for (var i = 0; i < series_arr.length; i++) {
							var datas=[];
							for(var j=0;j

后臺(tái)封裝的Series

/**
 * 
 */
package com.myhope.domain;

import java.util.List;

/**
 * Description:
 * Copyright (c) , 2017, Jansonxu 
 * This program is protected by copyright laws. 
 * Program Name:Series
 * Date:2019年1月14日  *   * @author   * @version : 1.0  */ public class Series { private String name; private String type; private List data; private List time; public Series(String name, String type, List data, List time) { super(); this.name = name; this.type = type; this.data = data; this.time = time; } public List getTime() { return time; } public void setTime(List time) { this.time = time; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getType() { return type; } public void setType(String type) { this.type = type; } public List getData() { return data; } public void setData(List data) { this.data = data; } public Series() { super(); } @Override public String toString() { return "Series [name=" + name + ", type=" + type + ", data=" + data + ", time=" + time + "]"; } }

后臺(tái)封裝Echarts

/**
 * 
 */
package com.myhope.domain;

import java.util.List;

/**
 * Description:
 * Copyright (c) , 2017, Jansonxu 
 * This program is protected by copyright laws. 
 * Program Name:Echarts
 * Date:2019年1月14日  *   * @author   * @version : 1.0  */ public class Echarts { private List legend;//name private List axis ;//橫坐標(biāo) private List series;//數(shù)據(jù)項(xiàng) private List dataAnalysisTables; public Echarts(List legend, List axis, List series, List dataAnalysisTables) { super(); this.legend = legend; this.axis = axis; this.series = series; this.dataAnalysisTables = dataAnalysisTables; } public Echarts() { super(); } public List getLegend() { return legend; } public void setLegend(List legend) { this.legend = legend; } public List getAxis() { return axis; } public void setAxis(List axis) { this.axis = axis; } public List getSeries() { return series; } public void setSeries(List series) { this.series = series; } public List getDataAnalysisTables() { return dataAnalysisTables; } public void setDataAnalysisTables(List dataAnalysisTables) { this.dataAnalysisTables = dataAnalysisTables; } @Override public String toString() { return "Echarts [legend=" + legend + ", axis=" + axis + ", series=" + series + ", dataAnalysisTables=" + dataAnalysisTables + "]"; } }

Action封裝

將對應(yīng)的東西傳入頁面即可

Echarts echarts = new Echarts(legend, newAxis, series,);
String jsonString = com.alibaba.fastjson.JSONObject.toJSONString(echarts);

初始化Echarts文件

var dom = document.getElementById("xsl");
var myChart = echarts.init(dom);
myChart.showLoading({
	text : "圖表數(shù)據(jù)正在努力加載..."
});
var app = {};
app.title = '多 X 軸示例';

var colors = [ '#5793f3', '#d14a61', '#675bba', "#00FF00", "#FFFF00" ];

option = {
	color : colors,
	tooltip : {
		trigger : 'axis'
	},
	dataZoom : {
		show : true,
		start : 0,
		realtime : true
	},
	legend : {
		data : []
	},
	grid : {
		top : 70,
		bottom : 50
	},
	 calculable: true,
	xAxis : [ {
		type : 'time',
		boundaryGap : [ 0, 100 ],
		axisLabel : {
			textStyle : {
				fontSize : "10px"
			}
		}

	}

	],
	yAxis : [ {
		name : [],
		type : 'value',
	} ],
	series : []
};
myChart.clear();
myChart.setOption(option, true);

看完上述內(nèi)容是否對您有幫助呢?如果還想對相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章,請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝您對創(chuàng)新互聯(lián)的支持。


文章題目:使用Echarts怎么動(dòng)態(tài)加載多條折線圖
文章路徑:http://weahome.cn/article/gdosde.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220(工作日)

18980820575(7×24)

提交需求

返回頂部