Jquery i Ajax do pobierania danych używanych do implementacji highcharts + HTML - jquery, html, ajax, highcharts

Muszę narysować wykres czasu i wartości pochodzących z żądania ajax, muszę wiedzieć, jak pokazać dane na wysokich wykresach, proszę znaleźć poniższy kod:

JSP DO POBIERANIA DANYCH:

<%@ page import = "com.qdx.eqc.vo.*, com.qdx.eqc.proxy.EQCProxyClient, java.util.*" %>
<%

System.out.println("Inside landingAjax.jsp");
String productionID = request.getParameter("productionID");
System.out.println("productionID = "+productionID);
String instrumentID = request.getParameter("instrumentID");
System.out.println("instrumentID = "+instrumentID);
String testId = request.getParameter("testId");
System.out.println("testId = "+testId);
String instrType = request.getParameter("instrType");
System.out.println("instrType = "+instrType);
String testInstrTypeId = request.getParameter("testInstrTypeId");
System.out.println("testInstrTypeId = "+testInstrTypeId);
String departmentId = request.getParameter("departmentId");
System.out.println("departmentId = "+departmentId);

EQCProxyClient client = new EQCProxyClient();
ResponseVO responseVO = null;

//Graph data for patinetbias START
responseVO = client.getPatientBiasData(productionID,instrumentID,testId,instrType,testInstrTypeId,"7.0",departmentId);
ArrayList xAxis = new ArrayList();
ArrayList lines = new ArrayList();
ArrayList dateTime = new ArrayList();
ArrayList doubleValue = new ArrayList();
Date duration = new Date();
Iterator itt=responseVO.getResponse().iterator();
while(itt.hasNext()){
PatientBiasDataVO po = (PatientBiasDataVO)itt.next();
xAxis = po.getPatientBiasData();
Iterator biasItr = xAxis.iterator();
while(biasItr.hasNext())
{
BiasDataVO biasData = (BiasDataVO)biasItr.next();
if(biasData.getStrDateTime()!=null)
{
dateTime.add(biasData.getStrDateTime());

}
doubleValue.add(biasData.getValue());

}
lines = po.getVerticalLines();
duration = po.getDateTime();
System.out.println(" xAxis "+ xAxis + " lines " + lines + "duration" + duration );
}
out.print(doubleValue.toString()+","+dateTime.toString()); /// THESE IS THE GRAPH DATA as VALUE AND TIME

%>

JAVASCRIPT DLA AJAX & HIGHCHARTS:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){alert("came in");
var options = {
chart: {
renderTo: "right1",
type: "spline",
marginRight: 10,
},
credits: {
enabled: false
},
title: {
text: "Patient Bias Display"

},
xAxis: {
type: "datetime",
tickPixelInterval: 150
},
yAxis: {
title: {
text: "Bias"
},
plotLines: [{
value: 0,
width: 1,
color: "#808080"
}]
},
tooltip: {
formatter: function() {
return "<b>"+ this.series.name +"</b><br/>"+
Highcharts.dateFormat("%Y-%m-%d %H:%M:%S", this.x) +"<br/>"+
Highcharts.numberFormat(this.y, 2);
}

},
legend: {
enabled: false
},
exporting: {
enabled: false
},
plotOptions: {
color: "#F3F70E"
},
series: []

};

var productionID = document.getElementById("productionID").value;
var instrumentID = document.getElementById("instrumentID").value;
var testId = document.getElementById("testId").value
var instrType = document.getElementById("instrType").value;
var testInstrTypeId = document.getElementById("testInstrTypeId").value;
var departmentId = document.getElementById("departmentId").value;

var url = "landingAjax.jsp";
url = url+"?productionID="+productionID+"&instrumentID="+instrumentID+"&testId="+testId+"&instrType="+instrType+"&testInstrTypeId="+testInstrTypeId+"&departmentId="+departmentId;
alert(url);
$("#highCharts").click(function() {alert("clicked"); // CLICKED is alerted
$.getJSON(url, function(data) {alert(url);    //THis alert doesnt work

Jak wypełnić dane w osi X i osi Y?
var seria = { dane: []};

                        options.series.push(series);

var chart = new Highcharts.Chart(options);
});
});
});
</script>

Muszę wiedzieć, jak gromadzić dane na osiach x i y, aby wykreślić wykres, proszę zapoznać się z moimi komentarzami powyżej.

Pomóżcie mi chłopaki... jeśli czegoś nie rozumiem; proszę w komentarzach... Dzięki!!!

Odpowiedzi:

0 dla odpowiedzi № 1

oto jak to robię po swojemu ... może znajdziesz lepszy sposób na zrobienie tego

• wykonuję wywołanie javascript ajax do serwera
• umieść swój wykres w funkcji, nazwij go dowolną rzeczą, jak drawchart()
• przekaż swoje wywołanie zwrotne do tej funkcji

ogłoszenie

aby wypełnić oś x, musisz mieć tablicę wyglądającą tak

     xAxis: {
categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
"Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
},

i dla każdego elementu w tej tablicy musisz przekazać wartość do swojego series data[1,2,3,....]

PRZYKŁAD

    $.ajax({
type: "POST",
url: "YOUR WEB SERVICE ",
data: "",
dataType: "json",
contentType: "application/json; charset=utf-8",

success: function (myvalue) {
drawchart(myvalue) ;

}});

musisz też przeczytać to

---