スライスを展開できるかどうかを取得または設定します。

スライスを選択できるかどうかを取得または設定します。

有効なデータ ソースを取得または設定します。
配列またはプリミティブのインスタンス、オブジェクトの配列、$.ig.DataSource のインスタンス、または $.ig.DataSource で有効なデータが可能です。
注: これが文字列に設定され、「dataSourceType」オプションが設定されていない場合、$.ig.JSONPDataSource が使用されます。

データ ソースのタイプ (「json」、「xml」など) を取得または設定します。$.ig.DataSource とそのタイプ プロパティのドキュメントを参照してください。

リモート データの要求で JSON を送信するために使用される URL を取得または設定します。

チャートの高さ。ピクセル、文字列 (px)、またはパーセンテージ (%) で数字として設定できます。

ドーナツ型チャートの内部範囲を取得または設定します。外側リングの半径からのパーセンテージです。

プロット領域でのすべての画面操作を無効にするかどうかを取得または設定します。

チャートに表示されるレコードの最大数を取得または設定します。

コントロールのピクセル密度に影響するために使用されるスケール値を取得または設定します。
より高いスケール比率はビジュアルを向上しますが、メモリの使用を増加します。より低い値はコントロールがぼやけます。

$.ig.DataSource を参照してください。応答がラップされる場合、これは基本的にデータ レコードが保持される応答内のプロパティです。

S$.ig.DataSource を参照してください。サーバー上のレコードの総数を指定する応答内のプロパティ。

スライスを選択するときに使用するスタイルを取得または設定します。

シリーズ オブジェクトの配列。

• brushes

  タイプ:

  object

  デフォルト:

  null

  スライスの色設定に使用するブラシのパレットを取得または設定します。
  提供された値は、css 色文字列またはグラデーションを定義する JavaScript オブジェクトの配列である必要があります。最初の要素は、コレクションの補間モードを指定する RGB または HSV の文字列に設定するオプションがあります。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           brushes: ["red", "yellow", "blue"],           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].brushes;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", brushes: ["red", "yellow", "blue"] }]);

• formatLabel

  タイプ:

  object

  デフォルト:

  null

  オブジェクトを取得して、チャートの表示のために書式設定されるラベルを作成する関数を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           formatLabel: function(context){             // context.isOthersSlice; returns true if this is the "others" slice             // context.item; returns the datasource item for the current slice             // context.itemLabel; returns the label that will be used             // context.percentValue; returns the percent value for the current slice                           // In order to change the label you need to return the desired string e.g.:             return Math.round(context.percentValue * 10) / 10;           },           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].formatLabel;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", formatLabel: function(context) {return context.itemLabel.toLowerCase(); } }]);

• formatLegendLabel

  タイプ:

  object

  デフォルト:

  null

  オブジェクトを取得して、チャート凡例を表示するために書式設定されるラベルを作成する関数を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           formatLegendLabel: function(context){             // context.isOthersSlice; returns true if this is the "others" slice             // context.item; returns the datasource item for the current slice             // context.itemLabel; returns the label that will be used             // context.percentValue; returns the percent value for the current slice                           // In order to change the label you need to return the desired string e.g.:             return Math.round(context.percentValue * 10) / 10;           },           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].formatLegendLabel;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", formatLegendLabel: function(context) {return context.itemLabel.toLowerCase(); } }]);

• isSurfaceInteractionDisabled

  タイプ:

  bool

  デフォルト:

  false

  プロット領域でのすべての画面操作を無効にするかどうかを取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           isSurfaceInteractionDisabled: true,           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].isSurfaceInteractionDisabled;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", isSurfaceInteractionDisabled: true }]);

• itemsSource

  タイプ:

  object

  デフォルト:

  null

  チャートのデータ ソースを取得または設定します。

  コード サンプル

  // Data var data = [     { "CountryName": "China", "Pop1990": 1141, "Pop2008": 1333, "Pop2025": 1458 },                { "CountryName": "India", "Pop1990": 849, "Pop2008": 1140, "Pop2025": 1398 },                { "CountryName": "United States", "Pop1990": 250, "Pop2008": 304, "Pop2025": 352 },                { "CountryName": "Indonesia", "Pop1990": 178, "Pop2008": 228, "Pop2025": 273 },                { "CountryName": "Brazil", "Pop1990": 150, "Pop2008": 192, "Pop2025": 223 }];   // Initialize $("#chart").igDoughnutChart({     series: [{         itemsSource: data,         name: "Pop1990",         labelMemberPath: "CountryName",         valueMemberPath: "Pop1990"     }] });           // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].itemsSource;           // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", itemsSource: data }]);

• labelExtent

  タイプ:

  number

  デフォルト:

  10

  スライスの端からラベルをオフセットするピクセル量を取得または設定します。

  コード サンプル

  // labelsPosition has to be set to "outsideEnd" in order for the labelExtent to apply // Initialize $("#chart").igDoughnutChart({    series:       [{           labelExtent: 50,           labelsPosition: "outsideEnd",           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].labelExtent;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", labelExtent: 50 }]);

• labelFormat

  タイプ:

  string

  デフォルト:

  null

• labelFormatSpecifiers

  タイプ:

  object

  デフォルト:

  null

• labelInnerColor

  タイプ:

  string

  デフォルト:

  null

• labelMemberPath

  タイプ:

  string

  デフォルト:

  null

  ラベルを含むプロパティ名を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].labelMemberPath;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", labelMemberPath: "Pop1990" }]);

