echarts前端如何导入后端数据,形成散点图
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!-- 步骤1 引入ECharts的脚本文件 -->
<script src="./js/echarts.min.js"></script>
<script src="./js/jquery-3.4.1.min.js"></script>
</head>
<body>
<!-- 步骤2 为 ECharts 准备一个定义了宽高的 DOM -->
<div id="main" style="width: 600px;height:400px;"></div>
<script>
// 步骤3 初始化ECharts 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 步骤4 配置ECharts 指定图表的配置项和数据
// JSON对象 {属性名1:属性值1, 属性名2: 属性值2, 属性名3: 属性值3}
// JSON数组 [{属性名1:属性值1, 属性名2: 属性值2}, {属性名1:属性值1, 属性名2: 属性值2}, {属性名1:属性值1, 属性名2: 属性值2}]
//定义图表的配置选项的JSON对象
var option = {
xAxis: {},
yAxis: {},
series: [
{
symbolSize:
data:
type: 'scatter'
}
]
};
// 步骤5 使用刚指定的配置项和数据显示图表
myChart.setOption(option);
$.get("http://localhost:8080/getTemperatureList", function(data){
var max=[],min=[]
$.each(data,function(index,temperature)){
max[index]=temperature.max
min[index]=temperatrue.min
})
myChart.setOption({
series: [
{
symbolSize: 31,
data: data
type: 'scatter'
}
]
});
}
</script>
</body>
</html>
``

找个官网的例子,把后端返回的数据 处理成 和例子一样的就行了
通过接口请求后端数据,拿到数据后处理好格式,放入series data
把后台的数据放到echarts的data中就可以了