サイトのレイアウトの設計

サイトを構成してデータを追加した後に、[サイト エディター] を使用してサイトの設計を開始できます。[サイト エディター] はフル ページ エディターです。独自のサイト ブランディングとデータに適合するように修正したり、最初からやり直すために完全に削除したりすることができるデフォルトのサイト テンプレートを提供します。サイトのレイアウトを設計するには、ドラッグアンドドロップ カードを使用し、テーマ全体を設定し、マークダウンまたはカスタム HTML を使用してヘッダーとフッターをカスタマイズします。

サイト エディターへのアクセス

サイト エディターを使用して、サイトの設計を開始したり、変更するためにいつでも戻ることができます。

1. サイト 管理アプリケーションにサイン インします。
2. [サイト] タブをクリックします。
3. 編集するサイトを見つけて、[サイト エディター] を選択します。

サイトの設定の構成

サイトに名前を付けて説明を入力し、その他の設定を行います。サイトの設定と機能は、[サイト] タブをクリックして [サイト マネージャー] にアクセスして構成することもできます。

1. サイド パネルを開き、[サイト情報] をクリックします。
2. [サイト名] フィールドに名前を入力します。
3. サイトの背景情報を [サイトについて] フィールドに入力します。
4. オプションの favicon を設定するには、[カスタム Favicon] フィールドに画像 URL を貼り付けます。
5. [Google Analytics] をクリックして切り替えます。
6. [カスタム ベースマップ] をクリックして切り替えます。必要なマップはドロップダウン メニューから選択できます。
7. [カスタマイズ] パネルの上部の [ケーパビリティ] をクリックして、[ケーパビリティ] メニューを開きます。このメニューでは、使用可能なケーパビリティを切り替えできます。ケーパビリティの詳細については、「サイト機能の管理」をご参照ください。

ヘッダー

画像の URL を入力するか、カスタム CSS を使用してサイトの上部にメニュー バーを表示します。

1. サイド パネルを開き、[ヘッダー] をクリックします。[ロゴとサイト タイトルを使用] を選択してタイトルを入力し、ロゴの URL を入力します。
2. サイトに名前を付けるには、[ロゴとサイト タイトルを使用] を選択し、タイトルを [サイト タイトル] テキスト フィールドに入力して、タイトルをサイトのヘッダー内に配置します。
3. 画像をサイトのヘッダー内に配置するには、画像の URL を [ロゴの URL] フィールドに貼り付けます。
4. カスタム HTML または CSS を使用してサイトのヘッダーをブランディングする場合は、[カスタム HTML/CSS を使用] を選択します。
5. サイド パネルの CSS ボックスを修正し、[変更を適用] をクリックして、コードが有効であることを確認します。

注意:

ヘッダー HTML は、埋め込み JavaScript をサポートしていません。スクリプト タグは無視されます。

備考:

[マイ データ] と [サイン イン] のエリアはサイトの機能を維持するために編集または削除できません。

テーマ

サイトのテーマを作成するには、サイトのヘッダー、テキスト、ボタンの色を選択します。

1. 次のオプションのいずれかに対して色を選択するには、カラー コードを入力するか、カラー コード フィールドの横にあるカラー パレットから色を選択します。
   • [ヘッダーの背景色] は、色をサイトのヘッダーに適用します。
   • [ヘッダーのテキスト色] は、ヘッダー内のすべてのテキストの色を適用します。
   • [本文の背景色] は、色をサイトの行に適用します。
   • [本文のテキスト色] は、サイト全体のテキストに適用されます。

   • ヒント:

     テキスト色は行ごとに変更することもできます。

     [本文のリンクの色] は、色をサイト上で提供されているリンクに適用します。
   • [ボタンの背景色] は、色をサイト上で提供されているボタンに適用します。
   • [ボタンのテキスト色] は、サイト上で提供されているすべてのボタン上のテキストに適用されます。
2. 色を設定したら、[変更を適用] をクリックします。
3. フォントを、ヘッダー内のテキストおよびサイトの本文に適用することもできます。
   • サイトの本文のフォントを選択するには、[ベース フォント] 設定アイコンをクリックします。
   • サイトのヘッダーのフォントを変更するには、[ヘッダーのフォント] 設定アイコンをクリックします。

備考:

最初からやり直すか、デフォルトの色に戻すには、[テーマ] メニューの下部にある [デフォルトにリセット] を選択します。

レイアウトおよびカード

サイトまたはページの基本レイアウトは、行とカードごとにまとめられます。カードは行内に配置する必要があります。1 行に配置できるカードの数に制限はありません。カードを編集するには、設定ボタンをクリックします。カードを削除するには、削除ボタンをクリックします。サイトの構築に使用できるカードは、行、バナー、画像、Web マップ、テキスト、カテゴリ、連絡先情報、ギャラリー、iframe、イベントの詳細、イベント リスト ビュー、ビデオ、ソーシャル メディア、統計情報のサマリー、およびチャートです。

行カード

行を使用して、サイト全体のレイアウトを作成します。[サイト エディター] からカードをドラッグして、テキスト、画像、メディアなどの追加カードで行を埋めます。

1. 行を [サイト エディター] からレイアウト上にドラッグします。

   ガイドとして使用するマーカーがページに表示されます。

2. 行にポインターを合わせます。ページ内で行を移動するための矢印、編集用の設定ボタン、行を削除するための削除ボタンの 3 つが右側に表示されます。
3. 設定ボタンをクリックして、編集モードに切り替えます。
4. [ボックス] または [ワイド] を選択して、行の [レイアウト] を選択します。[幅] はページ全体にコンテンツを表示します。一方、[ボックス] は行内の固定幅でコンテンツを表示します。
5. この特定の行のテキスト色を設定します。
6. 背景色 (透明がデフォルト) または背景画像を設定します。
7. 必要に応じて、[イメージ ソース] をクリックして画像ファイルをアップロードするか、画像の URL を指定して、画像を追加します。両方のオプションとも JPG、JPEG、および PNG をサポートしています。
   • 画像ファイルをアップロードするには、[画像のアップロード] を選択して [サイト エディター] のボックスにファイルをドラッグするか、[画像の参照] をクリックしてファイルを特定および追加します。最大ファイル サイズは 3 MB です。
   • または、サポートされている画像リンクを [URL] フィールドに貼り付けて画像の URL を入力します。
8. 画像ファイルを使用している場合は、クロップ ボタンをクリックしてハンドルをドラッグし、クロップ フレームのサイズを変更することで、画像ファイルをカスタマイズできます。クロップ フレームは点線をドラッグして再配置できます。画像の下にあるスライダーを調整してズームしたり、クロップ フレーム内をクリックして画像を再配置したりできます。
9. 背景色と画像を追加する場合は、パーセントを入力するかスライダーを使用して、[表示設定] メニューの [画像透過率] を調整することもできます。
10. コンテンツを背景画像とは異なるペースでスクロールさせて視差効果を与えるには、[固定背景] を有効にします。
11. 必要に応じて、[画像の中心点] にポイントを設定して、さまざまな画面サイズに合わせて画像の焦点を合わせます。

バナー カード

サイト内に見出しと検索バーを追加するには、バナーを使用します。

1. [バナー] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [見出し] と [小見出し] にテキストを入力します。
4. [検索] メニューから [検索バーを表示] をクリックして、バナーにオプションの検索バーを追加します。必要に応じて、[場所による検索機能を追加] をクリックして、ユーザーが結果を場所によりフィルター処理するための第 2 の検索オプションを追加します。
5. 必要に応じて、検索バーに表示するプレースホルダー テキストを追加します。
6. [オプション] メニューの [最小高さ] に値を入力して、バナーの高さを設定します。0 より大きい値を指定する必要があります。
7. [背景画像] メニューから、必要に応じて画像ファイルをアップロードするか画像の URL を指定します。両方のオプションとも JPG、JPEG、および PNG をサポートしています。
   • 画像ファイルをアップロードするには、[画像のアップロード] を選択して [サイト エディター] のボックスにファイルをドラッグするか、[画像の参照] をクリックしてファイルを特定および追加します。最大ファイル サイズは 3 MB です。
   • または、サポートされている画像リンクを [URL] フィールドに貼り付けて画像の URL を入力します。
8. 画像ファイルを使用している場合は、クロップ ボタンをクリックしてハンドルをドラッグし、クロップ フレームのサイズを変更することで、画像ファイルをカスタマイズできます。クロップ フレームは点線をドラッグして再配置できます。画像の下にあるスライダーを使用してズームを調整したり、クロップ フレーム内をクリックして画像を再配置したりできます。
9. 画像のアップロードと画像の URL の両方に対して、[画像の中心点] にポイントを設定し、さまざまな画面サイズでの表示に関係なく、画像の焦点エリアを定めます。

検索カード

サイトで共有されるコンテンツをすばやく見つけられるように、検索バーを追加します。

1. [検索] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [検索用プレースホルダー テキスト] フィールドにプレースホルダー テキストを入力します。たとえば、「Search by Keyword」や「Find Data」などを使用できます。
4. [場所による検索機能を追加] チェックボックスをオンにして、場所に基づく検索を行うための別の検索バーを追加します。[場所用プレースホルダー テキスト] にもプレースホルダー テキストを入力できます。

画像カード

ファイルから画像をアップロードするか、画像の URL を入力して画像を追加します。内部で共有されている画像は、サイン インしていて、チームまたは組織に属しているユーザーのみが表示できます。

1. [画像] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. 画像ソースを選択します。画像ファイルをアップロードするか、画像の URL を入力することができます。両方のオプションとも JPG、JPEG、および PNG をサポートしています。
   • 画像ファイルをアップロードするには、[画像のアップロード] を選択して [サイト エディター] のボックスにファイルをドラッグするか、[画像の参照] をクリックしてファイルを特定および追加します。最大ファイル サイズは 3 MB です。
   • または、[画像 URL] を選択し、サポートされている画像リンクを [URL] フィールドに貼り付けて画像の URL を入力します。
