调用从clojurescript的JavaScript（canvasjs）

我有麻烦将下列javscript呼吁canvasjs到clojurescript：调用从clojurescript的JavaScript（canvasjs）

var chart = new CanvasJS.Chart("chartContainer", { 

    title:{ 
    text: "Fruits sold in First Quarter"    
    }, 
    data: [//array of dataSeries    
    { //dataSeries object 

    /*** Change type "column" to "bar", "area", "line" or "pie"***/ 
    type: "column", 
    dataPoints: [ 
    { label: "banana", y: 18 }, 
    { label: "orange", y: 29 }, 
    { label: "apple", y: 40 },          
    { label: "mango", y: 34 }, 
    { label: "grape", y: 24 } 
    ] 
    } 
    ] 
});

可有人请点我到如何做，或提供一个例子正确的方向？

最好的问候，斯文

来源

2014-03-29 sveri

什么问题，你遇到？这是简单的JS互操作：

(def chart (js/CanvasJS.Chart. "chartContainer" (clj->js { 
    :title {:text "Fruits sold in First Quarter"} 
    :data [{:type "column" 
      :dataPoints [{ :label "banana" y: 18 } 
         { :label "orange" y: 29 } 
         { :label "apple" y: 40 } 
         { :label "mango" y: 34 } 
         { :label "grape" y: 24 }]}]})))

哪个编译为：

cljs.user.chart = (new CanvasJS.Chart("chartContainer", cljs.core.clj__GT_js.call(
    null, new cljs.core.PersistentArrayMap(null, 2, [new cljs.core.Keyword(
     null, "title", "title", 1124275658), new cljs.core.PersistentArrayMap(
     null, 1, [new cljs.core.Keyword(null, "text", "text", 1017460895), 
     "Fruits sold in First Quarter" 
     ], null), new cljs.core.Keyword(null, "data", "data", 1016980252), 
    new cljs.core.PersistentVector(null, 1, 5, cljs.core.PersistentVector 
     .EMPTY_NODE, [new cljs.core.PersistentArrayMap(null, 2, [new cljs.core 
     .Keyword(null, "type", "type", 1017479852), "column", new cljs 
     .core.Keyword(null, "dataPoints", "dataPoints", 2200126623), 
     new cljs.core.PersistentVector(null, 5, 5, cljs.core.PersistentVector 
      .EMPTY_NODE, [new cljs.core.PersistentArrayMap.fromArray([ 
      new cljs.core.Keyword(null, "label", "label", 
       1116631654), "banana", cljs.user.y_COLON_, 18 
      ], true, false), new cljs.core.PersistentArrayMap.fromArray(
      [new cljs.core.Keyword(null, "label", "label", 
       1116631654), "orange", cljs.user.y_COLON_, 29], true, 
      false), new cljs.core.PersistentArrayMap.fromArray([new cljs 
      .core.Keyword(null, "label", "label", 1116631654), 
      "apple", cljs.user.y_COLON_, 40 
      ], true, false), new cljs.core.PersistentArrayMap.fromArray(
      [new cljs.core.Keyword(null, "label", "label", 
       1116631654), "mango", cljs.user.y_COLON_, 34], true, 
      false), new cljs.core.PersistentArrayMap.fromArray([new cljs 
      .core.Keyword(null, "label", "label", 1116631654), 
      "grape", cljs.user.y_COLON_, 24 
      ], true, false)], null) 
     ], null)], null) 
    ], null))))

您也可以使用#js标记的文字，并创建简单的JS数据（即使它看起来丑陋）：

(def chart (js/CanvasJS.Chart. "chartContainer" #js{ 
    :title #js{:text "Fruits sold in First Quarter"} 
    :data #js[#js{:type "column" 
    ...

来源

2014-03-31 09:24:50 Joaquin

非常感谢你。它是这样工作的。我只是不知道如何调用CanvasJS.Chart和cljs-> js方法。 – sveri

调用从clojurescript的JavaScript（canvasjs）

回答

相关问题