Applicazione della formattazione HTML

È possibile applicare elementi di stile CSS inline durante la creazione di modelli nell'editor modelli HTML.

Test

È possibile utilizzare i file di esempio di Qlik per creare l'app. Per scaricare questi file, vedere: File di esempio (solo in lingua inglese).

Consentire l'applicazione di elementi dello stile in linea CSS a un intero grafico

Dopo avere aggiunto un oggetto come tabella:

Procedere come segue:

1. Se le Proprietà sono visibili, passare al punto 3. In caso contrario, fare clic con il pulsante destro del mouse sul nodo Tabelle.
2. Selezionare Proprietà.
3. Deselezionare la casella di controllo Keep Source Formats.

In questo modo, il contenuto di tutte le celle in tutte le colonne della tabella verrà esportato da QlikView senza formattazione e verranno applicati gli elementi dello stile in linea CSS impostati nel modello HTML. Confrontare il risultato con l'opzione Keep Source Formats selezionata e deselezionata.

Consentire l'applicazione di elementi dello stile in linea CSS a colonne specifiche

Verificare che l'oggetto tabella in uso sia una tabella lineare in QlikView. Le tabelle pivot di QlikView devono essere convertite in tabelle lineari prima di selezionarle per includerle nel nodo Tabelle di Qlik NPrinting. In caso contrario, non sarà possibile accedere a singoli campi/colonne. Per mantenere la formattazione di origine per la maggior parte delle colonne, lasciare la casella di controllo Keep Source Formats selezionata per l'intera tabella e procedere come segue:

1. Espandere il nodo della tabella.
2. Fare clic sulle colonne a cui si desidera applicare gli elementi dello stile in linea CSS.
3. Deselezionare la casella di controllo Keep Source Formats.

4. Quando la casella di controllo HTML Encode è selezionata, tutti i simboli non alfanumerici (come < e />) che potrebbero essere interpretati come elementi del tag HTML verranno convertiti in entità HTML.

   Quando la casella di controllo HTML Encode è deselezionata, tutti i simboli non alfanumerici che potrebbero essere interpretati come elementi del tag HTML verranno rappresentati dal codice HTML di base utilizzato nell'editor modelli di Qlik NPrinting HTML.

In questo modo, il contenuto di tutte le celle nella colonna selezionata della tabella verrà esportato da QlikView senza formattazione, tuttavia le colonne conterranno tutti gli elementi dello stile in linea CSS applicati all'interno del modello HTML. Questa operazione può essere eseguita per tutte le singole colonne che si desidera.

Applicare un formato a una colonna

Procedere come segue:

1. In HTML Report (Sales) selezionare Gross Profit.
2. Immettere $#.##,00 nel campo Format.

Creare la tabella

Procedere come segue:

1. Creare una tabella HTML con una riga di celle di dati. Il codice sorgente dovrà avere questo aspetto:

   <table>
    	<tr>
   	<td></td> <td></td> <td></td>
   	</tr>
   </table>

2. Trascinare le icone dei nodi delle colonne della tabella tra i tag delle celle di dati della tabella.

   È possibile selezionare più valori tenendo premuto CTRL o MAIUSC durante la selezione delle colonne, quindi trascinarli e rilasciarli nel modello. In questo modo, verranno creati tutti i tag che verranno inseriti in una serie orizzontale di celle.

   La casella di controllo Keep Source Formats è stata deselezionata per la colonna Gross Profit.

3. Inserire un'altra riga sopra alla prima.
4. Nella nuova riga, inserire le celle di intestazione della tabella.
5. Immettere le intestazioni desiderate.
6. Riaprire una alla volta le finestre di dialogo Proprietà per ciascuna colonna aggiunta al modello.

7. Fare clic nella colonna Value della riga Show Header. La cella presenterà il valore Mostra.

8. Fare clic sul pulsante del menu a discesa che verrà visualizzato e selezionare Nascondi.

Questa è la tabella originale creata deselezionando la casella di controllo Keep Source Formats per due colonne, aggiungendo una riga di intestazione e nascondendo le intestazioni originali della tabella per ciascuna colonna.

Applicare elementi dello stile in linea

In questo caso, l'output di esempio è semplice, ma fornisce un'idea sulle possibilità.

Di seguito è riportato il codice completo:

<html>
	<body>
		<table cellspacing=0 style="border-collapse:collapse;">      
			<tr style="width:0*;                             font-family:Verdana;                             font-size:small;                             font-variant:small-caps;">           
				<th style="border:grey dashed 1px;">               Product Name         </th>           		
				<th style="border:grey dashed 1px;">               Total Sales          </th>           
				 <th style="border:grey dashed 1px;">               Gross Profit          </th>           
				 <th style="border:grey dashed 1px;">               GP%          </th>           
				 <th style="border:grey dashed 1px;">               Quantity          </th>        
			 </tr>        
			 <tr>           
				<td style="width:0*;                                font-family:Verdana;                                font-size:small;                                font-weight:bold;                                font-variant:small-caps;">               %%ProductName%%          </td>           
				 <td>             %%Total Sales%%          </td>           
				 <td>               %%Gross Profit%%          </td>           
				 <td>               %%GP%_1%%          </td>           
				 <td style="width:0*;                                 color:red;                                 font-family:Georgia;                                 font-size-adjust:0.40;                                 background-color:Yellow;                                 border:green solid 2px;                                 text-align:right;">               %%Quantity_1%%          </td>        
			</tr>
		</table>
	</body>
</html>