Question

我正在编写一些Elm代码来渲染SVG（我是一个菜鸟）。我有下面列出的相关视图代码（请注意onClick消息存在于其他代码中）。我现在要做的就是绘制一个矩形或一条线来看它是如何工作的。当我运行包含此视图的elm代码时，不会绘制svg图形。如果“像素模型”使用线条，则绘制按钮并绘制模型的文本字符串，但不绘制线条。如果“像素模型”使用rect情况，则整个浏览器选项卡为空白/白色（没有按钮或文本字符串呈现）。我的代码有问题或者我遇到过Elm bug吗？我已经尝试将代码粘贴到elm-lang.org/try中，并使用0.17的Mac Installer发行版并在localhost：8000上运行elm-reactor。

import Html exposing (div, button, text, canvas, svg)
import Html.App exposing (beginnerProgram)
import Html.Events exposing (onClick)
import Html.Attributes exposing (id, height, width, style)
import Svg exposing (rect, line)
import Svg.Attributes exposing (x, y, x1, y1, x2, y2, viewBox, fill, color, stroke, strokeWidth)

<snip>

view model =
  div []
    [ button [ onClick Left  ] [ text "Left"     ]
    , button [ onClick Right ] [ text "Right"    ]
    , button [ onClick Down  ] [ text "Down"     ]
    , button [ onClick Up    ] [ text "Up"       ]
    , button [ onClick Out   ] [ text "Zoom out" ]
    , button [ onClick In    ] [ text "Zoom in"  ]
    , button [ onClick Reset ] [ text "Reset"    ]
    , div [] [ text (toString model) ]
    , svg [width 300, height 300, viewBox "0 0 300 300"] (pixels model)
]

pixels model = [rect [x "20", y "20", width 70, height 70, fill "rgb(255,0,0)" ][]]
--pixels model = [line [x1 "20", y1 "20", x2 "70", y2 "70", stroke "red", strokeWidth "2"][]]

Answer 1

您应该使用const findStuff = (data, x) => { let found; data.some(u => u.userData.some(ud => { const s = ud.stuff.find(s => s.id === x.id); if (s) { found = s; return true; } }) ); return found; };代替Svg.svg。

SVG没有绘制Elm代码

1 个答案: