You are not logged in.
Pages: 1
I'm trying to use amFallback so charts will appear JS falling back to original Flash (which used XML data and settings)
(I inserted "console.log(JSON.stringify(holder)) in amFallback.js 2.6.12 at line 400 - at the end of the parseXMLobject function. Its output follows) My console.log in Chrome shows all the data is received and apparently parsed successfully (also is showing a very handy trace stack that's much harder to get at in Firefox or IE):
XHR finished loading: "http:/[my dev server]/chart/Settings/1/1340721691766". amfallback.js:573
(cleaned up for readability):
[{"root":
{"settings":
{"type":"clustered",
"data_type":"xml",
"plot_area":{
"margins":{
"left":"50",
"right":"50",
"bottom":"120",
"top":"60"}
},
"grid":{
"category":{"alpha":"5"},
"value":{"alpha":"5"}},
"axes":{
"category":{"width":"1"},
"value":{"width":"1"}
},
"values":{"value":{"min":"0"}},
"balloon":{
"alpha":"80",
"text_color":"000000",
"corner_radius":"5",
"border_width":"3",
"border_color":"000000",
"border_alpha":"60"
},
"legend":{
"width":"400",
"spacing":"5",
"enabled":"true"
},
"column":{
"type":"stacked",
"width":"75",
"spacing":"0",
"balloon_text":"{title}: {value} mln",
"data_labels":"<b>{value}</b>",
"grow_time":"1",
"grow_effect":"regular"
},
"depth":"10",
"angle":"45",
"line":{
"balloon_text":"{value}",
"data_labels":"{value}"
},
"labels":{
"label":{"lid":"0","text":"","y":"25","align":"center"}},
"graphs":{
"graph":[{"gid":"0","color":"FF4444"},{"gid":"1","color":"44FF44"}]
}
}
}
}]amfallback.js:400
XHR finished loading: "http://[my dev server]/chart/Data/1". amfallback.js:573
[{"root":{
"chart":{
"series":{
"value":[
{"xid":"0","#text":"Building Preview"},
{"xid":"1","#text":"Configure and Assign"},
{"xid":"2","#text":"Edit Commentary"},
{"xid":"3","#text":"Waiting for Data"},
{"xid":"4","#text":"Building"},
{"xid":"5","#text":"First Review"},
{"xid":"6","#text":"Second Review"},
{"xid":"7","#text":"Final Review"},
{"xid":"8","#text":"Ready for Print"},
{"xid":"9","#text":"Ready for Distribution"},
{"xid":"10","#text":"Distributed"},
{"xid":"11","#text":"Exception"}
]
},
"graphs":{
"graph":[{
"color":"FF4444",
"gid":"0",
"value":[
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"0","#text":"1"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"1","#text":"7"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"2","#text":"4"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"3","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"4","#text":"1"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"5","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"6","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"7","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"8","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"9","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"10","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_1'].submit()","xid":"11","#text":"0"}
]},
{
"color":"44FF44",
"gid":"1",
"value":[
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"0","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"1","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"2","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"3","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"4","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"5","#text":"3"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"6","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"7","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"8","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"9","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"10","#text":"0"},
{"url":"javascript:document.forms['#GroupingForm_2'].submit()","xid":"11","#text":"0"}
]
}]
}
}
}
}]Since it appears all the data is there, and the settings, I'm confused as to why there is no chart appearing. The function in our cw_charts.js is testing if(AmCharts.recommended() == "js") and returning true as shown that the console is logging what's in the function. Here's the full function
if(AmCharts.recommended() == "js")
{
var amFallback = new AmCharts.AmFallback();
amFallback.settingsFile = flashvars.settings_file;
amFallback.dataType = 'xml';
amFallback.dataFile = flashvars.data_file;
amFallback.pathToImages = sharedPrefix+"js/amcharts/images/";
//amFallback.chartData = flashvars.data_file; // tried this. didn't work either.
amFallback.type = this.chartType; //"column";
amFallback.write(this.containerID); //"chartdiv"
}Also, the SVG elements ARE in the page, with lots of <g> nodes inside. Just not showing. I have g nodes with inner path nodes such as
<path cs="100,100" d="M0.5,0.5 L16.5,0.5 L16.5,16.5 L0.5,16.5 Z" fill="#FF4444" stroke="#FF4444" fill-opacity="1" stroke-width="1" stroke-opacity="1"></path>
and yet nothing is visible at all. Any pointers on what might be wrong? Many thanks.
Last edited by eoneill (2012-06-26 10:07:17)
Offline
A further note: If I simply save the web page (that shows no chart) in "complete" mode (saves the images and scripts, etc), and then browse to it (file:///myfilepath/myfile.htm), the chart displays fine, so the css and element style and svg appears not to be at fault, but rather something to do with the timing, perhaps? When using amfallback functions, is there a way to us the validateData or validateNow function? Seeing as there does not appear to be a "chart" object per se (when using amfallback) upon which to call either function.
Offline
Once initiated the amFallback object will hold the actual chart object in .chart property. So you can access its properties and methods that way:
amFallback.chart.validateNow();
As to why your chart does not appear, it's hard to say. Would you be able to share your full code / settings / data so we can run it locally and test?
Does it happen in all of the browsers?
Do you perhaps have "base href" on your page?
Offline
Easy answers: all browsers=yes and have base href=no. Just tried amFallback.chart.validateNow(). No errors, no effect. But wasn't sure exactly where to put it. After the amFallback.write() call, was my guess. If wrong, let me know.
Harder answer: I sent files a while ago, but the response was that it relied on external scripts, all of which dependencies I thought I had deleted, other than the scripts that were included in what I sent. One problem is that the data and chart functions being external is integral to the project. If you can't test with them external, then you'd need to put them where your testing apparatus wants them to be. Paste them into my doc, if that's what's needed. But doing that changes the structure and function calls that are needed. So is that still a useful test? I'll try again.
Offline
New set of files sent via email.
Offline
I've been tweaking css settings on the divs around the chart div and on the chart div itself. Now, the chart div starts out blank, but if you resize the browser window, it suddenly draws itself -- but ridiculously tall. So, some rules for container CSS are in order here, it would seem. The div is not hidden when the page loads, but there does seem to be a serious timing issue between the dom, the css, and chart drawing/sizing functions.
Offline
Ok... no help forthcoming, so I kept looking. In case anybody else has this problem, I found this example:
//paint javascript charts
$('#' + id).width(780);
$('#' + id).height(460);
var amFallback = new AmCharts.AmFallback();
amFallback.settingsFile = settings;
amFallback.dataFile = path;
amFallback.pathToImages = "https://www.example.com/js/amchart/images/";
amFallback.type = type;
amFallback.write(id);... in another support topic: http://amcharts.com/forum/viewtopic.php?id=9391
That person's problem wasn't my problem, but the $("#"+id).height(xxx) setting fixed it for me. Not a perfect fix if you don't wish to pre-size your chart. Changing css div height in the html or external css file did NOT fix it. Seems it HAS to be here in the amFallback call. So. I'm done. Bye.
Offline
Pages: 1
© amCharts | Forum engine: PunBB