Neverguesswho

Auto Adjusting The Size/render As Javascript

Recommended Posts

So when I change width to a percentage when rendering the chart it works fine. When I change the height to a percentage this happens(pic below). Is there a way to get height and width working at the same time? My second question is Can I render the chart using javascript with the code that I have. I the examples create a fusionchart object but when I tried that I couldn't get it to work, so I'd love to keep my current code and if it detects a iphone is opening the page(i'll add that) then it will render the chart using javascript not flash(need help). The htm file is supposed to be .asp but it wouldn't let me upload that.... Thanks in advance for the help

post-28394-0-01511800-1340812582_thumb.jpg

enrollment.htm

Share this post


Link to post
Share on other sites

So when I change width to a percentage when rendering the chart it works fine. When I change the height to a percentage this happens(pic below). Is there a way to get height and width working at the same time? My second question is Can I render the chart using javascript with the code that I have. I the examples create a fusionchart object but when I tried that I couldn't get it to work, so I'd love to keep my current code and if it detects a iphone is opening the page(i'll add that) then it will render the chart using javascript not flash(need help). The htm file is supposed to be .asp but it wouldn't let me upload that.... Thanks in advance for the help

Update, I've got the height width adjustment to work but now I can't get it to render as javascript instead of flash. I can get it to work on my local machine(https://localhost/etc....) but I am unable to get it to work on our website. It just sits there saying chart is loading Here is the updated code! Help :huh:

If you need me to upload code with a different ending let me know.

 

Thanks :lol:

post-28394-0-83978200-1340826164_thumb.jpg

line.htm

Share this post


Link to post
Share on other sites

can't upload text and htm was hard to read so here it all is.... sorry :mellow:

 

Also if I can get this working then my boss wants to buy it, Please help cause I don't want to figure out another method of creating such nice charts ;)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Language=VBScript %>


<html>
<head>


   	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

   	<title>FusionCharts - Database Example</title>
   	<link href="../assets/ui/css/style.css" rel="stylesheet" type="text/css" />
   	<script type="text/javascript" src="jquery.min.js"></script>
   	<script type="text/javascript" src="lib.js"></script>
    	<style type="text/css">
       	h2.headline {
           	font: normal 110%/137.5% "Trebuchet MS", Arial, Helvetica, sans-serif;
           	padding: 0;
           	margin: 25px 0 25px 0;
           	color: #7d7c8b;
           	text-align: center;
       	}
       	p.small {
           	font: normal 68.75%/150% Verdana, Geneva, sans-serif;
           	color: #919191;
           	padding: 0;
           	margin: 0 auto;
           	width: 664px;
           	text-align: center;
       	}
       	body,html,head,div{height:100%; min-height:100%;width:100%; }
   	</style>
	<script LANGUAGE="Javascript" SRC="FusionCharts.js"></SCRIPT>
</head>
<!-- #INCLUDE FILE="FusionCharts.asp" -->
  <!-- #INCLUDE File="NewArray.asp" -->
  <!-- #INCLUDE File="DBConn2.asp" -->
  <!-- #INCLUDE File="RaceandColor.asp" -->
  <!-- #INCLUDE File="FC_Colors.asp" -->
  <!--#include file="FusionCharts_Gen.asp"-->
<!-- some of the strings are in there cause I changed how I was loading the information so just ignore those please -->

<body >

               	<div class="gen-chart-render"  >
<%
 Dim strValue,strCategory, count,hWeek,lWeek,month,year,cateCount,today, diffDate
	dim FC
  ' Create FusionCharts ASP class object  
set FC = new FusionCharts
  ' Set chart type to Multiseries Column3D chart   
Call FC.setChartType("MSLine")
  ' Set chart size  
Call FC.setSize("90%","90%")
  ' Set the relative path of the SWF file   
call FC.setSWFPath("../Evaluation/")
Call FC.setID("NewChart")

  year=2010
  hWeek=8
  lWeek=1
  month=04
  cateCount=0
  Set oConn = Server.CreateObject("ADODB.Connection")	
  count = 1
  Set oRs = Server.CreateObject("ADODB.Recordset")
  oConn.Open strConnQuery

  today=Date()
  strValue="<dataset seriesname='Current' color='0099CC' showValue='1' alpha='100' linethickness='4'>"


  strCategory="<categories>"
 endDate=month&"/"&hWeek&"/"&year
Do While DateDiff("d",CDate(endDate),today)>1
	Do While month<=12 And DateDiff("d",CDate(endDate),today)>1
	diffDate = DateDiff("d",CDate(endDate),today)
		Do While diffDate>1 and hWeek<=31 
		cateCount=cateCount+1
		strQuery= "Select Top 1Max(zCumuEnrolled) AS TotOutput, DateName(mm,zDate) as Date1, DatePart(yyyy,zDate) as Date2 From point.dbo.vRecrruitment where zDate BETWEEN '"&year&"-"&month&"-"&lWeek&"' AND '"&year&"-"&month&"-"&hWeek&"' group by  zDate, zCumuEnrolled ORDER BY zCumuEnrolled DESC "
		Set oRs = oConn.Execute(strQuery)
		strValue= strValue & "<set value='" & oRs("TotOutput") & "' />"
		if count=1 Then 
				 Call FC.addCategory(""&count&"st week of "&oRs("Date1")&" "&oRs("Date2")&"","","")
				hWeek=hWeek+8
			End if
		If  count = 2 then
				Call FC.addCategory("","","")
				hWeek=hWeek+8
				End if
		If count = 3 then
				Call FC.addCategory(""&count&"rd week of "&oRs("Date1")&" "&oRs("Date2")&"","","")
			If month=2 Then
				hWeek=hWeek+4
			ElseIf month=4 Then
				hWeek=hWeek+6
			elseIf month=6 then
				hWeek=hWeek+6
			elseIf month=9 then
				hWeek=hWeek+6
			elseIf month=11 then
				hWeek=hWeek+6	
			Else 
				hWeek=hWeek+7
			End if
			End If

		If count = 4 Then
			Call FC.addCategory("","","")
           	'hoverText='"&count&"th week of "&oRs("Date1")&" "&oRs("Date2")&"'/>"
			hWeek=hWeek+8
			End If
		endDate=month&"/"&lWeek&"/"&year'could be causing trouble
		count=count+1
		lWeek=lWeek+8
		diffDate = DateDiff("d",CDate(endDate),today)
		Loop
		hWeek=8
		lWeek=1
		month=month+1
		count = 1
		endDate=month&"/"&lWeek&"/"&year
	Loop
	month=1
	year=year+1
	endDate=month&"/"&hWeek&"/"&year
Loop

  strCategory = strCategory & "</categories>"
  'START OF CURRENT
year=2010
  hWeek=8
  lWeek=1
  month=04

  Call FC.AddDataset("Current","")
  endDate=month&"/"&hWeek&"/"&year
Do While DateDiff("d",CDate(endDate),today)>1
	Do While month<=12 And DateDiff("d",CDate(endDate),today)>1
	diffDate = DateDiff("d",CDate(endDate),today)
		Do While diffDate>1 and hWeek<=31 
		cateCount=cateCount+1
		strQuery= "Select Top 1Max(zCumuEnrolled) AS TotOutput, DateName(mm,zDate) as Date1, DatePart(yyyy,zDate) as Date2 From point.dbo.vRecrruitment where zDate BETWEEN '"&year&"-"&month&"-"&lWeek&"' AND '"&year&"-"&month&"-"&hWeek&"' group by  zDate, zCumuEnrolled ORDER BY zCumuEnrolled DESC "
		Set oRs = oConn.Execute(strQuery)
		Call FC.addChartData("" & oRs("TotOutput") & "","","")
		if count=1 Then 
				hWeek=hWeek+8
				End if
		If  count = 2 then
				hWeek=hWeek+8
				End if
		If count = 3 then
			If month=2 Then
			hWeek=hWeek+4
			ElseIf month=4 Then
			hWeek=hWeek+6
			elseIf month=6 then
			hWeek=hWeek+6
			elseIf month=9 then
			hWeek=hWeek+6
			elseIf month=11 then
			hWeek=hWeek+6	
			Else 
			hWeek=hWeek+7
			End if
		End If
		If count = 4 Then
			hWeek=hWeek+8
			End If

		count=count+1
		lWeek=lWeek+8
		Loop
		hWeek=8
		lWeek=1
		month=month+1
		count = 1
		 endDate=month&"/"&lWeek&"/"&year
	Loop
	month=1
	year=year+1
	 endDate=month&"/"&lWeek&"/"&year
Loop
 endDate=month&"/"&hWeek&"/"&year




  'START OF TARGET!!!!
  year=2010
  hWeek=8
  lWeek=1
  month=04
endDate=month&"/"&hWeek&"/"&year
  Call FC.AddDataset("Target","")
  	Do While DateDiff("d",CDate(endDate),today)>1
	Do While month<=12 And DateDiff("d",CDate(endDate),today)>1
	diffDate = DateDiff("d",CDate(endDate),today)
		Do While diffDate>1 and hWeek<=31 
		strQuery= "Select Top 1Max(zTarget) AS TotOutput, DateName(mm,zDate) as Date1, DatePart(yyyy,zDate) as Date2 From point.dbo.vRecrruitment where zDate BETWEEN '"&year&"-"&month&"-"&lWeek&"' AND '"&year&"-"&month&"-"&hWeek&"' group by  zDate, zTarget ORDER BY zTarget DESC "
		Set oRs = oConn.Execute(strQuery)
		Call FC.addChartData("" & oRs("TotOutput") & "","","")
		if count=1 Then 
				hWeek=hWeek+8
				End if
		If  count = 2 then
				hWeek=hWeek+8
				End if
		If count = 3 then
			If month=2 Then
			hWeek=hWeek+4
			ElseIf month=4 Then
			hWeek=hWeek+6
			elseIf month=6 then
			hWeek=hWeek+6
			elseIf month=9 then
			hWeek=hWeek+6
			elseIf month=11 then
			hWeek=hWeek+6	
			Else 
			hWeek=hWeek+7
			End if
		End If
		If count = 4 Then
			hWeek=hWeek+8
			End If

		count=count+1
		lWeek=lWeek+8
		Loop
		hWeek=8
		lWeek=1
		month=month+1
		count = 1
		 endDate=month&"/"&lWeek&"/"&year
	Loop
	month=1
	year=year+1
	 endDate=month&"/"&lWeek&"/"&year
Loop
 endDate=month&"/"&hWeek&"/"&year
cateCount=cateCount/2
strparam=" caption='Yearly Enrollment' subcaption='Current vs. Target ' xAxisName='Year' yAxisName='# of People' hovercapbg='FFECAA' hovercapborder='F47E00' formatNumberScale='0' decimalPrecision='0' showvalues='0' numdivlines='4' numVdivlines='"&cateCount&"' yaxisminvalue='0' lineThickness='5' rotateNames='1' bgcolor='F6F5E6' baseFontSize='15' animation='0' shadow ='0' alpha='0' anchorAlpha='0'showshadow='0'"
	call FC.setChartParams(strparam)

 call FC.SetRenderer( "javascript" ) 
 call FC.renderChart(false)
'var myChart = new FusionCharts("FCF_MSLine.swf", "chartdiv1","50%", "50%")   	
' myChart.setXML("strXML")    	
' myChart.render("chartdiv1")  
  Set oRs = Nothing
  oConn.close
    	%>

               	</div>
               	<div class="clear"></div>
               	<p> </p>
               	<p class="small">Or, right click on any pie to enable slicing or rotation mode. </p>



       	<div id="footer">
           	<ul>
               	<li><a href="../index.html"><span>« Back to list of examples</span></a></li>
               	<li class="pipe">|</li>
               	<li><a href="../NoChart.html"><span>Unable to see the chart above?</span></a></li>
           	</ul>
       	</div>

</body>
</html>

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi,

 

With regard to your query, it seems from your code that you are using FusionCharts Free and trying to render the chart in JavaScript mode.

 

Please note that FusionCharts free is a open source Flash charting component which originally was FusionCharts V2.3 and does not support JavaScript Charts.

 

However you can download the latest Evaluation version of FusionCharts XT and test your code.

 

Let me clarify that there is no feature limitation in the Evaluation version of FusionCharts XT, except for the fact that the evaluation version charts are watermarked.

 

Hope this helps!

Share this post


Link to post
Share on other sites

Hi,

 

With regard to your query, it seems from your code that you are using FusionCharts Free and trying to render the chart in JavaScript mode.

 

Please note that FusionCharts free is a open source Flash charting component which originally was FusionCharts V2.3 and does not support JavaScript Charts.

 

However you can download the latest Evaluation version of FusionCharts XT and test your code.

 

Let me clarify that there is no feature limitation in the Evaluation version of FusionCharts XT, except for the fact that the evaluation version charts are watermarked.

 

Hope this helps!

 

I have the evaluation version and this was code from the free version. But I changed some of the code and can get it to work with the evaluation version, I just can't get it to render in javascript. It comes up as a flash object just fine but not javascript(stays "loading")

Share this post


Link to post
Share on other sites
Guest Sumedh

I have the evaluation version and this was code from the free version. But I changed some of the code and can get it to work with the evaluation version, I just can't get it to render in javascript. It comes up as a flash object just fine but not javascript(stays "loading")

 

Hi,

 

For rendering JavaScript charts, it is necessary to add all the JavaScript libraries into your project folder.

 

Copy FusionCharts.js, FusionCharts.HC.js, FusionCharts.HC.Charts.js and jquery.min.js files from Download Pack > Charts folder to FusionCharts folder.

 

These JavaScript files help you easily embed FusionCharts in your page and also render the chart in JavaScript, when viewed on a machine or device that does not support Flash.

 

For more information, please refer the following URL's:

http://docs.fusioncharts.com/charts/contents/?FirstChart/FirstChart.html

 

http://docs.fusioncharts.com/charts/contents/?FirstChart/UsingPureJS.html

 

hope this helps.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now