4. 画像ファイルを使用している場合は、クロップ ボタンをクリックしてハンドルをドラッグし、クロップ フレームのサイズを変更することで、アップロードされた画像をカスタマイズできます。クロップ フレームは、点線をクリックしてドラッグすることで再配置できます。画像の下にあるスライダーを調整してズームしたり、クロップ フレーム内をクリックして画像を再配置したりできます。
5. [オプション] メニューから画像代替テキストを入力することで、視覚障害のあるユーザーを支援し、サイトのアクセシビリティを向上させることができます。
6. 画像のハイパーリンクを入力して、同じタブまたは新しいタブのどちらで開くかを選択します。
7. [画像のキャプション] にテキストを入力し、テキストの配置を選択します。
8. 必要に応じて [縦横比を変えて画像を全体表示] をクリックし、画像の中心点を設定します。中心点を合わせることで、さまざまな画面に合わせて画像サイズが変更される際に、画像を目的の位置に確実に合わせることができます。

Web マップ

Web マップをサイトで表示します。Web マップは、プライベートに共有することができます。チームまたは組織に属しているユーザーのみが、サイン インしているときに、それらの Web マップ にアクセスできます。

1. [Web マップ] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [Web マップを検索] をクリックします。
4. [マイ マップ]、[組織のマップ]、または [すべてのマップ] を検索して、Web マップを見つけます。
5. マップのタイトルを表示するには、[タイトル] のトグルをクリックします。
6. マップの [高さ] (ピクセル) を設定します。

テキスト カード

テキストの書式設定、リストの追加、テーブルの挿入を行います。カスタム HTML を使用することもできます。

1. [テキスト] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. テキストを追加します。
4. 書式設定するテキストを選択します。書式設定のオプションには、スタイル (ヘッダー、コード スニペット、引用符の追加)、太字、斜体、リンクなどがあります。
5. テキストの配置を調整するには、パラグラフ オプションをクリックして配置を選択します。パラグラフ オプションをクリックしてインデントまたはインデント解除を選択することで、1 行のテキストをインデントまたはインデント解除することもできます。

備考:

テキストの色は行カードの設定で変更できます。

箇条書きまたは番号付きリストの追加

1. テキストを追加するか、既存のテキストを選択します。
2. 箇条書きリストを作成するには、順不同のリストを選択します。
3. 番号付きリストを追加するには、順序付けられたリストを選択します。

テーブルの挿入

1. テーブル オプションをクリックします。
2. 各行と列に配置するセルの数を選択します。
3. テーブルのサイズを選択した後、クリックしてテーブルを挿入します。行や列を追加または削除するには、セルの内部をクリックして、行または列の挿入または削除ボタンを選択します。テーブル全体を削除するには、削除ボタンをクリックします。

備考:

テーブルにヘッダーを追加するには、テーブルの一番上の行をクリックして、テーブル ヘッダーの切り替えボタンをクリックします。ヘッダーによって、補助テクノロジを使用するユーザーがテーブルのコンテンツ間を移動しやすくなります。

ボタンとカードの挿入

1. [挿入] ボタンをクリックします。
2. 次のオプションから選択します。
   • [ボタン] - 詳細情報へのリンクを設定することで、行動の喚起を付加します。
   • [ワイド カード] - コンテンツを表示し、詳細情報にリンクし、ピクチャを表示する 1 枚のカードを挿入します。
   • [カード] - 複数のカードを挿入します。

備考:

ピクチャは、カードのコード ビュー内部にあるホスト イメージへのリンクを設定することで、編集できます。

HTML の追加

HTML を使用して、テキストの外観をカスタマイズできます。

1. [テキスト] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [コード ビュー] オプションをクリックします。

注意:

セキュリティ上の理由から、テキスト カードは、埋め込み JavaScript をサポートしていません。スクリプト タグは無視されます。

次の HTML 要素に対応しています。

'a', 'b', 'blockquote', 'br', 'caption', 'cite', 'code', 'col',
 'colgroup', 'dd', 'dl', 'dt', 'em', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
 'i', 'img', 'li', 'ol', 'p', 'pre', 'q', 'small', 'strike', 'strong',
 'sub', 'sup', 'table', 'tbody', 'td', 'tfoot', 'th', 'thead', 'tr', 'u',
 'ul', 'center', 'style', 'div', 'span'

これらの要素の次の属性に対応しています。

 All supported HTML elements allow : ['class', 'style'], 'a' : ['href', 'title', 'target', 'data-toggle', 'data-target', 'name'], 'blockquote': ['cite'],	'button'    : ['name', 'value', 'data-toggle', 'data-target', 'data-dismiss'], 'col' : ['span', 'width'], 'colgroup' : ['span', 'width'],	'div' : ['data-show', 'data-target', 'data-toggle'] 'img' : ['align', 'alt', 'height', 'src', 'title', 'width' ], 'ol' : ['start', 'type'], 'q' : ['cite'], 'table' : ['summary', 'width', 'class'], 'td' : ['abbr', 'axis', 'colspan', 'rowspan', 'width'], 'th' : ['abbr', 'axis', 'colspan', 'rowspan', 'scope', 'width'],
 'ul' : ['type']

カテゴリ カード

ユーザーが使用可能なコンテンツを迅速に参照できるよう、カテゴリを使用してサイト上のデータセットをグループ化します。

1. [カテゴリ] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. カテゴリのリンク テキストを編集します。
4. [タグ クエリを使用] または [グループを使用] を選択します。

   これにより、ユーザーがこのカテゴリをクリックしたときに検索結果で返されるデータセットが決まります。

   • [タグ] - タグ クエリを入力します。になります。各エンタープライズ ポータル アイテムでこの一致タグを持つデータセットがすべて、検索結果で返されます。
   • [グループ] - グループを選択します。このグループ内のデータセットがすべて、検索結果で返されます。
5. ライブラリからアイコンを選択する場合:
   1. [アイコンを選択] を選択します。
   2. モーダルからアイコンを選択して、[選択] をクリックします。

      アイコンがサイド パネルに表示されます。

   3. アイコンの右にあるグレーのボックスをクリックして、アイコンの色を選択します。
6. 独自のアイコンを使用する場合:
   1. アイコンの URL を入力します。
   2. 視力が良くないユーザーを支援したり、サイトのアクセシビリティを向上させたりするために、アイコンに代替テキストを提供します。
7. [サイト エディターに戻る] をクリックして、メインのサイド パネルに戻ります。

ヒント:

カスタムアイコンは、*.svg または透明な *.png ファイルとして保存する必要があります。120 x 120 ピクセルに合うように、アイコンのサイズが変更されます。

連絡先情報カード

データ所有者に電子メールを送信するための連絡先情報を指定します。

1. [連絡先] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. 連絡先の電子メール アドレスと電子メール件名行を入力します。

   ユーザーがホーム ページで電子メールをクリックすると、電子メール エディターが自動的に開きます。

4. [サイト エディターに戻る] をクリックして、メインのサイド パネルに戻ります。

ギャラリー カード

ギャラリー カードを使用して、アプリ、ダッシュボード、データセット、サイト、ページ、Web マップ、およびドキュメントを紹介します。ギャラリー カードは、組織の ArcGIS Online グループからこれらのアイテムを自動的に取得します。組織または特定のグループにコンテンツを追加すると、レイアウトを編集しなくても、新しいアプリケーション タイルがサイトに表示されます。

1. [ギャラリー] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [表示] ドロップダウン メニューをクリックし、タイプ別か個別の項目を手動で選択してコンテンツを表示することで、カードに表示される内容を選択します。
   • タイプに基づいてコンテンツを表示するには、[動的] をクリックしてから、[アプリ]、[ダッシュボード]、[データセット]、[サイト]、[ページ]、[Web マップ]、または [ドキュメント] のいずれかを選択します。追加設定では、[表示されたカード] の数と、検索元のグループまたはタグを選択する必要があります。

     ヒント:

     [アプリ] のアイテムには、アプリケーション、フォーム (Survey123)、および Web マッピング アプリケーションがあります。サポートされている [ドキュメント] タイプには、PDF、Microsoft Excel、Microsoft PowerPoint、iWork Keynote、iWork Pages、iWork Documents、および Visio Documents があります。

   • コンテンツの組み合わせを表示するには、[手動] をクリックしてから [コンテンツの追加] をクリックし、組織に属しているアプリ、データセット、サイト、およびページの組み合わせを個別に選択して、コンテンツを選択します。

     ヒント:

     手動表示を選択した場合、[サイト エディター] でカードのリストを調整することで、カードがレイアウトに表示される方法を並べ替えることができます。カードの名前をクリックして、リスト内の新しい位置にカードをドラッグ アンド ドロップします。

4. [スタイル] ドロップダウン メニューから、次のオプションを使用してギャラリーカードの外観を選択します。
   • [画像] - アイコンまたはサムネイルを選択します。ArcGIS Online[サイト エディター][サイト]ArcGIS Online[マイ コンテンツ][サムネイルの編集]アイテムの詳細ArcGIS Online[コンテンツ][概要][サムネイルの編集]アイテムの詳細
   • [角] - 四角い角か丸い角を選択します。
   • [ボタンのテキスト] - 必要に応じて、テキスト ボックスに新しい名前を入力して [マップ操作] ボタンの名前を変更します。

iframe カード

iframe や外部リソースを埋め込みます。

注意:

別の Web サイトの iframe コードを埋め込まないでください。埋め込みたい URL のみを貼り付けます。

1. [iframe] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. iframe の URL と iframe の高さを指定します。
4. iframe にタイトルを追加します。
5. [自動] をオンにしてスクロールを有効にします。
6. [適用] をクリックします。

備考:

HTTP を使った iframe の URL は、HTTPS を使っている [サイト エディター] には表示されません。サイトを保存し表示して、iframe を観察します。

