カスタムカラーパレットをインポートする

独自の RGB カラーパレットをワークスペースに読み込むことで、レポートの色をカスタマイズできます。

カラーパレットの概要

カラーパレットをインポートすると、カスタム色をレポートで使用できるようになります。

前提条件

  • カスタムカラーパレットをインポートするには、ワークスペース管理者として GoodData ポータルにサインインする必要があります。 次の手順でエラーが発生した場合は、別のタブまたはウィンドウでポータルを再ロードしてください。 ログインを要求されたら、ログインします。
  • カスタムカラーパレットをインポートするには、REST APIクライアントが必要です。

新しいカラーパレットを作成する

既定のカラーパレットを独自の色で置き換えます。 必要に応じて、既定のパレットに戻すことができます。その場合、アップロードしたカスタムパレットを削除します。 

 

  1. 色を定義する  カラーパレットの各色は、RGB形式で定義されています。

  2. ワークスペースのスタイル設定のURLを入力します。  以下のURLをRESTクライアントのURLフィールドに貼り付けます。

    https://secure.gooddata.com/gdc/projects/<project_ID>/styleSettings

    <project_ID> を、カラーパレットをロードするワークスペースの ID に置き換えます。 ワークスペースIDは、ワークスペース内のどのページのURLを使っても特定できます。

    https://secure.gooddata.com/#s=/gdc/projects/<project_id>|objectPage|/...

    URLの「projects/」の後からパイプ記号 (|) の前までの部分をコピーします。  

  3. REST クライアント設定を確定します。 REST クライアント URL フィールドの正しいセクションにワークスペース ID を挿入したら、適切なフィールドに次の設定を入力します：

    • メソッド： PUT

    • リソース： https://secure.gooddata.com/gdc/projects/{workspace_id}/styleSettings

    •  ヘッダー： Content-Type: application/json

    • 本文： 手順4を参照してください。

  4. カラーパレットをJSONオブジェクトとして入力します。

    リクエストの本文には、カラーパレットをJSONオブジェクトとして入力してください。 例として、4色のカラーパレットの構文を以下に示します。各行は、RGB値で定義されたパレットの別の色を表す「guid」から始まります。

    {"styleSettings" : {"chartPalette": [ { "guid": "guid1", "fill": { "r":255, "g":0, "b":0 } }, { "guid": "guid2", "fill": { "r":255, "g":255, "b":0 } }, { "guid": "guid3", "fill": { "r":0, "g":0, "b":255 } }, { "guid": "guid4", "fill": { "r":255, "g":0, "b":255 } } ] } }

    JSONになじみがない場合には、上記の色の値の代わりに独自のRGB値を挿入するための構造として、この例を使用するとよいでしょう。 行の 2 番目の値を「guid5」、「guid6」、「guid7」などに変更する前に、例の行を複製してパレットに色を追加します。 各行の 2 番目の値は固有の値にして下さい。

カラーパレット例1

黄色を強調したワークスペースの例です。

Yellow-toned palette

{"styleSettings" : {"chartPalette": [ { "guid": "guid1", "fill": { "r":255, "g":255, "b":0 } }, { "guid": "guid2", "fill": { "r":255, "g":255, "b":40 } }, { "guid": "guid3", "fill": { "r":255, "g":255, "b":80 } }, { "guid": "guid4", "fill": { "r":255, "g":255, "b":120 } }, { "guid": "guid5", "fill": { "r":255, "g":255, "b":180 } }, { "guid": "guid6", "fill": { "r":255, "g":255, "b":200 } } ] } }

カラーパレット例2

ここでは、パートナーから提供されたもう 1 つの例を紹介します Keboola。

Palette

