將表格式資料新增至您的 HTML 範本 | Qlik Cloud 說明
跳到主要內容 跳至補充內容

將表格式資料新增至您的 HTML 範本

您可以將應用程式中圖的來源表格作為表格式資料新增至您的 HTML 報告範本。表格式資料可以作為整個表格或作為一個或多個個別欄新增。無論您是將圖作為單一表格標籤還是作為一組個別欄新增,您建立的基礎物件都是一個表格。該表格會作為物件新增至物件面板中,您可以隨時返回該面板進行編輯和重複使用。

具有直表類型超立方的圖可以作為表格式資料新增。當您將圖作為表格新增時,代表圖資料的基礎欄位會作為欄新增至報告中。

您可以在物件面板的 表格 表格 選單中新增表格式資料。

選取表格時,按一下 重新載入 以重新整理應用程式中可用表格的清單。

新增整個圖

您可以使用單一標籤以表格式形式新增整個圖。圖資料會作為直表插入報告中。

  1. HTML 設計工具中,將游標放在程式碼中您想要插入表格的位置。

  2. 按一下物件面板中的 表格

    HTML 設計工具內物件面板中的 表格 選單

    HTML 設計工具中的「表格」選單,您可以從中修改已新增的現有表格,或新增新表格
  3. 按一下 新增表格。將會顯示可用工作表的清單。

  4. 展開包含您想要作為表格新增之圖的工作表。如果需要,您可以搜尋圖的名稱以縮小工作表清單的範圍。

    在新增圖之前,您可以按一下圖的名稱來預覽它。

  5. 按一下圖旁邊的 加號符號 圖示。

  6. 在下拉式選單中,選取 表格。這會將圖作為單一項目插入範本中。

    選取要作為表格新增的圖

    選取要作為表格來源的圖
  7. 在物件面板中,您可以調整:

    • 名稱:為表格提供唯一的名稱,以便您稍後識別它。

    • 說明 (選用):如果需要,為物件新增說明。

    • 篩選條件:個別為物件新增最多一個篩選條件。這可讓您自訂表格中使用的資料,而不會影響其他範本物件中使用的資料。按一下 管理篩選條件 以設定您想要使用的報告篩選條件。如需有關物件層級篩選條件的詳細資訊,請參閱 在報告範本中使用物件層級篩選條件

    將表格作為單一標籤新增的範本設計介面

    在 HTML 範本中顯示代表整個表格的標籤
  8. 您可以在物件面板中調整表格的屬性。如需有關表格式資料格式化屬性的詳細資訊,請參閱 表格式 HTML 資料的格式屬性

  9. 您可以隨時重複使用表格物件。在選項面板中開啟 表格,然後按一下 向右箭頭 以開啟物件。按一下 新增表格標籤 以再次新增表格。

依欄新增圖

圖也可以作為一組單一欄以表格式形式新增。這可讓您在報告範本中增加對格式化的控制。

圖資料會作為直表插入報告中。

  1. HTML 設計工具中,將游標放在程式碼中您想要插入表格欄的位置。

  2. 按一下物件面板中的 表格

    HTML 設計工具內物件面板中的 表格 選單

    HTML 設計工具中的「表格」選單,您可以從中修改已新增的現有表格,或新增新表格
  3. 按一下 新增表格。將會顯示可用工作表的清單。

  4. 展開包含您想要作為表格新增之圖的工作表。如果需要,您可以搜尋圖的名稱以縮小工作表清單的範圍。

    在新增圖之前,您可以按一下圖的名稱來預覽它。

  5. 按一下圖旁邊的 加號符號 圖示。

  6. 在下拉式選單中,選取 個別欄

    選取要依欄作為表格新增的圖

    選取要作為表格來源的圖,並將其作為一組一個或多個個別欄新增
  7. 選取您想要新增的欄,或按一下 全部 以插入圖中的所有欄。

  8. 圖會作為 table 元素新增至範本中,每個欄都表示在其內的 td 元素中。如果您新增單一欄,該欄會改為作為單一項目新增,方式與新增整個表格相同

    在物件面板中,您可以調整:

    • 名稱:為表格提供唯一的名稱,以便您稍後識別它。

    • 說明 (選用):如果需要,為物件新增說明。

    • 篩選條件:個別為物件新增最多一個篩選條件。這可讓您自訂表格中使用的資料,而不會影響其他範本物件中使用的資料。篩選條件會套用至來自相同來源表格的所有欄。

      按一下 管理篩選條件 以設定您想要使用的報告篩選條件。如需有關物件層級篩選條件的詳細資訊,請參閱 在報告範本中使用物件層級篩選條件

    將表格作為一系列個別欄新增的範本設計介面

    代表作為一系列個別欄新增之圖的項目
  9. 您可以在物件面板中調整表格的其他屬性。如需有關表格式資料格式化屬性的詳細資訊,請參閱 表格式 HTML 資料的格式屬性

  10. 您可以隨時重複使用表格物件。在選項面板中開啟 表格,然後按一下 向右箭頭 以開啟物件。按一下 新增表格標籤 以將表格的新執行個體作為單一項目新增,或建立空白表格結構並將每個欄參考個別新增至 td 元素中。

