使用高圖表

開啟 QuickSight 主控台。

開啟您要新增 Highcharts 視覺效果的 QuickSight 分析。

選擇應用程式列上的新增，然後選擇新增視覺效果。

在視覺效果類型窗格中，選擇高圖表視覺效果圖示。分析表上會顯示空的視覺效果，屬性窗格則會在左側開啟。

在屬性窗格中，展開顯示設定區段，並執行下列動作：

1. 針對編輯標題，選擇畫筆圖示，輸入您希望視覺效果擁有的標題，然後選擇儲存。或者，選擇眼球圖示來隱藏標題。

2. （選用） 對於編輯字幕，選擇畫筆圖示，輸入您希望視覺效果的字幕，然後選擇儲存。或者，選擇眼球圖示來隱藏字幕。

3. （選用） 針對 Alt 文字，新增您希望視覺效果擁有的 alt 文字。

展開資料點限制區段。對於要顯示的資料點數量，輸入您希望視覺效果顯示的資料點數量。高圖表視覺效果最多可顯示 10，000 個資料點。

展開圖表程式碼區段，如下圖所示。

在圖表程式碼 JSON 編輯器中輸入 JSON 結構描述。編輯器提供內容協助和即時驗證，以確保輸入 JSON 已正確設定。您可以在錯誤下拉式清單中檢視 QuickSight 識別的任何錯誤。以下範例顯示 JSON 結構描述，該結構描述會建立顯示產業當年銷售額的口紅圖表。

{
  "xAxis": {
    "categories": ["getColumn", 0]
  },
  "yAxis": {
    "min": 0,
    "title": {
      "text": "Amount ($)"
    }
  },
  "tooltip": {
    "headerFormat": "<span style='font-size:10px'>{point.key}</span><table>",
    "pointFormat": "<tr><td style='color:{series.color};padding:0'>{series.name}: </td><td style='padding:0'><b>${point.y:,.0f}</b></td></tr>",
    "footerFormat": "</table>",
    "shared": true,
    "useHTML": true
  },
  "plotOptions": {
    "column": {
      "borderWidth": 0,
      "grouping": false,
      "shadow": false
    }
  },
  "series": [
    {
      "type": "column",
      "name": "Current Year Sales",
      "color": "rgba(124,181,236,1)",
      "data": ["getColumn", 1],
      "pointPadding": 0.3,
      "pointPlacement": 0.0
    }
  ]
}

選擇套用程式碼。QuickSight 會將 JSON 結構描述轉換為顯示在分析中的視覺效果。若要變更轉譯的視覺效果，請在 JSON 結構描述中更新適當的屬性，然後選擇套用程式碼。下圖顯示使用上一個步驟的 JSON 結構描述建立的口紅圖表。

（選用） 開啟參考下拉式清單，以存取實用 Highctarts 參考材料的連結。