• labelOuterColor

  タイプ:

  string

  デフォルト:

  null

• labelsPosition

  タイプ:

  enumeration

  デフォルト:

  center

  チャート ラベルの位置を取得または設定します。

  メンバー

  • none
  • タイプ:string
  • ラベルは表示されません。
  • center
  • タイプ:string
  • ラベルは中央に表示されます。
  • insideEnd
  • タイプ:string
  • ラベルはコンテナーの内側と端の近くに表示されます。
  • outsideEnd
  • タイプ:string
  • ラベルはコンテナーの外に表示されます。
  • bestFit
  • タイプ:string
  • ラベルの場所は自動的に決まります。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           labelsPosition: "outsideEnd",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].labelsPosition;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", labelsPosition: "outsideEnd" }]);

• leaderLineMargin

  タイプ:

  number

  デフォルト:

  6

  ラベルおよびその引き出し線の間のマージンを取得または設定します。デフォルトは 6 ピクセルです。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           leaderLineMargin: 0,           labelsPosition: "outsideEnd",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].leaderLineMargin;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", leaderLineMargin: 0 }]);

• leaderLineStyle

  タイプ:

  object

  デフォルト:

  null

  引き出し線のスタイルを取得または設定します。

  コード サンプル

  var style = {     stroke: "red",     strokeThickness: 3,     opacity: 0.5 };   // Initialize         $("#chart").igDoughnutChart({            series:               [{                   leaderLineStyle: style,                   labelsPosition: "outsideEnd",                   valueMemberPath: "Pop1990",                   name: "Pop1990",                   dataSource: data               }]         });                   // Get         var series = $("#chart").igDoughnutChart("option", "series");         series[0].leaderLineStyle;                   // Set         $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", leaderLineStyle: style }]);

• leaderLineType

  タイプ:

  enumeration

  デフォルト:

  straight

  外部の終了ラベルのために使用される引き出し線のタイプを取得または設定します。

  メンバー

  • straight
  • タイプ:string
  • スライスおよびそのラベルの間に直線が描画されます。
  • arc
  • タイプ:string
  • スライスおよびそのラベルの間に曲線が描画されます。線がスライスからラベルへ自然なターンで描画します。
  • spline
  • タイプ:string
  • スライスおよびそのラベルの間に曲線が描画されます。線がスライスからラジアルに出て、ラベルに回転します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           leaderLineType: "spline",           labelsPosition: "outsideEnd",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].leaderLineType;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", leaderLineType: "spline" }]);

• leaderLineVisibility

  タイプ:

  enumeration

  デフォルト:

  visible

  引き出し線が表示されるかどうかを取得または設定します。

  メンバー

  • visible
  • タイプ:string
  • 要素を表示します。
  • collapsed
  • タイプ:string
  • 要素を表示しません。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           leaderLineVisibility: "collapsed",           labelsPosition: "outsideEnd",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].leaderLineVisibility;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", leaderLineVisibility: "collapsed" }]);

• legend

  タイプ:

  object

  デフォルト:

  null

  現在のチャートで使用する凡例を取得または設定します。

  コード サンプル

  // You need to supply a dom element to use for the legend (preferably a div element) // Initialize $("#chart").igDoughnutChart({    series:       [{           legend: $("selectorForLegendElement"),           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].legend;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", legend: $("selectorForLegendElement") }]);

• legendLabelFormat

  タイプ:

  string

  デフォルト:

  null

• legendLabelFormatSpecifiers

  タイプ:

  object

  デフォルト:

  null

• legendLabelMemberPath

  タイプ:

  string

  デフォルト:

  null

  凡例ラベルを含むプロパティ名を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           legendLabelMemberPath: "Label",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].legendLabelMemberPath;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", legendLabelMemberPath: "Label" }]);

• legendOthersLabelFormat

  タイプ:

  string

  デフォルト:

  null

• legendOthersLabelFormatSpecifiers

  タイプ:

  object

  デフォルト:

  null

