Opened 10 years ago

Closed 9 years ago

#9877 closed defect (worksforme)

multiple pie charts not rendered in IE

Reported by: shakeel Owned by: Eugene Lazutkin
Priority: high Milestone: 1.5
Component: Charting Version: 1.3.2
Keywords: Cc:
Blocked By: Blocking:

Description

I am generating multiple pie charts in a table using the following code.

var mainChart = null;
		var divs = [];
		var row2divs = [];
		var row3divs = [];
		var charts = [];		
		if(this.chartDef.type == "Pie") {
			var div = dojo.byId (this.id + "chart0");
			var table = dojo.doc.createElement("table");			    
			var tableBody = dojo.doc.createElement("tbody");
			var row = dojo.doc.createElement("tr");
			var row2 = dojo.doc.createElement("tr");
			var row3 = dojo.doc.createElement("tr");
			table.style.border = "0";
			for (var i=0; i<this.rows.length; i++) {	
				
				var td = dojo.doc.createElement("td"); 
				td.style.border = "0";
				var div = dojo.byId (this.id + "chart0");
				divs[i] = dojo.doc.createElement('div');
				divs[i].name = this.id + "chart" + i;
				divs[i].id = this.id + "chart" + i;
				dojo.place (divs[i], td, i); 

				charts[i] = new dojox.charting.Chart2D(divs[i]);
				charts[i].setTheme(ibm.tivoli.tip.dijit.themes.ChartTheme);				
				
				charts[i].addPlot("myChart"+i, { 
					type: this.chartDef.type,  
					labels: false,
					hAxis: this.chartDef.xAxis.id, 
					vAxis: this.chartDef.yAxis.id
				}); 			
				
				this.addXAxis (charts[i]);				
				this.addPieSlices (charts[i], i);
				this.addTooltips (charts[i], "myChart"+i);
				this.addEvents (charts[i], "myChart"+i);		
				charts[i].render(); 
				row.appendChild(td);

				var row2td = dojo.doc.createElement("td"); 
				/*row2divs[i] = dojo.doc.createElement('div');
				row2divs[i].name = this.id + "chartLabel" + i;
				row2divs[i].id = this.id + "chartLabel" + i;*/
				var results = this.makeXAxisLabels (this.chartDef.xAxis.dataColumn);
				var label = results[i];
				dojo.place ("<div style="+"text-align:center; font-family:sans-serif"+">"+label.text+"</div>", row2td, i); 
				row2.appendChild(row2td);
				mainChart = charts[i];

			}
			tableBody.appendChild(row);
			tableBody.appendChild(row2);
			
			var row3td = dojo.doc.createElement("td"); 
			row3td.colSpan = 2;
			var serverNameArray = this.makeXAxisLabels (0);	//Argument is the Server Name Column id from widget file
			var serverName = serverNameArray[0];
			dojo.place ("<div style="+"text-align:center; font-family:sans-serif"+">"+serverName.text+"</div>", row3td, 0); 
			row3.appendChild(row3td);
			tableBody.appendChild(row3);

			table.appendChild(tableBody);
			dojo.place (table, div, 0);

The pie charts are rendered correctly in Firefox. But am not able to get the charts on IE(6,7,8).

can anybody let me know what the issue might be?

Thanks

Change History (5)

comment:1 Changed 10 years ago by shakeel

please ignore the statement var div = dojo.byId (this.id + "chart0");

in the for loop..

comment:2 Changed 10 years ago by Eugene Lazutkin

Component: GeneralCharting
Milestone: tbdfuture
Owner: changed from anonymous to Eugene Lazutkin
Status: newassigned

Can you try to render them in in subsequent <div> elements without the table? Just to see if it makes a difference.

comment:3 Changed 10 years ago by shakeel

i tried to render the pie charts without the table..but still am not able to display them.

The thing is that i need to display these charts besides each other, and without the table they will be displayed one above the other.

The code works perfectly in Firefox, but am not able to figure out what is wrong with IE.

comment:4 Changed 10 years ago by Eugene Lazutkin

Please attach a small test file reproducing the problem.

Did you try to run pie chart tests/demos? Some of them show several pie charts on the same page without any problem.

comment:5 Changed 9 years ago by Eugene Lazutkin

Milestone: future1.5
Resolution: worksforme
Status: assignedclosed
Note: See TracTickets for help on using tickets.