{"styleSettings" : {"chartPalette": [ { "guid": "guid1", "fill": { "r":255, "g":0, "b":0 } }, { "guid": "guid2", "fill": { "r":255, "g":102, "b":0 } }, { "guid": "guid3", "fill": { "r":255, "g":102, "b":0 } }, { "guid": "guid4", "fill": { "r":255, "g":153, "b":0 } }, { "guid": "guid5", "fill": { "r":255, "g":153, "b":0 } }, { "guid": "guid6", "fill": { "r":255, "g":204, "b":0 } }, { "guid": "guid7", "fill": { "r":255, "g":204, "b":0 } }, { "guid": "guid8", "fill": { "r":204, "g":204, "b":0 } }, { "guid": "guid9", "fill": { "r":153, "g":204, "b":0 } }, { "guid": "guid10", "fill": { "r":102, "g":204, "b":0 } }, { "guid": "guid11", "fill": { "r":255, "g":102, "b":0 } }, { "guid": "guid12", "fill": { "r":255, "g":153, "b":0 } }, { "guid": "guid13", "fill": { "r":255, "g":153, "b":0 } }, { "guid": "guid14", "fill": { "r":255, "g":204, "b":0 } }, { "guid": "guid15", "fill": { "r":255, "g":204, "b":0 } }, { "guid": "guid16", "fill": { "r":153, "g":204, "b":0 } }, { "guid": "guid17", "fill": { "r":153, "g":204, "b":0 } }, { "guid": "guid18", "fill": { "r":102, "g":204, "b":0 } }, { "guid": "guid19", "fill": { "r":0, "g":153, "b":51 } }, { "guid": "guid20", "fill": { "r":0, "g":153, "b":153 } }, { "guid": "guid21", "fill": { "r":0, "g":102, "b":153 } }, { "guid": "guid22", "fill": { "r":51, "g":102, "b":153 } }, { "guid": "guid23", "fill": { "r":51, "g":51, "b":153 } }, { "guid": "guid24", "fill": { "r":51, "g":51, "b":153 } }, { "guid": "guid25", "fill": { "r":102, "g":51, "b":153 } }, { "guid": "guid26", "fill": { "r":153, "g":0, "b":153 } }, { "guid": "guid27", "fill": { "r":204, "g":0, "b":102 } }, { "guid": "guid28", "fill": { "r":204, "g":0, "b":51 } }, { "guid": "guid29", "fill": { "r":255, "g":51, "b":0 } }, { "guid": "guid30", "fill": { "r":255, "g":102, "b":0 } }, { "guid": "guid31", "fill": { "r":0, "g":204, "b":0 } }, { "guid": "guid32", "fill": { "r":0, "g":153, "b":102 } }, { "guid": "guid33", "fill": { "r":0, "g":153, "b":153 } }, { "guid": "guid34", "fill": { "r":0, "g":102, "b":153 } }, { "guid": "guid35", "fill": { "r":51, "g":51, "b":153 } }, { "guid": "guid36", "fill": { "r":102, "g":51, "b":153 } }, { "guid": "guid37", "fill": { "r":102, "g":0, "b":153 } }, { "guid": "guid38", "fill": { "r":153, "g":0, "b":153 } }, { "guid": "guid39", "fill": { "r":153, "g":0, "b":102 } }, { "guid": "guid40", "fill": { "r":204, "g":0, "b":51 } } ] } }

既存のカラーパレットを更新する

新しいカラーパレットに置き換えるのではなく、既存のカラーパレットを更新する場合は、次のようにJSONコードを開始します。このコードでは、最初に既定のパレット色を定義し、「guid18」の下の追加行として独自の色を追加します。

Palette from Keboola

{"styleSettings" : {"chartPalette": [ { "guid": "guid1", "fill": { "r":43, "g":107, "b":174 } }, { "guid": "guid2", "fill": { "r":105, "g":170, "b":81 } }, { "guid": "guid3", "fill": { "r":238, "g":177, "b":76 } }, { "guid": "guid4", "fill": { "r":213, "g":60, "b":56 } }, { "guid": "guid5", "fill": { "r":137, "g":77, "b":148 } }, { "guid": "guid6", "fill": { "r":115, "g":115, "b":115 } }, { "guid": "guid7", "fill": { "r":68, "g":169, "b":190 } }, { "guid": "guid8", "fill": { "r":150, "g":189, "b":95 } }, { "guid": "guid9", "fill": { "r":253, "g":147, "b":105 } }, { "guid": "guid10", "fill": { "r":225, "g":93, "b":134 } }, { "guid": "guid11", "fill": { "r":124, "g":111, "b":173 } }, { "guid": "guid12", "fill": { "r":165, "g":165, "b":165 } }, { "guid": "guid13", "fill": { "r":122, "g":166, "b":213 } }, { "guid": "guid14", "fill": { "r":130, "g":208, "b":141 } }, { "guid": "guid15", "fill": { "r":255, "g":210, "b":137 } }, { "guid": "guid16", "fill": { "r":241, "g":132, "b":128 } }, { "guid": "guid17", "fill": { "r":191, "g":144, "b":198 } }, { "guid": "guid18", "fill": { "r":191, "g":191, "b":191 } }, {Your first color defined here... } } ] } }

カスタムカラーパレットを削除し、既定の色に戻す

カラーパレットを削除すると、GoodDataポータルが既定のカラースキーマに戻ります。

カスタムカラーパレットを削除するには、RESTクライアント内のリクエストの本文テキストを削除します。 次に、以下の設定を使ってリクエストを送信します。

GoodData プラットフォームのフィルター