Wijmo UI for the Web
目盛りマークの表示

クイックスタートの例に機能を追加して、tickMajor オブジェクトと tickMinor オブジェクトを追加できます。これらのオブジェクトには、axis目盛りマークのスタイルが含まれます。

  1. HTML ファイルの <head> セクションで、ドキュメントの ready 関数を含むスクリプトを以下のスクリプトに置き換えます。このスクリプトは次の操作を実行します。
    • X 軸に次のオプションを設定します。
      • X 軸のテキストタイトルは "Sales"。
      • X 軸のラベルは CO(小数点以下なしの通貨)を使用します。
      • グラフの各主グリッドの値の目盛りマーク(tickMajor)は X 軸線と交差し、色は青です。
      • グラフの各副グリッドの値の目盛りマーク(tickMinor)は X 軸線の内側に置かれ、色はライムグリーンです
        メモ:目盛りの position 属性は表示するかどうかを決定します。
    • X 軸のラベルが密集しないように、凡例を非表示にします。
    • 次のプロパティを持つ系列を作成します。
      • ツールチップで使用されるラベルは "Company X Market Share"。
      • Y 軸には各会社の製品数を表示します。
      • X 軸には各会社の売上を表示します。
      • Y1 値は、市場シェアに基づいて各企業のバブルのサイズを設定します。

    ドロップダウンからコードを貼り付けます

  2. HTML ファイルの <body> セクションを変更する必要はありません。チャートを表示するには、基本的な <div> タグで十分です。
  3. HTML ファイルを保存し、ブラウザで開きます。チャートは次の図のようになります。青い大目盛りマークは X 軸と交差し、ライムグリーンの小目盛りマークは X 軸の内側に表示されます。

関連トピック

参照

 

 


Copyright © GrapeCity inc. All rights reserved.