我有一个网页,我想在其中使用 Kendoui Dataviz 图表显示不同的图表。 这些图表有不同的选项。现在我希望能够从 HTML 设置正确的图形选项。与 Kendoui 文档不同,其中选项始终绑定(bind)到某个 #id。不是很有活力。所以我从这样的 HTML 开始:
<div data-options="CheapOptions" class="chartholder">
<div id="Cheapo" style="height:180px;width:500px" class="chartClass"></div>
</div>
<div data-options="ExpensiveOptions" class="chartholder">
<div id="Expensive" style="height:180px;width:500px" class="chartClass"></div>
</div>
然后我有一个 Coffeescript(自动编译为 JS,没有函数包装器),我在其中设置选项并运行一个函数来决定哪些 div 应显示哪个图形。
CheapOptions =
series: [
name: "Costs 1"
data: [100]
,
name: "Costs 2"
data: [200]
]
ExpensiveOptions =
series: [
name: "Costs 1"
data: [300]
color: "#AABBCC"
,
name: "Costs 2"
data: [400]
]
$ ->
$(".chartholder").each ->
mydiv = $(this)
myoptions = mydiv.data("options")
mygraph = mydiv.children(":first")
myid = "#" + mygraph.attr("id")
# APPLY THE GRAPH
$(myid).kendoChart myoptions # DOESN'T WORK
$(myid).kendoChart[myoptions]() # DOESN'T WORK
$(myid).kendoChart CheapOptions # WORKS
第一个选项出现此错误:
Error: Cannot call method 'CheapOptions' of kendoChart before it is initialized
第二个选项出现此错误:
TypeError: 'undefined' is not a function (evaluating '$(n).kendoChart[r]()')
第三个选项的作用是表明该函数可以看到选项,但随后我在所有 div 中得到相同的图表,而它应该使用我在 HTML 中放入的正确图表。我怎样才能做到这一点?
这是一个 JSFiddle,您可以在其中使用以下选项: http://jsfiddle.net/5TFAk/5/
最佳答案
更好的方法(评估是危险的,应该避免):
options =
CheapOptions:
series: [
name: "Costs 1"
data: [100]
,
name: "Costs 2"
data: [200]
]
ExpensiveOptions:
series: [
name: "Costs 1"
data: [300]
color: "#AABBCC"
,
name: "Costs 2"
data: [400]
]
然后:
$(myid).kendoChart options[myoptions]
关于javascript - 带选项的 Coffeescript 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21431480/