XML+XSLT+xalan-j+svg生成地图

XML+XSLT+xalan-j+svg生成地图

schema文件：site.xsd

 

<?xml version="1.0" encoding="UTF-8"?>
<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema" elementFormDefault="qualified" attributeFormDefault="unqualified">
    <xs:element name="note">
        <xs:complexType>
            <xs:sequence>
                <xs:element name="site" maxOccurs="unbounded">
                    <xs:complexType>
                        <xs:sequence>
                            <xs:element name="sitename" type="xs:string"/>
                            <xs:element name="x" type="xs:decimal"/>
                            <xs:element name="y" type="xs:decimal"/>
                            <xs:element name="linksite" maxOccurs="unbounded">
                                <xs:complexType mixed="true">
                                    <xs:attribute name="distance" type="xs:decimal"/>
                                </xs:complexType>
                            </xs:element>
                        </xs:sequence>
                    </xs:complexType>
                </xs:element>
            </xs:sequence>
        </xs:complexType>
    </xs:element>
</xs:schema>

 

xml文件：sitedata.xml

 

<?xml version="1.0" encoding="GB2312"?>
<?xml-stylesheet type="text/xsl" href="sitetosvgmap.xsl"?>

<note xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="D:/study/xml/map/site.xsd">
    <site>
        <sitename>雍和宫</sitename>
        <x>300.5</x>
        <y>40.5</y>
        <linksite distance="200">长城</linksite>
        <linksite distance="400">天坛</linksite>
        <linksite distance="200">新街口</linksite>
    </site>
    <site>
        <sitename>长城</sitename>
        <x>20</x>
        <y>93</y>
        <linksite distance="20">雍和宫</linksite>
        <linksite distance="30">地安门</linksite>
    </site>
    <site>
        <sitename>天坛</sitename>
        <x>100</x>
        <y>23</y>
        <linksite distance="20">雍和宫</linksite>
        <linksite distance="10">前门</linksite>
    </site>
    <site>
        <sitename>地坛</sitename>
        <x>200</x>
        <y>223</y>
        <linksite distance="20">雍和宫</linksite>
        <linksite distance="10">地安门</linksite>
    </site>
    <site>
        <sitename>地安门</sitename>
        <x>200</x>
        <y>23</y>
        <linksite distance="10">地坛</linksite>
    </site>

    <site>
        <sitename>前门</sitename>
        <x>100</x>
        <y>523</y>
        <linksite distance="20">雍和宫</linksite>
        </site>

</note>

 

 

下面这个可是，先贴上代码再说

xslt文件：sitetosvg.xslt

 

<?xml version="1.0" encoding="gb2312"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
    <!--   定义XSLT转换后输出的文件的格式，这里输出为XML格式的文件内容   -->
    <xsl:output method="xml" indent="yes" encoding="UTF-8" version="1.0" standalone="no" media-type="image/svg+xml"/>
    <xsl:template match="note">
        <svg width="100%" height="100%">
        <xsl:for-each select="site">
            <!--得到起始站点的坐标x，y并存入变量中-->
            <xsl:variable name="x" select="x"/>
            <xsl:variable name="y" select="y"/>
            <xsl:variable name="sitename" select="sitename"/>
            <!--根据上面赋值后的变量按坐标输出起始站点的名称-->
            <text x="{$x}" y="{$y}">
            <xsl:value-of select="sitename"/>
            <xsl:value-of select="x"/>
            <xsl:value-of select="y"/>
            </text>

            <!--根据上面赋值后的变量按坐标输出圆圈代表起始站点-->
            <circle cx="{$x}" cy="{$y}" r="4"
            style="fill:white;stroke-width:2;stroke:black;fill-opacity:0"/>

            <!--查找与起始站点直接相连的站点,这块有点晕！！！！！for-each的select表示当前结点的子结点，也就是linksite-->
            <xsl:for-each select="./linksite">

            <xsl:variable name="linkname" select="."/><!--还有这块，是查找当前结点所有的linksite-->

            <xsl:for-each select="/note/site">

            <xsl:if test="sitename=$linkname">
            <xsl:variable name="lx" select="x"/>
            <xsl:variable name="ly" select="y"/>
            <line x1="{$x}" y1="{$y}" x2="{$lx}" y2="{$ly}"
style="stroke:rgb(99,99,99);stroke-width:2"/>
            </xsl:if>
            </xsl:for-each>


            </xsl:for-each>

            </xsl:for-each>

<!--     <xsl:for-each select="/note/site">

            <xsl:if test="sitename='雍和宫'">
            <xsl:variable name="pos" select="position()*30"/>

            <text x="{$pos}" y="400">
            <xsl:value-of select="sitename"/>
            </text>
            </xsl:if>





            <xsl:for-each select="/note/site[sitename=$linkname]">

            <text x="{$x+100}" y="{$y+100}">
            heihei
            </text>

            <xsl:variable name="lx" select="x"/>

            <text x="300" y="300">
            <xsl:value-of select="x"/>
            </text>
            <xsl:variable name="ly" select="y"/>
             <text x="400" y="400">
            <xsl:value-of select="y"/>
            </text>

            <line x1="{$x}" y1="{$y}" x2="{$lx}" y2="{ly}"
               style="stroke:rgb(99,99,99);stroke-width:2" mce_style="stroke:#636363;stroke-width:2"/>


            <text x="{$lx+30}" y="{$ly+40}">
            <xsl:value-of select="sitename"/>
            </text>

            </xsl:for-each>



            </xsl:for-each>
            </xsl:for-each>-->
        </svg>
    </xsl:template>
</xsl:stylesheet>

 

如果要把上面的sitetosvg.xslt转换为带有图形格式的可以用浏览器（装有SVGView）显示的svg文件，需要用到两个jar包，分别是xerces.jar和xalan.jar。

网上有下载这两个文件的，下载后需要配置，这样：

1.配置系统环境变量，将D:/Program Files/Java/jdk1.5.0_22/bin加到path中，前提是安装了jdk

2.将上面提到的两个jar包放到D:/Program Files/Java/jdk1.5.0_22/jre/lib/ext中

3.在cmd中运行命令行： java org.apache.xalan.xslt.Process -IN sitedata.xml -XSL sitetosvg.xslt -OUT map.svg

然后会在跟sitedata.xml 、sitetosvg.xslt 相同的目录下生成map.svg文件，直接打开久可以看到地图了。

 

说明：

1.当初不明白怎么用xslt转换成svg，老郁闷了，现在实现了，但是不尽理想。因为我当时是这样想的：写出xslt文件之后（当然此文件里也需要svg来画图），在网页中用javascript来调用xml文件以及xslt文件，但是很遗憾，不知道咋地，图形显示不出来，我已经试了很多方法。

2.用javascript的方法有一个好处是：每次直接打开网页就可以，不用向上述转换的方式还要用java把xslt转换成svg。也就是说如果xml文件或xslt文件有改动的话，还有用java重新转一次，而javascipt方法就不必这么麻烦。所以，还要在想想办法怎么解决这个问题。

3.就是头疼的xslt还有xpath，因为总是搞不清楚当前结点是什么，还有for-each的多层嵌套。不过试了一天，总算是试出来了。

4.还有一点就是站点的连线有直线表示的，因为还有一个用c++写的求最短路径的程序，所以直接用直线的长度代表曲线的长度了。