我不明白为什么这个AmCharts图表没有显示出来
Can't see why this AmCharts chart doesn't show?
我已经为几个不同的用途设置了一些AmCharts,但这次我被卡住了。在过去的几个小时里,我一直在努力让这张图表显示出来,但没有成功。我想我已经尝试了我能想到的所有方法,所以我希望有人能指出代码的问题所在。
这是一个jsfiddle: http://jsfiddle.net/mDR87/2/
这是不渲染任何图表的JS代码:
var chartDatagc1 = [];
var newDate0 = new Date("2014-05-01");
chartDatagc1.push({
date: newDate0,
engine0: "6",
engine1: "16"});
var newDate1 = new Date("2014-05-02");
chartDatagc1.push({
date: newDate1,
engine0: "6",
engine1: "16"});
var newDate2 = new Date("2014-05-03");
chartDatagc1.push({
date: newDate2,
engine0: "31",
engine1: "16"});
var newDate3 = new Date("2014-05-04");
chartDatagc1.push({
date: newDate3,
engine0: "6",
engine1: "16"});
var newDate4 = new Date("2014-05-06");
chartDatagc1.push({
date: newDate4,
engine0: "6",
engine1: "16"});
var newDate5 = new Date("2014-05-08");
chartDatagc1.push({
date: newDate5,
engine0: "6",
engine1: "16"});
var newDate6 = new Date("2014-05-22");
chartDatagc1.push({
date: newDate6,
engine0: "41",
engine1: "17"});
var newDate7 = new Date("2014-05-23");
chartDatagc1.push({
date: newDate7,
engine0: "41",
engine1: "17"});
var newDate8 = new Date("2014-05-24");
chartDatagc1.push({
date: newDate8,
engine0: "44",
engine1: "16"});
var newDate9 = new Date("2014-05-25");
chartDatagc1.push({
date: newDate9,
engine0: "44",
engine1: "16"});
var newDate10 = new Date("2014-05-26");
chartDatagc1.push({
date: newDate10,
engine0: "44",
engine1: "17"});
var newDate11 = new Date("2014-05-27");
chartDatagc1.push({
date: newDate11,
engine0: "44",
engine1: "17"});
var newDate12 = new Date("2014-05-28");
chartDatagc1.push({
date: newDate12,
engine0: "44",
engine1: "17"});
var newDate13 = new Date("2014-05-29");
chartDatagc1.push({
date: newDate13,
engine0: "40",
engine1: "17"});
var newDate14 = new Date("2014-05-30");
chartDatagc1.push({
date: newDate14,
engine0: "40",
engine1: "17"});
var newDate15 = new Date("2014-05-31");
chartDatagc1.push({
date: newDate15,
engine0: "44",
engine1: "17"});
var chartgc1 = AmCharts.makeChart("chartdivgc1", {
"type": "serial",
"theme": "none",
"pathToImages": "http://www.amcharts.com/lib/3/images/",
"legend": {
"useGraphSettings": true
},
"dataProvider": chartDatagc1,
"valueAxes": [{
"integersOnly": true,
"maximum": 50,
"minimum": 1,
"reversed": true,
"axisAlpha": 0,
"dashLength": 5,
"gridCount": 10,
"position": "left",
"title": "Position"
}],
"graphs": [{
"id":"g1",
"balloonText": "Bing Sweden<br />[[category]]<br /><b><span style='font-size:14px;'>Placering: [[value]]</span></b>",
"bullet": "bubble",
"bulletSize": 3,
"bulletBorderAlpha": 1,
"bulletColor":"#FFFFFF",
"hideBulletsCount": 50,
"title": "Bing Sweden",
"valueField": "engine0",
"useLineColorForBulletBorder":true,
"lineColor": "#0297A9"
}, {
"id":"g2",
"balloonText": "Google Sweden<br />[[category]]<br /><b><span style='font-size:14px;'>Placering: [[value]]</span></b>",
"bullet": "bubble",
"bulletSize": 3,
"bulletBorderAlpha": 1,
"bulletColor":"#FFFFFF",
"hideBulletsCount": 50,
"title": "Google Sweden",
"valueField": "engine1",
"useLineColorForBulletBorder":true,
"lineColor": "#E2CC30"
}
],
"chartCursor": {
"cursorPosition": "mouse"
},
"categoryField": "date",
"categoryAxis": {
"parseDates": true,
"axisColor": "#f3f3f3",
"dashLength": 1,
"minorGridEnabled": true,
"dateFormats": [{period:"fff",format:"JJ:NN:SS"},
{period:"ss",format:"JJ:NN:SS"},
{period:"mm",format:"JJ:NN"},
{period:"hh",format:"JJ:NN"},
{period:"DD",format:"YYYY-MM-DD"},
{period:"WW",format:"YYYY-MM-DD"},
{period:"MM",format:"MMM"},
{period:"YYYY",format:"YYYY"}]
}
});
有一个问题,因为它会显示,如果你触发一个大小调整事件,你可以尝试添加一个内联的宽度和高度,或者如果它是在一个模态/对话框,只有渲染后的大小设置。
可以使用
chart.invalidateNow ();chart.validateSize ();
重新计算大小。/R
相关文章:
- 从桌面读取python文件时高亮显示代码
- 使用JS如何动态更改显示的html文件中的文本背景颜色
- 如何在生成下载文件时显示加载动画
- React重新渲染但未显示正确的组件
- 正在检索要在amcharts中显示的数据
- 两个amCharts图与iPad上的jQueryMobile框架不显示在同一页面上
- Amcharts仅显示有关调整大小事件的数据
- 在同一库存面板(amCharts)中显示不同的图形
- 使用amCharts以x轴值显示日期
- 当我使用[[percents]时,amcharts上的错误在每列中显示100.00%
- 当 amCharts 中的值为零时显示图形标签
- 趋势线未显示在amCharts中
- amCharts显示滚动气球中的值变化
- amcharts在tomcat服务器(localhost)上运行时未显示
- Amcharts图表标题没有显示
- 我不明白为什么这个AmCharts图表没有显示出来
- 始终在amCharts图表中显示基线
- Amcharts不显示所有图形
- Amcharts条形图只显示Firefox中的第一条记录
- Amcharts -折线图不能正确显示