Ciao a tutti,

ho un foglio di stile XSLT che transforma un file XML:

codice:
<?xml version="1.0" encoding="UTF-8"?>

<graphic>

  <page>

    <id>page_1</id>

    <visible>true</visible>

    <concepts>

      <concept>

        <id>Car_1</id>

        <rectangle>

          <id>Car_1_rect</id>

          <x>650.0</x>

          <y>160.0</y>

          <width>150.0</width>

          <height>40.0</height>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </rectangle>

        <text>

          <id>Car_1_text</id>

          <x>720.0</x>

          <y>180.0</y>

          <content>Car</content>

        </text>

      </concept>

      <concept>

        <id>SW_1</id>

        <rectangle>

          <id>SW_1_rect</id>

          <x>506.0</x>

          <y>260.0</y>

          <width>150.0</width>

          <height>40.0</height>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </rectangle>

        <text>

          <id>SW_1_text</id>

          <x>525.0</x>

          <y>280.0</y>

          <content>StationWagon</content>

        </text>

      </concept>

      <concept>

        <id>SUV_1</id>

        <rectangle>

          <id>SUV_1_rect</id>

          <x>805.0</x>

          <y>260.0</y>

          <width>150.0</width>

          <height>40.0</height>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </rectangle>

        <text>

          <id>SUV_1_text</id>

          <x>855.0</x>

          <y>280.0</y>

          <content>SUV</content>

        </text>

      </concept>

      <concept>

        <id>Person_1</id>

        <rectangle>

          <id>Person_1_rect</id>

          <x>306.0</x>

          <y>160.0</y>

          <width>150.0</width>

          <height>40.0</height>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </rectangle>

        <text>

          <id>Person_1_text</id>

          <x>355.0</x>

          <y>180.0</y>

          <content>Person</content>

        </text>

      </concept>

    </concepts>

    <objectproperties>

      <objectproperty>

        <id>PHC_1</id>

        <domain>

          <id>Person_1</id>

        </domain>

        <range>

          <id>Car_1</id>

        </range>

        <line>

          <id>PHC_1_line</id>

          <x1>456.0</x1>

          <x2>650.0</x2>

          <y1>180.0</y1>

          <y2>180.0</y2>

        </line>

        <text>

          <id>PHC_1_text</id>

          <x>500.0</x>

          <y>175.0</y>

          <content>PersonHasCar</content>

        </text>

      </objectproperty>

    </objectproperties>

    <dataproperties>

      <dataproperty>

        <id>PersonName_1</id>

        <domain>

          <id>Person_1</id>

        </domain>

        <ellipse>

          <id>PersonName_1_ellipse</id>

          <cx>300.0</cx>

          <cy>75.0</cy>

          <rx>50.0</rx>

          <ry>25.0</ry>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </ellipse>

        <line>

          <id>PersonName_1_line</id>

          <x1>300.0</x1>

          <x2>381.0</x2>

          <y1>100.0</y1>

          <y2>160.0</y2>

        </line>

        <text>

          <id>PersonName_1_text</id>

          <x>280.0</x>

          <y>75.0</y>

          <content>Name</content>

        </text>

      </dataproperty>

      <dataproperty>

        <id>CarID_1</id>

        <domain>

          <id>Car_1</id>

        </domain>

        <ellipse>

          <id>CarID_1_ellipse</id>

          <cx>900.0</cx>

          <cy>170.0</cy>

          <rx>50.0</rx>

          <ry>25.0</ry>

          <style>

            <fill>yellow</fill>

            <stroke>blue</stroke>

            <opacity>0.5</opacity>

            <stroke-width>5</stroke-width>

          </style>

        </ellipse>

        <line>

          <id>CarID_1_line</id>

          <x1>850.0</x1>

          <x2>800.0</x2>

          <y1>170.0</y1>

          <y2>180.0</y2>

        </line>

        <text>

          <id>PHC_1_text</id>

          <x>890.0</x>

          <y>170.0</y>

          <content>Id</content>

        </text>

      </dataproperty>

    </dataproperties>

  </page>

  <page>

    <id>page_2</id>

    <visible>false</visible>

    <concepts />

    <objectproperties />

    <dataproperties />

  </page>

</graphic>
in un disegno SVG:

codice:
 