ビデオ カード

ビデオ カードを追加して、YouTube、Vimeo、または Facebook ビデオを埋め込みます。

1. [メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ビデオの URL] フィールドに、Facebook、Vimeo、または YouTube のビデオの URL を貼り付けます。
4. ビデオ ソースに応じて、ビデオ ディスプレイを構成できる追加のオプションが表示されます。
   • Facebook ビデオの場合、[ポスト テキストの表示] を選択すると、「いいね！」、「コメント」、「シェア」の数、およびその他の関連テキストが表示されます。ビデオ キャプションを表示するには、[キャプションを常に表示] を選択します。
   • Vimeo ビデオの場合、[ビデオ タイトルの表示]、[ビデオ所有者の表示]、[ビデオ所有者のサムネイルの表示]、および [ビデオのループ再生] を選択します。
   • YouTube ビデオの場合、[YouTube ブランドの表示] および [ビデオのループ再生] を選択します。
5. [ビデオの URL] の横にあるコピー ボタンをクリックしてリンクをクリップボードに保存すると、アプリの他の場所で再利用できます。

ソーシャル メディア カード

URL を使用して、ソーシャル メディアの投稿やタイムラインをサイトで直接共有できます。

Facebook の投稿

1 つの投稿を表示して、特定の投稿をハイライト表示できます。

1. [ソーシャル メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ソーシャル メディア投稿の URL] フィールドに、パブリックに共有されている Facebook の投稿の URL を貼り付けます。正しい URL をコピーするには、投稿のタイムスタンプ (投稿の左上隅の日付または時刻) をクリックしてから、サイトの編集に戻る前にブラウザーで新しい URL をコピーします。
4. 必要に応じて、[ポスト テキストを表示] トグルをクリックして、投稿に関連付けられているテキストを表示します。

Facebook のタイムライン

Facebook ページの [タイムライン]、[イベント]、および [メッセージ] を表示することで、詳細に内容を確認できます。

1. [ソーシャル メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ソーシャル メディア投稿の URL] フィールドに、パブリックに共有されている Facebook ページの URL を貼り付けます。
4. 必要に応じて、クリックして次のオプションの組み合わせを切り替えることができます。
   • [Facebook ページ タブ] では、ページのヘッダーの下に [タイムライン] タブが表示されます。タイムラインをイベントやメッセージとともに共有する場合は、このオプションをクリックします。
   • [イベント] には、ページのイベント ビューのみのリスト ビューが表示されます。
   • [メッセージ] では、Facebook Messenger を使用して Facebook ページの管理者にメッセージを入力および送信できます。
   • [大きいヘッダーを使用] をクリックすると、ページのヘッダーのサイズが大きくなり、ユーザーを Facebook Messenger にリンクする [メッセージの送信] ボタンが追加されます。
   • [カバー写真の表示] をクリックすると、ページのカバー写真が表示されます。

Twitter の投稿

1 つの Twitter 投稿を表示して、特定の投稿をハイライト表示できます。

1. [ソーシャル メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ソーシャル メディア投稿の URL] フィールドに、パブリックに共有されている Twitter の投稿の URL を貼り付けます。1 つのツイートへのリンクを取得するには、投稿の右上にある [その他] アイコンをクリックしてから、[ツイートへのリンクをコピー] を選択します。
4. 必要に応じて、クリックして [オプション] メニューにある次のオプションの組み合わせを切り替えることができます。
   • [暗いテーマを表示] をクリックすると、ディスプレイの色が反転します。
   • [ツイート幅の選択] をクリックすると、投稿の表示サイズを選択できます。表示サイズは、[小]、[中]、[大] があります。
5. [ツイート位置の選択] をクリックすると、[左]、[中央]、または [右] 揃えを選択できます。

Twitter のタイムライン

スクロール可能な Twitter タイムラインを表示します。

1. [ソーシャル メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ソーシャル メディア投稿の URL] フィールドに、パブリックに共有されている Twitter タイムラインの URL を貼り付けます。
4. 必要に応じて、クリックして [オプション] メニューにある次のオプションの組み合わせを切り替えることができます。
   • [コレクションの高さの選択] では、[デフォルト] を選択して現在の表示を維持するか、[展開] を選択してタイムラインの表示量を増やすことができます。
   • [ツイート制限] をクリックすると、タイムラインに表示されるツイート数を設定できます。
   • [暗いテーマを表示] をクリックすると、ディスプレイの色が反転します。
   • [ヘッダーの表示] をクリックすると、ヘッダーが表示されます。同様に、[フッターの表示] をクリックするとフッターが表示されます。
   • [輪郭の表示] をクリックすると、タイムラインの周囲に境界線が表示されます。
   • [背景の表示] をクリックすると、背景が表示されなくなります。

Twitter コレクション

サイト上の twitter コレクションを表示します。Twitter コレクションの作成方法については、ツイートのコレクションを管理する方法に関する Twitter の開発者ドキュメントをご参照ください。

