Recommended Posts

Hi, 

I construct my chart with XML(example.xml) file already with some values.(like below).

<chart  
   dataStreamURL='Here i call the service to provide update'
   caption='Caption' 
   subCaption='SubCaption' 
   refreshInterval='2'
   setAdaptiveYMin='0' 
   yaxismaxvalue='100'
   decimals='45' 
   umdivlines='9' 
   numvdivlines='20'
   numdisplaysets='30' 
   divlinecolor='008040' 
   vdivlinecolor='008040'
   divlinealpha='100' 
   chartleftmargin='10' 
   showRealTimeValue='0'  
   labelDisplay='Rotate'
   slantlabels='1' 
   showlabels='1'
   bgColor = '#E6E6FA'
   useMessageLog='1'
   messageLogWPercent='80'
   essageLogHPercent='80'
   messageLogShowTitle='1'
   messageLogTitle='1'
   messageLogColor='000'
   messageGoesToLog='0'
   messageGoesToJS='1'
   messageJSHandler='myFunction'
   messagePassAllToJS='1'>
   <categories>   
    <category label='17:08:00' />
    <category label='17:09:00' />
    <category label='17:10:00' />
    <category label='17:11:00' />
    <category label='17:12:00' />
    <category label='17:13:00' />
    <category label='17:14:00' />
    <category label='17:15:00' />
    <category label='17:16:00' />
   </categories>
   <dataset color='00dd00' seriesName='Valor x' showValues='0' alpha='100' anchorAlpha='0' lineThickness='2'>      
    <set value='10' />
    <set value='52' />
    <set value='98' />
    <set value='71' />
    <set value='45' />
    <set value='25' />
    <set value='37' />
    <set value='10' />
    <set value='5' /> 
  </dataset>
  <dataset color='ff5904' seriesName='Valor y' showValues='0' alpha='100' anchorAlpha='0' lineThickness='2'>
    <set value='25' />
    <set value='37' />
    <set value='90' />
    <set value='80' />
    <set value='25' />
    <set value='37' />
    <set value='98' />
    <set value='89' />
    <set value='11' />  
  </dataset>
</chart>

ps.: This attributes (messageGoesToJS='1', messageJSHandler='myFunction') enables the chart to look for the function(myFunction) on the page.

 

And my XTML(page.xhtml) page is: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/templates/main.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

   <ui:define name="content">
      <h:outputScript library="js" name="fusioncharts/FusionCharts.js" />
      <div id="myDivId" style="margin-left: auto 0px; padding-left: 280px; padding-top: 50px;"/> 
      <script type="text/javascript" >
       var chart1 = new FusionCharts("../resources/js/fusioncharts/RealTimeLine.swf", "myChartId", "700px", "500px", "0", "0");
		chart1.setXMLData("example.xml");
		chart1.render("myDivId");
			
		function myFunction(strMsgId, strMsgTitle, strMsgText, strMsgType){
		   if(strMsgTitle == 1){                	
            	      var chartReference = FusionCharts(strMsgText);  
		      chartReference.setChartAttribute({"bgColor" : "#FF0000"});			
		      chartReference.setChartAttribute({"subCaption" : "ALERTA"});
                  }
                  if(strMsgTitle == 2){
             	     var chartReference2 = FusionCharts(strMsgText); 
             	     chartReference2.setChartAttribute({"bgColor" : "#FFFFFF"});
             	     chartReference2.setChartAttribute({"subCaption" : "Normal"});
                  }
		}	
	</script>
  </ui:define>
</ui:composition> 

I have a service who provide update to chart. I call this service via tag 'dataStreamUrl' and this service return to chart the string for example:

 

"&label=16:40:09&value=186.27|36.5&msgId=1&msgTitle=0&msgText=transacaoFicticia&msgType=INFO"

 

In this point the chart is updated with success.

But i need to change attributes according by my business rule.

So when i need to change the bgColor for example i change the flag number in string update like below:

 

"&label=16:40:09&value=186.27|36.5&msgId=1&msgTitle=1&msgText=transacaoFicticia&msgType=INFO"

 

ps.: "msgTitle=1" activating flag and "msgText=transacaoFicticia" is my chart id.

 

When i do it(flag 1) the function(myFunction) in xhtml page is executed because de XML attribute enable it.

When the js function(myFunction) is executed  the chart is updated with the new bgColor and subCaption.
However when chart is updated, he is re-drawed completely and lose the data that came from the update service yet. 
The chart is re-rendered with the original XML data from above that are in memory.
 

---------------------------------------------------------------------------------------------------------------------------------------------------

 

So I need to preserve the data that came from the update service when I change some attribute of the chart like bgColor.

Can someone help me? 

 

ps.: I'm using @version fusioncharts/3.3.1-sr3.21100. 

 

Edited by Maycon Lima

Share this post


Link to post
Share on other sites

Hi Maycon,

 

Welcome to FusionCharts Forum Post.

 

No, its not possible to update the chart attributes for a Real Time chart on every update. Since "setChartAttrubute" method,  will reload the chart itself with changed data when a new attribute set.

 

So, updating "bgColor" and "subCaption" depending on the real time update is not feasible.

 

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