호스팅 된 웹 서버의 파일에서 JSON 값을 사용하려고하는데 올바르게 값을 파싱하고 내 Chartjs 배열 내에서 사용하고 있다고 생각하지만 어떤 이유로 오류 메시지가 나타납니다 나는 꽤 디버그 할 수 없다.웹 서버 JSON 값을 데이터 속성에 구문 분석
오류 1 Uncaught SyntaxError: Unexpected token h
코드 참조 : var gaValues = JSON.parse(url);
오류 2 Uncaught SyntaxError: Unexpected token :
코드 참조 : labels: [ga:dayOfWeekName],
JSON :
{"kind": "analytics#gaData", "rows": [["Friday", "2"], ["Monday", "3"], ["Saturday", "0"], ["Sunday", "1"], ["Thursday", "4"], ["Tuesday", "4"], ["Wednesday", "4"]], "containsSampledData": false, "profileInfo": {"webPropertyId": "UA-22222-1", "internalWebPropertyId": "222222", "tableId": "ga:22222", "profileId": "2222", "profileName": "All Web Site Data", "accountId": "222222"}, "itemsPerPage": 50, "id": "https://www.googleapis.com/analytics/v3/data/ga?ids=ga:222222&dimensions=ga:dayOfWeekName&metrics=ga:sessions&start-date=7daysAgo&end-date=yesterday&max-results=50", "totalResults": 7, "query": {"max-results": 50, "dimensions": "ga:dayOfWeekName", "start-date": "7daysAgo", "start-index": 1, "ids": "ga:22222", "metrics": ["ga:sessions"], "end-date": "yesterday"}, "totalsForAllResults": {"ga:sessions": "18"}, "columnHeaders": [{"dataType": "STRING", "columnType": "DIMENSION", "name": "ga:dayOfWeekName"}, {"dataType": "INTEGER", "columnType": "METRIC", "name": "ga:sessions"}], "selfLink": "https://www.googleapis.com/analytics/v3/data/ga?ids=ga:22222&dimensions=ga:dayOfWeekName&metrics=ga:sessions&start-date=7daysAgo&end-date=yesterday&max-results=50"}
C 수사슴-options.js :
var url = 'https://test.appspot.com/query?id=ahJzfmNvbm5vcnBoaWxsaXBzMjtetssesestestststRyFQsSCEFwaVF1ZXJ5GICAgICAgIAKDA';
var gaValues = JSON.parse(url);
var barChartdata = {
labels: [ga:dayOfWeekName],
datasets: [
{
label: "My First dataset",
fillColor: "rgba(220,220,220,0.5)",
strokeColor: "rgba(220,220,220,0.8)",
highlightFill: "rgba(220,220,220,0.75)",
highlightStroke: "rgba(220,220,220,1)",
data: [gaValues.ga:sessions]
}
]
};
var options = {
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
scaleBeginAtZero : true,
//Boolean - Whether grid lines are shown across the chart
scaleShowGridLines : true,
//String - Colour of the grid lines
scaleGridLineColor : "rgba(0,0,0,.05)",
//Number - Width of the grid lines
scaleGridLineWidth : 1,
//Boolean - If there is a stroke on each bar
barShowStroke : true,
//Number - Pixel width of the bar stroke
barStrokeWidth : 2,
//Number - Spacing between each of the X value sets
barValueSpacing : 5,
//Number - Spacing between data sets within X values
barDatasetSpacing : 1,
//Boolean - Set if responsive or not
responsive : true
}
window.onload = function(){
// Get the context of the canvas element
var ctx = document.getElementById("sessions-graph").getContext("2d");
var sessionsGraph = new Chart(ctx).Bar(barChartdata, options); //Create a chart with "data" array
};
index.html을 :
<!doctype html>
<html>
<head>
<title>Google Super Proxy Test</title>
<script src="chart-options.js"></script>
<script src="Chart.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<div style="width: 50%">
<canvas id="sessions-graph" height="450" width="600"></canvas>
</div>
</body>
</html>
유효한 자바 스크립트를 작성하지 않았습니다. 또한 [JSON.parse] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse)는 JSON 문자열 만 허용합니다. – tcooc