Visualizzazione dei risultati da 1 a 2 su 2
  1. #1

    [XSLT + SVG] Inserire lista orizzontale di elementi.

    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
    Linux user number 395693| Acer TravelMate 4672WMLI powered by GNU/Linux Ubuntu 7.10

  2. #2
    Uppete..
    Linux user number 395693| Acer TravelMate 4672WMLI powered by GNU/Linux Ubuntu 7.10

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.