1. [ソーシャル メディア] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [ソーシャル メディア投稿の URL] フィールドに、パブリックに共有されている Twitter コレクションの URL を貼り付けます。
4. 必要に応じて、クリックして [オプション] メニューにある次のオプションの組み合わせを切り替えることができます。
   • [ツイート制限] では、コレクションに表示されるツイート数に制限を設定できます。
   • [展開した高さ] では、表示されるコレクション数を一度に増やせます。
   • [暗いテーマを表示] では、テキストの色が白に変更され、ダーク グレーの背景が適用されます。
   • [ヘッダーの表示] では、コレクションのタイトルが表示されます。同様に、[フッターの表示] をクリックするとフッターが表示されます。フッターには [埋め込み] または [Twitter で表示] へのリンクが表示されます。
   • [輪郭の表示] では、カードの周囲に境界線が表示されます。
   • [背景の表示] では、カードに白い背景が適用されます。[暗いテーマを表示] も選択されている場合は、ダーク グレーの背景が適用されます。

統計情報のサマリー カード

統計情報のサマリーを使用して、主要業績評価指標などの一目でわかるデータを提供します。統計情報のサマリーは、データセット クエリから生成され、データセットが更新されると自動的に更新されます。アクセス権を持っているユーザーのみが、サイン イン時に、内部で共有されたデータを使用して生成された統計情報を要約することができます。

1. [統計情報のサマリー] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [(+) データの追加] をクリックして、選択するデータ サービスを検索するためのアイテム ピッカーを開きます。サイトを編集するときに、統計情報の下にあるソースのリンクが、データセットのプレビュー ページのアイテム詳細ページにリンクされます。
4. [統計フィールド] には、選択されたサービスからフィールドを選択します。このフィールドをその後の手順で使用します。
5. [統計の種類] には、選択されたフィールドに実行する操作の種類を選択します。
   • テキスト フィールドと日付フィールドの場合 - 個数、最小、最大から選択します。
   • 数値フィールドの場合 - 個数、合計、最小、最大、平均標準偏差、分散から選択します。
6. 必要に応じて、フィルターを統計に追加します。
   1. フィルターに使用する属性を選択します。
   2. [追加] を選択します。
   3. 新しい属性ボックスを選択して、フィルター入力を表示します。入力ボックスは、フィールド タイプに応じて異なります。
   4. 必要なフィルターを入力します。
   5. フィルター ボックスの外側をクリックするか、キーボードの Enter キーを押します。
7. [タイトル] テキスト ボックスにタイトルを入力します。
8. 必要に応じて、[末尾のテキスト] にテキストを入力して統計の詳細を指定し、統計自体の [強調色] 設定を変更します。

チャート カード

シンプルなチャートをデータセットから直接作成するか、独自の JSON チャートを入力してカスタム チャートを作成します。プライベートに共有されたデータを使用して作成されたチャートは、チームまたは組織のいずれかへのアクセス権を持っているユーザーのみが、サイン イン時に表示できます。

バー チャート

バー チャートは、選択したデータセットに対するクエリから作成され、データセットが更新されると自動的に更新されます。

1. [チャート] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. デフォルトでは、[バー チャート] が選択されます。
4. [(+) データの追加] をクリックします。
5. 使用できるデータ サービスからアイテムを選択します。
6. [カテゴリ属性の選択] には、データから主要なチャート アイテムを選択します。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

7. 必要に応じて、[値属性の選択] で、カテゴリ属性の値 (メートル) となる数値フィールドを選択します。選択すると、このフィールドのデフォルトの統計操作は、[合計値] となります。[統計操作] を変更するには、[値属性の選択] の右にあるドロップダウンを使用します。値属性では、最小値、最大値、合計値、平均値、個数がサポートされています。個数を選択すると、値属性は選択されません (カテゴリ属性をカウントするための追加フィールドは必要ないためです)。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

8. [オプション] メニューをクリックし、以下の設定を使用してチャートの表示をカスタマイズします。
   • [並べ替え] オプションを使用して、属性データの表示方法を選択できます。属性を選択してから、その属性の横にある並べ替えアイコンをクリックして、昇順または降順でデータを表示します。
   • [高さ (px)] テキスト フィールドで、チャートの高さの値 (ピクセル) を設定します。
   • [チャートのタイトル] の横にあるトグルをクリックして、チャートのタイトルを表示することを選択します。タイトルを表示する場合、表示されたテキスト フィールドに名前を入力し、文字の向きを選択します。
   • カラー コードを入力して [プライマリ チャートの色] を設定するか、カラー パレットをクリックして色を選択します。
   • [カテゴリ ラベル] および [値ラベル] にテキストを入力します。

パイ チャート

パイ チャートは、選択したデータセットに対するクエリから作成され、データセットが更新されると自動的に更新されます。

1. [チャート] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. 円形のパイ チャート ボタンをクリックして、パイ チャートを選択します。
4. [(+) データの追加] をクリックします。
5. 使用できるデータ サービスからアイテムを選択します。
6. [カテゴリ属性の選択] には、データから主要なチャート アイテムを選択します。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

