우리는 인터넷에서이 파일을 얻었고 어떤 식 으로든 JSON
을 console
에 넣을 수는 있지만 chartdisplay.js
은 JSON
파일을 가져 오지 않습니다.Json to Chart.js not working
나를 도와 줄 수 있습니까?
감사합니다.
HTML
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/chartjs/chart.js"></script>
<script type="text/javascript" src="chartdisplay.js"></script>
<div class="chart-container"> <!-- we have defined width and height for this class -->
<canvas id="mycanvas"></canvas>
</div>
content.php
<?php
//get connection
$mysqli = new mysqli('localhost','root','','beehive_exp');
if(!$mysqli){
die("Connection failed: " . $mysqli->error);
}
$query = sprintf("SELECT userid, facebook, twitter, googleplus FROM followers");
//execute query
$result = $mysqli->query($query);
//loop through the returned data
$data = array();
foreach ($result as $row) {
$data[] = $row;
}
//free memory associated with result
$result->close();
//close connection
$mysqli->close();
//now print the data
print json_encode($data);
chartdisplay.js
$(document).ready(function(){
$.ajax({
url : "http://192.100.1.100/content.php",
type : "GET",
success : function(data){
console.log(data);
var userid = [];
var facebook_follower = [];
var twitter_follower = [];
var googleplus_follower = [];
for(var i in data) {
userid.push("UserID " + data[i].userid);
facebook_follower.push(data[i].facebook);
twitter_follower.push(data[i].twitter);
googleplus_follower.push(data[i].googleplus);
}
var chartdata = {
labels: userid,
datasets: [
{
label: "facebook",
fill: false,
lineTension: 0.1,
backgroundColor: "rgba(59, 89, 152, 0.75)",
borderColor: "rgba(59, 89, 152, 1)",
pointHoverBackgroundColor: "rgba(59, 89, 152, 1)",
pointHoverBorderColor: "rgba(59, 89, 152, 1)",
data: facebook_follower
},
{
label: "twitter",
fill: false,
lineTension: 0.1,
backgroundColor: "rgba(29, 202, 255, 0.75)",
borderColor: "rgba(29, 202, 255, 1)",
pointHoverBackgroundColor: "rgba(29, 202, 255, 1)",
pointHoverBorderColor: "rgba(29, 202, 255, 1)",
data: twitter_follower
},
{
label: "googleplus",
fill: false,
lineTension: 0.1,
backgroundColor: "rgba(211, 72, 54, 0.75)",
borderColor: "rgba(211, 72, 54, 1)",
pointHoverBackgroundColor: "rgba(211, 72, 54, 1)",
pointHoverBorderColor: "rgba(211, 72, 54, 1)",
data: googleplus_follower
}
]
};
var ctx = $("#mycanvas");
var LineGraph = new Chart(ctx, {
type: 'line',
data: chartdata
});
},
error : function(data) {
}
});
});
이것은 우리가 무엇을 얻을
JSON 출력
PHP 출력
받고있는 오류를 게시 할 수 있습니까? –
@UmairFarooq 문제가있는 게시물을 업데이트했습니다. 그것을보십시오. 이미지가 하단에 추가됩니다. – Beekeeper
'console.log (data)'는 무엇을 출력합니까? 브라우저의 속성, 콘솔 및 네트워크 탭을 확인하십시오. – skobaljic