Question

我开始在我的cljs网站中使用plotlyjs，遇到了某种特殊类型的图形（森伯斯特）的问题。问题是，当我在浏览器的控制台上从cljs repl /调用函数Plotly.newPlot时，生成的图只是空的，而当我在脚本标记中调用此函数时，一切正常。这里要更清楚一些的代码（该代码与sunburst的plotly.js页面中的示例相同）

     <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Volley Stats</title>
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <script src='https://cdn.plot.ly/plotly-latest.min.js'></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/material-design-iconic-font.min.css">
    <link rel="stylesheet" href="assets/css/re-com.css">
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic" rel="stylesheet" type="text/css">
    <link href='https://fonts.googleapis.com/css?family=Roboto+Condensed:400,300' rel='stylesheet' type='text/css'>
    <link rel="icon" href="https://clojurescript.org/images/cljs-logo-icon-32.png">
  </head>
<body>
   <div id="myDiv"> </div>
    <script>
var data = [{
  type: "sunburst",
  labels: ["Eve", "Cain", "Seth", "Enos", "Noam", "Abel", "Awan", "Enoch", "Azura"],
  parents: ["", "Eve", "Eve", "Seth", "Seth", "Eve", "Eve", "Awan", "Eve" ],
  values:  [10, 14, 12, 10, 2, 6, 6, 4, 4],
  outsidetextfont: {size: 20, color: "#377eb8"},
  leaf: {opacity: 0.4},
  marker: {line: {width: 2}},
}];

var layout = {
  margin: {l: 0, r: 0, b: 0, t: 0},
  width: 500,
  height: 500
};


Plotly.newPlot('myDiv', data, layout);
      </script>
</body>

在cljs中

(def layout0 (clj->js {
                   :margin {:l 0 :r 0 :t 0 :b 0 }
                   :width 500
                   :height 500}))
                   


(def data0 (clj->js [{
                  :type "sunburst"
                  :labels ["Eve"  "Cain"  "Seth"  "Enos"  "Noam"  "Abel"  "Awan"  "Enoch"  "Azura"]
                  :parents [""  "Eve"  "Eve"  "Seth"  "Seth"  "Eve"  "Eve"  "Awan"  "Eve" ]
                  :values  [10  14  12  10  2  6  6  4  4]
                  :outsidetextfont {:size 20, :color "#377eb8"}
                  :leaf {:opacity 0.4}
                  :marker {:line {:width 2}}}]))

，然后从repl调用此函数：

(js/Plotly.newPlot "myDiv" data0 layout0)

ofc当我从clojure呼叫时，我注释掉了脚本标签，并留下将要填充的div标签。当我从浏览器的控制台调用函数时也会发生同样的情况（结果为空图）旁注：我在Clojure应用程序中使用试剂为什么会发生这种情况的一些想法？我应该怎么做才能解决它？

PS：我也尝试使用script标记中定义的数据，但结果仍然相同。我在cljs repl中调用的函数是(js/Plotly.newPlot "myDiv" js/data js/layout)。因此，在cljs和js之间的互操作方式上肯定缺少一些东西，因为这绝对不是我如何表示newPlot中使用的数据的问题

PSPS：仅在朝阳图上会发生此问题（我尝试过其他几种图，并且所有方面都可以正常工作）

Clojurescript和Plotly.js不会呈现森伯斯特

0 个答案: