动态更改 Dashing 小部件的背景颜色
Dynamically change background colour of a Dashing widget
我使用基于 ruby 的 Dashing 框架构建了一个仪表板,一切似乎都很好 运行 但我希望能够更改我的列表之一的背景颜色基于列表中的值之一的小部件 (mywidget)。
我的 updatelist.rb 工作文件目前看起来像:
hashdata = Hash.new({ value: 0 })
SCHEDULER.every '10s' do
File.open('xxx.txt').each do |line|
field = line.split(;).first
value = line.split(;).last
if ['Status', 'Active', 'Duration].include? field
hashdata[field] = { label: field, value: value }
end
end
send_event('mywidget', { items: hashdata.values })
end
它正在读取的文件 (xxx.txt) 的格式如下:
Status; Good
Active; No
Duration; 1000
我想根据 Status 的值更改列表小部件的背景颜色,即 Good=green,Average=yellow,Poor=red。
我该怎么做?在咖啡脚本中添加一些东西似乎是显而易见的解决方案,但我看不出如何实现它
关于在 coffeescript 中需要代码的说法是正确的。我建议如下:
class Dashing.List extends Dashing.List
color: () ->
data = @get('items')
status = # code to process color from your data (I'm not sure exactly your format)
switch status
when "Good" then "#33cc33" # green
when "Average" then "#ffff00" # yellow
when "Poor" then "#ff0000" # red
else "#000000"
onData: (data) ->
# change the background color every time that new data is sent
$(@get('node')).css 'background-color', @color()
我使用基于 ruby 的 Dashing 框架构建了一个仪表板,一切似乎都很好 运行 但我希望能够更改我的列表之一的背景颜色基于列表中的值之一的小部件 (mywidget)。
我的 updatelist.rb 工作文件目前看起来像:
hashdata = Hash.new({ value: 0 })
SCHEDULER.every '10s' do
File.open('xxx.txt').each do |line|
field = line.split(;).first
value = line.split(;).last
if ['Status', 'Active', 'Duration].include? field
hashdata[field] = { label: field, value: value }
end
end
send_event('mywidget', { items: hashdata.values })
end
它正在读取的文件 (xxx.txt) 的格式如下:
Status; Good
Active; No
Duration; 1000
我想根据 Status 的值更改列表小部件的背景颜色,即 Good=green,Average=yellow,Poor=red。
我该怎么做?在咖啡脚本中添加一些东西似乎是显而易见的解决方案,但我看不出如何实现它
关于在 coffeescript 中需要代码的说法是正确的。我建议如下:
class Dashing.List extends Dashing.List
color: () ->
data = @get('items')
status = # code to process color from your data (I'm not sure exactly your format)
switch status
when "Good" then "#33cc33" # green
when "Average" then "#ffff00" # yellow
when "Poor" then "#ff0000" # red
else "#000000"
onData: (data) ->
# change the background color every time that new data is sent
$(@get('node')).css 'background-color', @color()