So I am trying to load data from a PHP file that prints out JSON data, I am using the code I found on an example (with some modifications, but it still displays the static data fine)
You can post now and register later.
If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.
Question
Tinman
So I am trying to load data from a PHP file that prints out JSON data, I am using the code I found on an example (with some modifications, but it still displays the static data fine)
<html>
<head>
<title>jChartFX using JQueryUI</title>
<style type="text/css">
#targetchart { width: 608px; height: 408px; padding: 4px; border: 1px solid #dddddd; background: #eeeeee }
#targetchart h3 { text-align: center; margin: 0; }
</style>
<link type="text/css" href="http://www.jchartfx.com/resources/Include/cupertino/jquery-ui-1.8.21.custom.css"
rel="Stylesheet" />
<script type="text/javascript" src="http://www.jchartfx.com/scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://www.jchartfx.com/scripts/jquery-ui-1.8.18.custom.min.js"></script>
<script type="text/javascript" src="http://www.jchartfx.com/jChartFX/7.0.4728.16930/jchartfx.full.js"></script>
</head>
<body>
<div class="ChartDiv1" id="targetchart" style="display:inline-block">
<div id="myDiv" style="width:100%;height:100%;display:inline-block">
</div>
</div>
<script language="javascript" type="text/javascript">
var chart1;
$(document).ready(function ($) {
var items = [
{ "Open": 24.2, "Date": "2003-03-01T23:45:10.280Z" },
{ "Open": 21.3, "Date": "2003-03-02T23:45:10.280Z" },
{ "Open": 22.4, "Date": "2003-03-03T23:45:10.280Z" },
{ "Open": 24.3, "Date": "2003-03-04T23:45:10.280Z" },
{ "Open": 22.6, "Date": "2003-03-05T23:45:10.280Z" }
];
$("div", ".ChartDiv1").chart({
gallery: cfx.Gallery.Bar,
dataValues: items,
dataSourceSettings: {
fields: [{ name: "Open", usage: cfx.FieldUsage.Value },
{ name: "Date", usage: cfx.FieldUsage.XValue}]
},
titles: [{ text: "Mapping Fields to chart elements"}],
axisY:{
min:0,
max:30
}
});
});
</script>
</body>
</html>
Now instead of var items being static data, I would want it to be the data generated from my php file, the php file outputs this when run:
[{"Open":626,"Date":"2013-09-27
14:30:06"},{"Open":615,"Date":"2013-09-27
15:45:05"},{"Open":604,"Date":"2013-09-27
17:45:05"},{"Open":593,"Date":"2013-09-27
20:00:05"},{"Open":588,"Date":"2013-09-27
22:00:06"},{"Open":583,"Date":"2013-09-28
00:00:02"},{"Open":573,"Date":"2013-09-28
02:00:07"},{"Open":568,"Date":"2013-09-28
04:00:05"},{"Open":558,"Date":"2013-09-28
06:00:05"},{"Open":548,"Date":"2013-09-28
08:00:05"},{"Open":544,"Date":"2013-09-28
08:45:07"},{"Open":534,"Date":"2013-09-28
11:00:27"},{"Open":525,"Date":"2013-09-28
13:00:03"},{"Open":517,"Date":"2013-09-28
15:00:02"},{"Open":508,"Date":"2013-09-28
17:00:02"},{"Open":504,"Date":"2013-09-28
19:00:02"},{"Open":500,"Date":"2013-09-28
21:00:02"},{"Open":496,"Date":"2013-09-28
23:00:02"}]
(and may contain more or less data, but all in correct format)
If I copy this data into the items variable it displays fine, but if I try something like this (replacing the current item variable code):
var items;
$.get('data.php', function (response) {
items = response;
});
It does not display anything, it seems like it fails to render entierly.
How would I go about making the items variable the same as whatever data.php is outputting?
Link to comment
Share on other sites
6 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.