根据不同的值更改颜色(Changing color depending on value)

进出口工作莫里斯JS图。

该图绘制，但我想改变依赖于从分贝值的颜色或点。

我想改变颜色，当行动=购买。

我的JSON：

[{"longdate":"2014-08-20 18:20:01","price":"1620","action":"buy"},{"longdate":"2014-08-20 18:40:01","price":"1640","action":""},{"longdate":"2014-08-20 19:00:01","price":"1620","action":""}]

莫里斯脚本：

  $.getJSON('results.json', function(day_data) {

    Morris.Line({
      element: 'graph',
      data: day_data,
      action: 'action',
      xkey: 'longdate',
      ykeys: ['price'],
      labels: ['Cena'],
      pointSize: 4,
      lineColors: function(action) {
        if(action == "buy") return "#0da3be";
        else if(price == "sell") return "#11ca26";
        else return "#722c7c";
    },
      hoverCallback: function(index, options, content) { 
         //var displayDate = "<b>"+changeDateFormat(day_data[index]['clock'])+"</b><br>";
         var date = "<b><font color='black'>Data: "+day_data[index]['longdate']+"</font></b><br>";
         var param1 = "<font color='"+lineColor[0]+"'>Cena - "+day_data[index]['price']+"</font><br>";
         return date+param1;
      },
      xLabelFormat : function (x) {
       return changeDateFormat(x);
      }

    });
  });

改变颜色不工作，我怎样才能使它发挥作用？

Answer 1:

我看到的对象的阵列。 因此，对于每个对象，你可以只检查团购领域。

function drawLine(action){

 if(!action) return;

 var color = null;
 if(action == "buy") color ="red";
 else color = "black";

 Morris.Line({
      element: 'graph',
      data: day_data,
      action: 'action',
      xkey: 'longdate',
      ykeys: ['price'],
      labels: ['Cena'],
      pointSize: 4,
      lineColors: function() {
        return color;
    },
      hoverCallback: function(index, options, content) { 
         //var displayDate = "<b>"+changeDateFormat(day_data[index]['clock'])+"</b><br>";
         var date = "<b><font color='black'>Data: "+day_data[index]['longdate']+"</font></b><br>";
         var param1 = "<font color='"+lineColor[0]+"'>Cena - "+day_data[index]['price']+"</font><br>";
         return date+param1;
      },
      xLabelFormat : function (x) {
       return changeDateFormat(x);
      }

    });
}

现在，解析您的数据

$.getJSON('results.json', function(day_data) {
  var l = day_data || [];
  for(var i = 0; i < l.length; i++){
    drawLine(l[i].action);
  }
});

文章来源: Changing color depending on value