這組欄被視為單一表格物件。

從圖新增更多欄

新增至依欄新增的圖中

在個別新增表格的一些欄之後,您可以隨時新增更多欄。所需的程序取決於原始表格是由一個欄組成,還是由兩個或多個欄組成。

具有一個現有欄的表格

如果您有一個僅個別新增一個欄的表格,則新增新欄的程序會比較複雜。在某些情況下,從一開始就設定多個欄來重新建立物件可能會更容易。不過,您仍然可以將額外的欄新增至單欄表格中。

  1. 在設計介面上,將下列空白表格元素貼到空白區域中:

      <table cellspacing="0" style="border-collapse: collapse">
      <tbody><tr>
      <td></td><td></td><td></td>
      </tr>
      </tbody></table>
  2. 剪下個別欄的現有項目,並將其貼到您剛才新增的其中一個 td 元素中。例如:

      <table cellspacing="0" style="border-collapse: collapse">
      <tbody><tr>
      <td>%%ProductCategory%%</td><td></td><td></td>
      </tr>
      </tbody></table>
  3. 將游標放在現有的個別欄項目上。

    在物件面板中,表格 選單會開啟並展開該欄。

  4. 下方尋找您想要新增的欄。展開它,設定其屬性,然後按一下 新增欄標籤

  5. 針對您想要從來源表格新增的每個新欄,重複步驟 3 到 4。您將需要視需要新增新的 <td></td> 項目,並在完成之前移除所有未使用的 (空白) <td></td> 項目。

執行此程序時,表格仍會是可從物件面板取得的相同表格物件。

具有兩個或多個現有欄的表格

  1. 在 HTML 程式碼中,選取您想要插入欄的位置正左側欄的 td 元素。

    在物件面板中,表格 選單會開啟並展開該欄。

  2. 將下列內容貼到您的範本中,以建立新的 td 元素:

    <td></td>

    然後,將游標放在其開始和結束標籤之間。

  3. 在物件面板中,設定欄的格式化屬性,然後按一下 新增欄標籤

    對欄的參考會插入空白的 td 元素中。

從作為整個表格新增的圖

您可以新增已作為單一表格項目新增之圖的新執行個體。您也可以新增最初作為單一表格項目新增之個別欄的執行個體。

  1. HTML 設計工具中,將游標放在程式碼中您想要插入內容的位置。

  2. 按一下物件面板中的 表格

    表格 選單會開啟。

  3. 按一下現有物件旁邊的 向右箭頭

  4. 執行下列其中一個動作:

    1. 若要將表格的新執行個體作為單一項目新增,請按一下 新增表格標籤

    2. 若要新增單一欄,請按一下 展開欄。設定欄屬性,然後按一下 新增欄標籤。如果將多個欄新增至結構中,您將需要先建立空白表格元素。請參閱 具有一個現有欄的表格

此頁面是否對您有幫助?

若您發現此頁面或其內容有任何問題——錯字、遺漏步驟或技術錯誤——請告知我們!