带有d3.js的安全堆栈

时间:2018-08-25 01:09:49

标签: f# fable-f#

我正在尝试将使用d3创建的数据可视化集成到SAFE堆栈默认模板中。

作为概念上的证明,我正在尝试整合此条形图:http://fable.io/fable-graphics/samples/d3/barchart/index.html

我已经能够将条形图的代码插入到client.fs中:

let svg = Fable.Import.D3.Globals.select("#display")
                                 .append("svg")
                                 .attr("width", U3.Case1 width)
                                 .attr("height", U3.Case1 height)

所有内容都能编译并运行良好,但是我不知道如何在生成的页面上实际显示图像。

我猜它必须插入视图中

let view (model : Model) (dispatch : Msg -> unit) =
    div []
        [ Navbar.navbar [ Navbar.Color IsPrimary ]
            [ Navbar.Item.div [ ]
                [ Heading.h2 [ ]
                    [ str "SAFE Template" ] ] ]
......

但是我做了几次尝试,无法编译。

有人知道该怎么做吗?

谢谢

1 个答案:

答案 0 :(得分:1)

事实证明,这实际上非常简单。

所需要做的就是将选择器从“ #display”更改为像这样的“ body”这样的存在

let svg = Fable.Import.D3.Globals.select("body")