7. 必要に応じて、[値属性の選択] から、カテゴリ属性の値 (メートル) となる数値フィールドを選択します。選択すると、このフィールドのデフォルトの統計操作は、[合計値] となります。[統計操作] 設定を変更するには、[値属性の選択] の右にあるドロップダウン矢印をクリックします。値属性では、[最小値]、[最大値]、[合計値]、[平均値]、[個数] がサポートされています。[個数] を選択すると、値属性は選択されません (カテゴリ属性をカウントするための追加フィールドは必要ないためです)。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

8. [オプション] メニューをクリックし、以下の設定を使用してチャートの表示をカスタマイズします。
   • [並べ替え] オプションを使用して、属性データの表示方法を選択できます。属性を選択してから、その属性の横にある並べ替えアイコンをクリックして、昇順または降順でデータを表示します。
   • [高さ (px)] テキスト フィールドで、チャートの高さの値 (ピクセル) を設定します。
   • [チャートのタイトル] の横にあるトグルをクリックして、チャートのタイトルを表示することを選択します。タイトルを表示する場合、表示されたテキスト フィールドに名前を入力し、文字の向きを選択します。
   • ツールチップ内の各パイ ウェッジのラベルの [カテゴリ ラベル] テキストおよびツールチップ内のメートルのラベルの [値ラベル] テキストを設定します。

ライン チャート

ライン チャートは、選択したデータセットに対するクエリから作成され、データセットが更新されると自動的に更新されます。

1. [チャート] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. ライン チャート ボタンをクリックして、ライン チャートを選択します。
4. [(+) データの追加] をクリックします。
5. 使用できるデータ サービスからアイテムを選択します。
6. [カテゴリ属性の選択] には、データから主要なチャート アイテムを選択します。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

7. 必要に応じて、[値属性の選択] から、カテゴリ属性の値 (メートル) となる数値フィールドを選択します。選択すると、このフィールドのデフォルトの統計操作は、[合計値] となります。[統計操作] 設定を変更するには、[値属性の選択] の右にあるドロップダウン矢印をクリックします。値属性では、[最小値]、[最大値]、[合計値]、[平均値]、[個数] がサポートされています。[個数] を選択すると、値属性は選択されません (カテゴリ属性をカウントするための追加フィールドは必要ないためです)。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

8. [オプション] メニューをクリックし、以下の設定を使用してチャートの表示をカスタマイズします。
   • [並べ替え] オプションを使用して、属性データの表示方法を選択できます。属性を選択してから、その属性の横にある並べ替えアイコンをクリックして、昇順または降順でデータを表示します。
   • [高さ (px)] テキスト フィールドで、チャートの高さの値 (ピクセル) を設定します。
   • [チャートのタイトル] の横にあるトグルをクリックして、チャートのタイトルを表示することを選択します。タイトルを表示する場合、表示されたテキスト フィールドに名前を入力し、文字の向きを選択します。
   • カラー コードを入力して [プライマリ チャートの色] を設定するか、カラー パレットをクリックして色を選択します。
   • ツールチップ内の各ポイントのラベルの [カテゴリ ラベル] テキストおよびツールチップ内のメートルのラベルの [値ラベル] テキストを設定します。

散布図

散布図は、選択したデータセットに対するクエリから作成され、データセットが更新されると自動的に更新されます。

1. [チャート] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. 散布図ボタンをクリックして、ライン チャートを選択します。
4. [(+) データの追加] をクリックします。
5. 使用できるデータ サービスからアイテムを選択します。
6. [X 軸属性の選択] には、データから主要なチャート アイテムを選択します。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

7. [Y 軸属性の選択] フィールドで属性を選択し、カテゴリ属性の値 (メートル) となる数値フィールドを選択します。

   チャートでは数値フィールドおよび文字列フィールドが使用できます。デフォルトでは、カテゴリ属性を選択すると、作成されるチャートはこの属性の数になります。

8. [オプション] メニューをクリックし、以下の設定を使用してチャートの表示をカスタマイズします。
   • [並べ替え] オプションを使用して、属性データの表示方法を選択できます。属性を選択してから、その属性の横にある並べ替えアイコンをクリックして、昇順または降順でデータを表示します。
   • [高さ (px)] テキスト フィールドで、チャートの高さの値 (ピクセル) を設定します。
   • [チャートのタイトル] の横にあるトグルをクリックして、チャートのタイトルを表示することを選択します。タイトルを表示する場合、表示されたテキスト フィールドに名前を入力し、文字の向きを選択します。
   • カラー コードを入力して [プライマリ チャートの色] を設定するか、カラー パレットをクリックして色を選択します。
   • [X 軸ラベル] および [Y 軸ラベル] を、チャートに表示するように設定します。

JSON チャート

カスタム チャートは、特定のチャート仕様を使って JSON から作成されます。