• othersCategoryText

  タイプ:

  string

  デフォルト:

  "Others"

  その他のスライスのラベルを取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           othersCategoryText: "Others Label",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].othersCategoryText;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", othersCategoryText: "Others Label" }]);

• othersCategoryThreshold

  タイプ:

  number

  デフォルト:

  3

  スライスがその他のスライスにグループ化されるかを決定するしきい値を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           othersCategoryThreshold: 5,           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].othersCategoryThreshold;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", othersCategoryThreshold: 5 }]);

• othersCategoryType

  タイプ:

  enumeration

  デフォルト:

  percent

  数値ベースのしきい値を使用するかパーセント ベースのしきい値を使用するかを取得または設定します。

  メンバー

  • number
  • タイプ:string
  • データ値は OthersCategoryThreshold の値と直接比較されます。
  • percent
  • タイプ:string
  • データ値は合計のパーセンテージとして OthersCategoryThreshold と比較されます。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           othersCategoryType: "number",           valueMemberPath: "Pop1990",           name: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].othersCategoryType;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", othersCategoryType: "number", }]);

• othersLabelFormat

  タイプ:

  string

  デフォルト:

  null

• othersLabelFormatSpecifiers

  タイプ:

  object

  デフォルト:

  null

• outlines

  タイプ:

  object

  デフォルト:

  null

  スライスのアウトラインに使用するブラシのパレットを取得または設定します。
  提供された値は、css 色文字列またはグラデーションを定義する JavaScript オブジェクトの配列である必要があります。最初の要素は、コレクションの補間モードを指定する RGB または HSV の文字列に設定するオプションがあります。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           outlines: ["red", "yellow", "blue"],           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].outlines;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", outlines: ["red", "yellow", "blue"] }]);

• radiusFactor

  タイプ:

  number

  デフォルト:

  0.9

  チャートの半径のスケール率を取得または設定します。0 と 1 の間の値。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           radiusFactor: 0.6,           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].radiusFactor;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", radiusFactor: 0.6 }]);

• selectedStyle

  タイプ:

  object

  デフォルト:

  null

  スライスを選択するときに使用するスタイルを取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           selectedStyle: { fill: "red", stroke: "blue", strokeThickness: 3, opacity: 1 },           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].selectedStyle;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", selectedStyle: { fill: "red", stroke: "blue", strokeThickness: 3, opacity: 1 } }]);

• showTooltip

  タイプ:

  bool

  デフォルト:

  false

  シリーズがツールチップを描画すべきかどうか。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           showTooltip: true,           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].showTooltip;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", showTooltip: true }]);

• startAngle

  タイプ:

  number

  デフォルト:

  0

  チャートの開始角度を取得または設定します。
  デフォルト値 0 は、時計の 3 時に相当します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           startAngle: 90,           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].startAngle;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", startAngle: 90 }]);

• tooltipTemplate

  タイプ:

  string

  デフォルト:

  null

  チャート ツールチップが描画するために使用するテンプレートの名前またはテンプレート。

  コード サンプル

  // Initialize         $("#chart").igDoughnutChart({            series:               [{                   showTooltip: true,                   tooltipTemplate: "countryTooltip",                   name: "Pop1990",                   labelMemberPath: "CountryName",                   valueMemberPath: "Pop1990",                   dataSource: data               }]         });                   // Get         var series = $("#chart").igDoughnutChart("option", "series");         series[0].tooltipTemplate;                   // Set         $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", tooltipTemplate: "countryTooltip" }]);

• type

  タイプ:

  enumeration

  デフォルト:

  flat

  現在のシリーズ タイプを取得または設定します。

  メンバー

  • flat
  • タイプ:string
  • シリーズは、フラットな -1 ディメンション データを持ちます。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           type: "flat",           name: "Pop1990",           labelMemberPath: "CountryName",           valueMemberPath: "Pop1990",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].type;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", type: "flat" }]);

• valueMemberPath

  タイプ:

  string

  デフォルト:

  null

  値を含むプロパティ名を取得または設定します。

  コード サンプル

  // Initialize $("#chart").igDoughnutChart({    series:       [{           valueMemberPath: "Pop1990",           name: "Pop1990",           labelMemberPath: "CountryName",           dataSource: data       }] });   // Get var series = $("#chart").igDoughnutChart("option", "series"); series[0].valueMemberPath;   // Set $("#chart").igDoughnutChart("option", "series", [{ name: "Pop1990", valueMemberPath: "Pop1990" }]);

チャート項目に関連付けるツールチップのテンプレートを取得または設定します
例: "Value: $(ValueMemberPathInDataSource)".

チャートの幅。ピクセル、文字列 (px)、またはパーセンテージ (%) で数字として設定できます。