使用xml和xsl生成javascript

时间:2009-07-21 16:35:17

标签: javascript xml xslt

我已经尝试了我在这里找到的所有解决方案,甚至是更大的Google搜索,但似乎没有任何效果。这是我的问题...我希望使用Google Visualization API可视化XML格式的数据。我希望我可以简单地使用XSL来生成我需要的东西,而不是使用数据源做任何事情(我有我的理由)。但是javascript代码没有显示在我的输出中。这甚至可能吗?

我的XML

<DocumentElement>
  <QueryResults>
    <Year>2000</Year>
    <Population>100000</Population>
  </QueryResults>
  <QueryResults>
    <Year>2001</Year>
    <Population>105000</Population>
  </QueryResults>
</DocumentElement>

我的XSL文件

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="utf-8"/>
<xsl:template match="/">

    <script type="text/javascript" src="http://www.google.com/jsapi"></script>     
    <script type="text/javascript">
        google.load('visualization', '1', {packages:['barchart']});
        google.setOnLoadCallback(drawChart);

        function drawChart() {
            var data = new google.visualization.DataTable();

            data.addColumn('string', 'Year');
            data.addColumn('string', 'Population');
            data.addRows(2); // hard-coded for testing

            <xsl:for-each select="DocumentElement/QueryResults">
                data.setValue(0, 0, '<xsl:value-of select="Year"/>');
                data.setValue(0, 1, '<xsl:value-of select="Population"/>');                 
            </xsl:for-each>

            var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
            chart.draw(data, {width: 400, height: 240, is3D: true, title: 'Population'});
        }
    </script>

    <div id="chart_div">&#160;</div>

</xsl:template>
</xsl:stylesheet>

我的输出

<!-- notice no javascript -->
<div id="chart_div"> </div>

1 个答案:

答案 0 :(得分:2)

XML中包含XSL文件的行是什么样的?我将这两行添加到XML的顶部:

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="test.xsl"?>

结果是正确的,尽管图表实际上没有正确显示数据。它至少被称为。 alt text http://i21.photobucket.com/albums/b296/Bonus_Eruptus/so/xml_chart.jpg