Highcharts가해서 getJSON 문제 게이지 ...Highcharts 게이지 -해서 getJSON
나는의 여러 가지로 json_encode 에코 하나 개의 PHP 파일이 있습니다. 다음은 결과입니다. 3 개의 Highcharts 게이지 각각에 대한 게이지 데이터 만 가져와야합니다. 다른 모든 것은 작동합니다 ... clickdates.php의 결과입니다.
{ "ampPowerP"[161], "dayPowerP"[4.24] "monthAmpP"[755] "monthPowerP"[19.78] "yearAmpP"[14,015] "yearPowerP ": 369.5]을 "stateC은 "[0]"gauge1은 "[24]"gauge2은 "[29.2]"gauge3은 "[69.2]} 는
내 초점은 이제이고 3 게이지 출력은 내 독서에서 정확한 형식 출력이며 Highcharts 설명서에서 찾고있는 것으로 표시됩니다.
아마 혼란 스럽습니다. 그래서 3 개의 별도 JS 파일을 만들어서 각 Highcharts 게이지를 표시 할 각 div에 대해 gauge1.js, gauge2.js 및 gauge3.js 파일을 간단하게 유지했습니다. 나는 Highcharts 포럼에 열거 된 100 만 가지 방법을 시도해 왔으며 여기에 답을 얻었지만 아무 것도 작동하지 않습니다. 나는 바늘이없는 게이지를 얻는다. 나는 기초로 돌아 갔고 이것은 각 게이지에 대한 나의 기초이다. 나는 일을하려고 노력하고있다.
이것은 gauge1.js이다
$(document).ready(function() {
var options = {
chart: {
type: 'gauge',
renderTo: 'minVolt',
plotBackgroundColor: null,
plotBackgroundImage: null,
plotBorderWidth: 0,
plotShadow: false,
backgroundColor: null,
borderWidth: 0,
spacingTop: 0,
spacingLeft: 0,
spacingRight: 0,
spacingBottom: 0,
},
title: {
text: null
},
pane: {
startAngle: -150,
endAngle: 150,
background: [{
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#FFF'],
[1, '#333']
]
},
borderWidth: 0,
outerRadius: '109%'
}, {
backgroundColor: {
linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
stops: [
[0, '#333'],
[1, '#FFF']
]
},
borderWidth: 1,
outerRadius: '107%'
}, {
// default background
}, {
backgroundColor: '#DDD',
borderWidth: 0,
outerRadius: '105%',
innerRadius: '103%'
}]
},
// the value axis
yAxis: {
min: 20,
max: 40,
minorTickInterval: 'auto',
minorTickWidth: 1,
minorTickLength: 10,
minorTickPosition: 'inside',
minorTickColor: '#666',
tickPixelInterval: 20,
tickWidth: 2,
tickPosition: 'inside',
tickLength: 10,
tickColor: '#666',
labels: {
step: 2,
rotation: 'auto'
},
title: {
y: 20,
text: 'Volts'
},
plotBands: [{
from: 20,
to: 22,
color: '#DF5353' // red
}, {
from: 22,
to: 23,
color: '#FFFF00' // yellow
}, {
from: 23,
to: 30,
color: '#55BF3B' // green
}, {
from: 30,
to: 40,
color: '#DF5353' // red
}]
}, credits: {
enabled:false,
},
series: [{
name: 'Volt',
data: [],
tooltip: {
enabled: false
},
}] };
$.getJSON('clickdates.php', function(gauge1) {
options.series[0].data = gauge1;
var chart = new Highcharts.Chart(options);
});
}); 해서 getJSON에서
뭔가 내가 보지 않는, 그리고 이해하고 있지 않다 무엇을해야합니다 ... Highcharts는 ... 형식에 대한
{"gauge1":[24]}
를 찾고 있습니다 ... 그리고 내가 보내고 것입니다 .. .
I 차트 쇼를 가지고 있지만 데이터베이스에서 데이터가 없기 때문에이 $ .getJSON 작동합니다...
$.getJSON('clickdates.php', function(gauge1) { options.series[0].data = gauge1; var chart = new Highcharts.Chart(options);
그것은 간단해야하지만, 나는 그것을 볼 수 없습니다 ... 그리고 내 노력의 아무도 게이지에 JSON 데이터를 얻는 것 같지 않습니다 ...
당신의 지혜는 크게 감사드립니다.
앨런
바늘은 게이지 차트의 한 점입니다. 포인트를 데이터 배열에 배치해야합니다. 포인트 자체는 배열 (예 : [ 'name', 10]) 또는 객체 (예 : {name : 'name', y : 10}) 일 수 있습니다. 따라서 형식이 올바르지 않습니다. 여기 예제 : http : // jsfiddle.net/hudj2gdo/1/또한 Ajax 요청을 사용하는 경우 코드에서 제외하고 (예 : 메모리에 데이터 넣기) 누군가가 쉽게 문제를 다시 만들 수 있다면 더 좋습니다. – morganfree
숫자를 넣고 정적 게이지를 만드는 방법을 알고 있습니다. 내 문제는 PHP에서 게이지로 JSON 가져 오는 것입니다. 결과를 표시하기 위해 JSON을 div에 쉽게 넣을 수 있습니다. 나는 게이지에 넣는 것을 더 좋아합니다. $ .getJSON은 작동하지 않으며 AJAX도 아닙니다 ... – HKmarine