Google DataVisualization をカスタマイズしたいときに、コントロールのコンストラクターをパラメーター化したかったのですがinputDataTable
、パラメーターとして を渡すと、何らかの理由で機能しないようです。
私が使用するデフォルトのデータは次のとおりです。
module Example =
let headers = [|"Country"; "Population (mil)"; "Area (km2)" |]
let inputDataTable = [|
[|box "CN"; box 1234000; box 9640821|]
[|box "IN"; box 1133000; box 3287263|]
[|box "US"; box 304000; box 9629091|]
[|box "ID"; box 232000; box 1904569|]
[|box "BR"; box 187000; box 8514877|]
|]
Web ページでグラフを生成するコード。
let GeoChart headers inputDataTable =
Div []
|>! OnAfterRender (fun container ->
let dataFormatter = DefaultOptions.NumberFormatter ""
let options = DefaultOptions.GeoChart
let visualization = new GeoChart(container.Dom)
let data = Data.GeoMapData headers inputDataTable
dataFormatter.format(data, 1)
visualization.draw(data, options)
)
「期待される」コントロール。
type GoogleGeoChartViewer(headers, inputDataTable) =
inherit Web.Control()
[<JavaScript>]
override this.Body =
Google.Charts.GeoChart headers inputDataTable :> _
そして基本テンプレートを使ったテスト。
let HomePage =
let headers = Google.Example.headers
let inputDataTable = Google.Example.inputDataTable
Skin.WithTemplate "HomePage" <| fun ctx ->
[
Div [Text "HOME"]
Div [new Controls.EntryPoint()]
Div [new Controls.GoogleGeoChartViewer(headers, inputDataTable)]
Links ctx
]
ただし、このコードを使用すると、地理チャートが表示されません。
inputDataTable
しかし、パラメーターのリストからを削除して使用すると、次のようになります。
let GeoChart headers =
Div []
|>! OnAfterRender (fun container ->
let dataFormatter = DefaultOptions.NumberFormatter ""
let options = DefaultOptions.GeoChart
let visualization = new GeoChart(container.Dom)
let inputDataTable = Example.inputDataTable
let data = Data.GeoMapData headers inputDataTable
dataFormatter.format(data, 1)
visualization.draw(data, options)
)
できます...
ただし、headers
配列は問題を引き起こしません。
何が起こっているのか誰にも分かりませんか?
あなたの洞察に感謝します。