我正在尝试使用highcharts构建条形图。这是我的功能:
function monthly_web_login() {
$.getJSON('monthly_web_login.php', function(data) {
var chart = new highcharts({
chart: {
borderColor: '#98AFC7',
borderRadius: 20,
borderWidth: 1,
renderTo: 'login',
type: 'bar',
marginRight: 10,
},
exporting: {
enabled: true
},
rangeSelector: {
enabled:false
},
scrollbar: {
enabled: false
},
navigator : {
enabled : false
},
xAxis: {
type: 'datetime',
tickInterval: 30 * 24 * 3600 * 1000, // 6 months month
dateTimeLabelFormats: {
millisecond: '%H:%M:%S.%L',
second: '%H:%M:%S',
minute: '%H:%M',
hour: '%H:%M',
day: '%e. %b',
week: '%e. %b',
month: '%b',
year: '%Y'
}
},
yAxis: { // Primary yAxis
labels: {
style: {
color: 'blue'
}
},
gridLineColor: '#197F07',
gridLineWidth: 0,
title: {
text: 'Monthly Logons',
style: {
color: 'blue'
}
}
},
credits: {
enabled: false
},
title: {
text: 'TOTAL MONTHLY LOGONS',
style: {
color: '#333000',
fontSize: '14px'
}
},
tooltip: {
pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y} </b><br>',
valueDecimals: 2
},
series: data
});
});
}
这是我的json文件:
[{"name":"logon","pointStart":Date.UTC(2011, 1, 1),"pointInterval":30 * 24 * 3600 * 1000,"data":[284697404,268944957,297847827,287150001,277779620,262275285]}]
这是html:
<div id="login" style="width:700px; height:300px;"></div>
我也没有看到任何错误,也没有图表。任何想法,我在这里做错了什么?
答案 0 :(得分:1)
您似乎没有将图表与DOM元素相关联。
而不是:
var chart = new highcharts({})...
尝试:
var chart = $('#login').highcharts({})...
请参阅此jsfiddle(http://jsfiddle.net/pSTcC/)以获取使用您的代码并进行微小修改的工作示例。