Dashing:数字小部件背景颜色

时间:2016-04-01 19:25:09

标签: css background coffeescript widget dashing

可以在同一个仪表板上多次使用数字窗口小部件吗?

e.g。 我想显示每个团队成员的当前分数,每个团队成员一个窗口小部件,其中上/下箭头将当前分数与最后分数进行比较,如果分数上升,则窗口小部件背景为绿色,如果窗口小部件背景为红色。

我的.rb文件从excel文件传递数据。

每个小部件显示正确的当前分数 每个小部件都显示正确的向上/向下箭头 尽管.coffee显示相反的情况,所有小部件都显示出我想要的相同但相反的颜色。

如果循环检测到第一次传递后背景应该停止的那种颜色就是这样。

错误或错误的代码? number4.coffee

//
// ----------------------------------------------------------------------------
// Mixins
// ----------------------------------------------------------------------------
@mixin transition($transition-property, $transition-time, $method) {
-webkit-transition: $transition-property $transition-time $method;
-moz-transition: $transition-property $transition-time $method;
-o-transition: $transition-property $transition-time $method;
transition: $transition-property $transition-time $method;
}

// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$value-color: #fff;

$title-color: rgba(255, 255, 255, 0.7);
$moreinfo-color: rgba(255, 255, 255, 0.7);

// ----------------------------------------------------------------------------
// Widget-number styles
// ----------------------------------------------------------------------------
.widget-number4 {

.title {
color: $title-color;
font-size: 40px;

 }

.value {
color: $value-color;

}

.change-rate {
font-weight: 500;
font-size: 30px;
color: $value-color;
}

.more-info {
color: $moreinfo-color;
font-size: 23px;
bottom: 40px;

}

.updated-at {
color: white;
font-size: 23px;
}

}

number4.scss

let ab =
  let a = 'a' in
  let b = 'B' in
  a::[Char.lowercase b]
in
(* The rest of your code. *)

1 个答案:

答案 0 :(得分:0)

您可以在一个仪表板上多次使用窗口小部件,但听起来您已经使用了该部件。

您需要淡出小部件,设置背景颜色,然后再次淡入。否则,您将看不到渲染已经发生的背景颜色变化。

onData: (data) ->
      
    if @get('last')
      if parseInt(@get('current')) > parseInt(@get('last')) then $(@node).fadeOut().css('background-color', "#006600").fadeIn() else $(@node).fadeOut().css('background-color', "#660000").fadeIn()
    

希望这有帮助。