Primefaces数据表列中的FusionChart显示

时间:2012-04-20 10:18:34

标签: primefaces

我正在尝试将Fusion图表整合到prime-faces数据表列中。

这是代码:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"      
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui">

    <h:head>
        <title>Custom Rendering Data Table Test</title>
            <link rel="stylesheet" type="text/css" href="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/css/ext-all.css"/> 
            <script type="text/javascript" src="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/FusionCharts/FusionCharts.js">    </script>
            <script type="text/javascript" src="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/js/ext-base.js"></script>
            <script type="text/javascript" src="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/js/ext-all.js"></script>
            <script type="text/javascript" src="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/js/ext-debug.js"></script>

            <script type="text/javascript">      
                function myJS(myVar)
                {     
                    var split = myVar.split(',');  
                    var label =  split[0];
                    var value =  split[1];
                    window.alert("You clicked on " + label + " which has a value of" + value);      
                }
            </script>
    </h:head>
    <h:body>
        <p:layout fullPage="true">
            <p:layoutUnit position="center">
                <p:dataTable var="car" value="#{tableBean.mediumCarsModel}" selection="#{tableBean.selectedCar}" 
                scrollrows="2" id="carList" paginator="true" rows="10" editable="true">  

        <f:facet name="header">  
            In-Cell Editing  
        </f:facet>

        <p:column selectionMode="multiple" style="width:18px"/>  

        <p:column headerText="User Name" style="width:100px">

        <!-- <p:graphicImage value="#{car.image}"/>-->

        <p:graphicImage value="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent\images/rssLogo.gif" rendered="#{car.year lt 1990}"/>
        <p:graphicImage value="C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/images/System.gif" rendered="#{car.year ge 1990}"/>


            <p:cellEditor>  
                <f:facet name="output">  
                    <h:outputText value="#{car.username}" />  
                </f:facet>  
                <f:facet name="input">  
                    <p:inputText value="#{car.username}" style="width:100%"/>  
                </f:facet>  
            </p:cellEditor>  
        </p:column> 


        <p:column headerText="Model" style="width:125px">  
            <p:cellEditor>  
                <f:facet name="output">  
                    <h:outputText value="#{car.model}" />  
                </f:facet>  
                <f:facet name="input">  
                    <p:inputText value="#{car.model}" style="width:100%"/>  
                </f:facet>  
            </p:cellEditor>  
        </p:column>  

        <p:column headerText="Year" style="width:125px">  
            <p:cellEditor>  
                <f:facet name="output">  
                    <h:outputText value="#{car.year}" />  
                </f:facet>  
                <f:facet name="input">  
                    <p:inputText value="#{car.year}" style="width:100%" label="Year"/>  
                </f:facet>  
            </p:cellEditor>  
        </p:column>  

        <p:column headerText="Manufacturer" style="width:125px">  
            <p:cellEditor>  
                <f:facet name="output">  
                    <h:outputText value="#{car.manufacturer}" />  
                </f:facet>  
                <f:facet name="input">  
                    <h:selectOneMenu value="#{car.manufacturer}" >  
                        <f:selectItems value="#{tableBean.manufacturers}"  
                            var="man"   
                            itemLabel="#{man}"  
                            itemValue="#{man}" />  
                    </h:selectOneMenu>  
                </f:facet>  
            </p:cellEditor>  
        </p:column>  

        <p:column headerText="Color" style="width:125px">  
            <p:cellEditor>  
                <f:facet name="output">  
                    <h:outputText value="#{car.color}" />  
                </f:facet>  
                <f:facet name="input">  
                    <h:selectOneMenu value="#{car.color}" >  
                        <f:selectItems value="#{tableBean.colors}"  
                            var="color"   
                            itemLabel="#{color}"  
                            itemValue="#{color}" />  
                    </h:selectOneMenu>  
                </f:facet>  
            </p:cellEditor>  
        </p:column>  

        <p:column headerText="Options" style="width:1000px">  
            <!-- <p:rowEditor />-->  
      <div id="chartContainer" style="background:yellow">FusionCharts will load here!</div>
            <script type="text/javascript">
        FusionCharts.setCurrentRenderer('javascript');              
        var myChart = new FusionCharts( "C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/FusionCharts/StackedColumn2D.swf", "myChartId", "400", "300", "1", "1" );      
        myChart.setXMLUrl("C:\raman\AMAP\POC\primefaces\JSF2.0HelloWorld\WebContent/xml/Data.xml");      
        myChart.render("chartContainer");                           

        </script>

        </p:column>  

    </p:dataTable>  
            </p:layoutUnit>
        </p:layout>  

    </h:body>
</html>

我已经包含了所有强制性的Fusion图表JS文件。我试图在最后一栏显示融合图。

相同的Fusion图表代码只能在单独的html文件中正常工作,但它不能在这里工作。

如果我错过了什么,请告诉我......

0 个答案:

没有答案