1. [チャート] カードを既存の行にドラッグします。
2. カードにポインターを合わせて、設定ボタンをクリックし、編集モードに切り替えます。
3. [JSON] タイルを選択します。
4. [JSON チャート仕様] フィールドに JSON を入力します。
5. 必要に応じて、[オプション] セクションで、[チャートのタイトル] および [高さ] 設定 (ピクセル) の有効化または無効化、カスタマイズを行うことができます。

JSON 仕様

カスタム JSON を入力すると、シダー ライブラリを活用するカスタム チャートを作成できます。仕様は次のコンポーネントから構成されます。

データセット

データセット配列により、ArcGIS フィーチャ サービスの URL とクエリ パラメーターが指定されます。クエリ パラメーターの詳細については、REST API ドキュメントをご参照ください。

{ "datasets": [ { "url": "SampleArcGISFeatureService_URL", "name" : "Number_of_SUM",
"query": { "groupByFieldsForStatistics": "Zip", "outStatistics": [{
"statisticType": "sum", "onStatisticField": "Number_of",
"outStatisticFieldName": "Number_of_SUM" }] } } ]
}

シリーズ

シリーズ配列では、サービスの応答とチャートの視覚的側面におけるフィールド間のマッピングを指定できます (X 軸、Y 軸、散布図チャートの色およびサイズ、パイ チャートの半径)。

{ "series": [ { "source": "Number_of_SUM", "category": { "field": "Type", "label": "Facility
Use" }, "value": { "field":"Number_of_SUM","label":"Total Students" }} ] }

オーバーライド

オーバーライド プロパティでは、チャート全体に色や配置など、視覚的なオーバーライドを指定できます。

"overrides": {
      "legend": {
          "enabled": true
      },
      "backgroundColor": "#E6E6FA",
      "backgroundAlpha": 1
  }
}

仕様

仕様プロパティでは、カスタム チャートの Cedar 仕様全体を入力できます。 既存のチャート仕様の例を表示します。

例

バー チャート:

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Number_of_SUM",
      "query": {
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [
          {
            "statisticType": "sum",
            "onStatisticField": "Number_of",
            "outStatisticFieldName": "Number_of_SUM"
          }
        ]
      }
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": {"field": "Number_of_SUM", "label": "Number of Students"},
      "source": "Number_of_SUM"
    }
  ]
}

水平バー チャート:

{
  "type": "bar-horizontal",  "datasets": [    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",      "name": "Number_of_SUM",      "query": {
        "orderByFields": "Number_of_SUM DESC",        "groupByFieldsForStatistics": "Type",        "outStatistics": [          {
            "statisticType": "sum",            "onStatisticField": "Number_of",            "outStatisticFieldName": "Number_of_SUM"
          }
        ]      }
    }
  ],  "series": [    {
      "category": {"field": "Type", "label": "Type"},      "value": {"field": "Number_of_SUM", "label": "Number of Students"},      "source": "Number_of_SUM"
    }
  ],  "overrides": {
    "categoryAxis": {
      "labelRotation": -45    }
  }
}

グループ化されたバー チャート:

注意: 各シリーズはグループに一致します。

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

散布図チャート:

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

バブル散布図チャート:

{
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

タイムライン チャート:

注意: カテゴリは日時フィールドである必要があります。

 {
  "type": "bar",
  "datasets": [
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Jordan",
      "query": {
        "where": "City='Jordan'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Dewitt",
      "query": {
        "where": "City='Dewitt'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    },
    {
      "url": "https://services.arcgis.com/uDTUpUPbk8X8mXwl/arcgis/rest/services/Public_Schools_in_Onondaga_County/FeatureServer/0",
      "name": "Fayetteville",
      "query": {
        "where": "City='Fayetteville'",
        "orderByFields": "Number_of_SUM DESC",
        "groupByFieldsForStatistics": "Type",
        "outStatistics": [{
          "statisticType": "sum",
          "onStatisticField": "Number_of",
          "outStatisticFieldName": "Number_of_SUM"
        }]
      },
      "join": "Type"
    }
  ],
  "series": [
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Jordan Students"},
      "source": "Jordan"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Dewitt Students"},
      "source": "Dewitt"
    },
    {
      "category": {"field": "Type", "label": "Type"},
      "value": { "field": "Number_of_SUM", "label": "Fayetteville Students"},
      "source": "Fayetteville"
    }
  ]
}

フッター

[サイト エディター] のデフォルトには、フッターがありません。サイトのすべてのページに永続的なフッターがあるようにするには、カスタム フッターを作成する必要があります。

1. [フッター] セクションから [カスタム] を選択します。

   デフォルトのフッターがページに表示され、CSS ボックスがサイド パネルに表示されます。

2. フッターの右下にある設定ボタンをクリックして、HTML を編集します。
3. 設定ボタンをもう一度クリックして、変更を表示します。
4. サイド パネルの CSS ボックスを修正し、[変更を適用] をクリックして HTML への効果を確認します。

ヒント:

フッター HTML は、埋め込み JavaScript をサポートしていません。スクリプト タグは無視されます。