我正在尝试从谷歌图表填充数据表以生成图表。到目前为止,我能够获取从数据库(MySQL)到控制器的信息,然后使用 ArrayList 从那里到视图,但是在读取日期时,会发生一些事情并且减去控件:
总结:我正在发送一个包含 2019-05-21 格式数据的数组,JavaScript 将其解释为数学运算,留下 1,993。
我知道这可能被视为一个基本错误,但这是我第一次使用 JavaScript,我已经花了几个小时阅读文档并没有找到任何解决方案。
控制器:
@Controller
@RequestMapping
public class indexController {
@Autowired
private IAccionService service;
@GetMapping("chart_index")
public String profileSettings(Model model) {
String msg="holasoyundatodeprueba";
String msg2="Fecha1";
model.addAttribute("msg", msg);
model.addAttribute("msg2", msg2);
List<Acciones>accioneslst=service.listar_acciones();
Acciones[] arrayAcciones = new Acciones[accioneslst.size()];
arrayAcciones=accioneslst.toArray(arrayAcciones);
ArrayList<String> arrayFechas = new ArrayList<String>();
ArrayList<Integer> arrayOpen = new ArrayList<Integer>();
ArrayList<Integer> arrayClose = new ArrayList<Integer>();
for (Acciones acciones : arrayAcciones) {
arrayFechas.add(acciones.getFecha().toString());
arrayOpen.add(acciones.getOpen_value());
arrayClose.add(acciones.getClose_value());
System.out.println(arrayFechas.toString());
}
model.addAttribute("fechaGrafico",arrayFechas);
model.addAttribute("openGrafico",arrayOpen);
model.addAttribute("closeGrafico",arrayClose);
return "chart_index";
}
JavaScript 代码(谷歌图表:折线图)添加到视图中:
<!DOCTYPE html>
<html>
<head xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gráfico de acciones</title>
<link rel="stylesheet" type="text/css" href="CSS/styles_chart.css" />
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var Fecha=[[${fechaGrafico}]];
var Open=[[${openGrafico}]];
var Close=[[${closeGrafico}]];
var data = new google.visualization.DataTable(); //Cambiado a DataTable
data.addColumn('string','Fecha');
data.addColumn('number','Open');
data.addColumn('number','Close');
for(i=0;i<Fecha.length;i++)
data.addRow(["'"+Fecha[i]+"'",Open[i],Close[i]]);
console.log(Fecha);
var options = {
title : "[[${msg}]]",
curveType : 'function',
backgroundColor : '#EDEEF0',
width : '1323',
height : '855',
legend : 'none',
chartArea : {
width : '1200',
height : '800'
},
colors : [ '#A6CEE3', '#1F78B4' ]
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
班级:
Package com.amsterdam.springboot.v1.app.models;
import java.sql.Date;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;
@Entity
@Table (name="accion") //Nombre de la tabla
public class Acciones {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Date fecha;
private int open_value;
private int high_value;
private int low_value;
private int close_value;
private int adj_close;
private int volume;
private String enterprise;
public Acciones() {
// TODO Auto-generated constructor stub
}
public Acciones(Date fecha, int open_value, int high_value, int low_value, int close_value, int adj_close,
int volume, String enterprise) {
super();
this.fecha = fecha;
this.open_value = open_value;
this.high_value = high_value;
this.low_value = low_value;
this.close_value = close_value;
this.adj_close = adj_close;
this.volume = volume;
this.enterprise = enterprise;
}
public Date getFecha() {
return fecha;
}
public void setFecha(Date fecha) {
this.fecha = fecha;
}
public int getOpen_value() {
return open_value;
}
public void setOpen_value(int open_value) {
this.open_value = open_value;
}
public int getHigh_value() {
return high_value;
}
public void setHigh_value(int high_value) {
this.high_value = high_value;
}
public int getLow_value() {
return low_value;
}
public void setLow_value(int low_value) {
this.low_value = low_value;
}
public int getClose_value() {
return close_value;
}
public void setClose_value(int close_value) {
this.close_value = close_value;
}
public int getAdj_close() {
return adj_close;
}
public void setAdj_close(int adj_close) {
this.adj_close = adj_close;
}
public int getVolume() {
return volume;
}
public void setVolume(int volume) {
this.volume = volume;
}
public String getEnterprise() {
return enterprise;
}
public void setEnterprise(String enterprise) {
this.enterprise = enterprise;
}
}