0

dojo 1.7（使用しているEsri APIに組み込まれている）を使用して、マップポップアップ（ユーザーがマップをクリックするとトリガーされる）内にグラフを動的に作成しています。

 var c = dojo.create("div", {
          id: "demoChart"
        }, dojo.create('div'));

グラフのプロパティ（データ、テーマなど）を設定した後、を呼び出すchart.renderと、グラフは正しくレンダリングされますが、サイズが正しくありません（infoWindowコンテナーdivには大きすぎます）。

ただし、を呼び出すchart.resize(175, 145)と、グラフは正しいサイズで作成されますが、最初のクリックでは作成されず、2回目のクリックで作成されます。

複製するには、このJSFiddleを参照し、Javascriptの49〜53行目を参照してください。

  map.infoWindow.setContent(c);
  // Chart Resize will resize the DIV as needed.
  // However, the initial click will not show the chart
  chart.resize(175, 145);
  // Chart Render shows the chart on first click, but does not resize the div
  //chart.render();

サイズ変更メソッドには、その中にrenderの呼び出しが含まれているという印象を受けました。したがって、なぜ私がこの振る舞いをしているのかよくわかりません。

チャートdivを、それが含まれる親divと同じサイズで作成するには、何を変更する必要があるかを知る必要があります。

4

1 に答える 1

1

グラフがデフォルトのサイズ（400 x 300px）でレンダリングされる理由は、グラフノード（div＃demoChart）にディメンションがないためです。

さらに、チャートノードdivが表示されるまで、チャートが使用する実際の寸法（スタイル寸法のみ）はありません。その後、デフォルトのサイズである300x400pxにフォールバックします。

コードを機能させるには：

  1. divのcssスタイルを追加します

    #demoChart {
  width: 175px;
  height: 145px;
}

  2. 情報ウィンドウを表示し、チャートノードが実際に表示されたら、チャートを作成します。チャートは、インスタンス化時にディメンションを取得します（予想されるように、render（）メソッドではなく、constructor（）メソッドで）。

JSfiddleを編集して機能させるようにしました（JSfiddleを表示）。

于 2013-01-17T11:01:58.063 に答える