<xsl:stylesheet version="2.0"
	xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
	xmlns="http://www.w3.org/2000/svg"
	xmlns:xlink="http://www.w3.org/1999/xlink"
	xmlns:xs="http://www.w3.org/2001/XMLSchema"
	xmlns:xdt="http://www.w3.org/2005/02/xpath-datatypes"
	exclude-result-prefixes="xs xdt">

	
	<xsl:output method="xml" media-type="image/svg+xml" indent="yes" encoding="ISO-8859-1" />

	<xsl:template match="graphic">
		<svg id="onto" width="100%" height="100%">
            <script type="text/ecmascript" xlink:href="../js/prototype-1.6.0.3.js"></script>
            <script type="text/ecmascript" xlink:href="../js/onto.js"></script>
            
           
			<xsl:apply-templates select="page" />
		</svg>
	</xsl:template>

	<xsl:template match="page">
		<xsl:if test="visible = 'false'">
			<g id="{id}" style="display:none;">
				<xsl:for-each select="concepts">
					<xsl:apply-templates select="concept" />
				</xsl:for-each>
				<xsl:for-each select="objectproperties">
					<xsl:apply-templates select="objectproperty" />
				</xsl:for-each>
				<xsl:for-each select="dataproperties">
					<xsl:apply-templates select="dataproperty" />
				</xsl:for-each>
			</g>
		</xsl:if>
		<xsl:if test="visible = 'true'">
			<g id="{id}" style="display:block;">
					<xsl:for-each select="concepts">
						<xsl:apply-templates select="concept" />
					</xsl:for-each>
					<xsl:for-each select="objectproperties">
						<xsl:apply-templates select="objectproperty" />
					</xsl:for-each>
					<xsl:for-each select="dataproperties">
						<xsl:apply-templates select="dataproperty" />
					</xsl:for-each>
			</g>
		</xsl:if>

		<xsl:variable name="offset" select="150" as="xs:integer" />
			<text
		 		xml:space="preserve"
		 		style="font-size:18.13334846px;font-style:normal;font-weight:normal;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;font-family:Bitstream Vera Sans"
		 		x="5+$offset"
		 		y="461"
		 		id="{id}_text"><xsl:value-of select="id"/></text>
			<rect
			 	id="{id}_rect"
			 	x="5+$offset"
			 	y="446"
			 	width="100"
			 	height="20"
			 	onclick="clearAll()"
			 	style="opacity:0.5;fill:#800080;stroke:#000000;stroke-width:1" />

	</xsl:template>
	<xsl:template match="concept">
		<g id="{id}">
			<rect id="{rectangle/id}" onclick="parseXML();" x="{rectangle/x}" y="{rectangle/y}" rx="10" ry="10" width="{rectangle/width}" height="{rectangle/height}" fill="{rectangle/style/fill}" opacity="{rectangle/style/opacity}" stroke="{rectangle/style/stroke}"/>
			<text id="{text/id}" x="{text/x}" y="{text/y}">
				<xsl:value-of select="text/content" />
			</text>
		</g>
	</xsl:template>
	<xsl:template match="objectproperty">
		<g id="{id}">
			<line id="{line/id}" x1="{line/x1}" x2="{line/x2}" y1="{line/y1}" y2="{line/y2}" 
				width="{rectangle/width}" height="{rectangle/height}" stroke="blue" stroke-width="2" opacity="0.5"/>
			<text id="{text/id}" x="{text/x}" y="{text/y}">
				<xsl:value-of select="text/content" />
			</text>
		</g>
	</xsl:template>
	
	<xsl:template match="dataproperty">
		<g id="{id}">
			<ellipse id="{ellipse/id}" cx = "{ellipse/cx}" cy="{ellipse/cy}" rx="{ellipse/rx}" ry="{ellipse/ry}" fill="{ellipse/style/fill}" opacity="{ellipse/style/opacity}" stroke="{ellipse/style/stroke}"/>
			<line id="{line/id}" x1="{line/x1}" x2="{line/x2}" y1="{line/y1}" y2="{line/y2}" 
				width="{rectangle/width}" height="{rectangle/height}" stroke="blue" stroke-width="5" opacity="0.5"/>
			<text id="{text/id}" x="{text/x}" y="{text/y}">
				<xsl:value-of select="text/content" />
			</text>
		</g>
	</xsl:template>
	
</xsl:stylesheet>
Nella parte evidenziata creo un bottone (rettangolo + testo) per ogni pagina. Quello che vorrei fare è avere una lista orrizontale di bottoni. Ovviamente ora i bottoni sono sovrapposti. Come posso fare per incrementare la variabile in modo tale che i bottoni non siano più sovrapposti?

Grazie,

Giorgio