2015-02-10 101 views
1

我已经解决了这个问题。我应该更仔细地阅读API文档。在所有生产线上强制使用相同的颜色


我有15个不同的等值线绘制线条,它们都必须#FF0000 /红色。他们都有红色,但他们有一个稍微更暗,更轻的变体。

选项对象:

 var options = { 
      series: {      
       points: { 
        show: true, 
        radius: 5, 
        symbol: "circle", 
        fill: true, 
        color: ('#00FF00') 
       }, 
       lines: { 
        editable: false, 
        hoverable: false, 
        clickable: false, 
        color: ("#FF0000") 
       } 
      }, 
      yaxes: [ { 
       position: "left", 
       min: 0, max: 60, 
       tickSize: 4, 
       //color: 'transparent' 
      } ], 
      xaxes: [ { 
       position: "bottom", 
       min: 7.00, max: 7.80, 
       //color: 'transparent' 
      } ], 
      grid: { 
       backgroundColor: "white", 
       editable: true, 
       hoverable: false, 
       clickable: false 
      }, 
      legend: { 
       position: "nw" 
      }, 
      colors: ['#FF0000'],     
     }; 

数据对象:

 var data = [     
      { data: line10, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line15, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line20, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line25, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line30, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line35, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line40, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line50, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line60, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line70, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line80, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line90, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line100, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line110, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 
      { data: line120, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false }, 


      { data: startPoint, lines: { show: true }, points: { show: true }, editable: true, editMode: 'xy', color: '#00FF00' }, 
     ]; 

Flot.js API文档指出以下:

如果有更多的数据序列比色,海军报将尝试通过增亮和减淡主题中的颜色来产生额外的颜色。

是否可以将此选项设置为false或强制设置颜色?

回答

2

就像我发布我的问题,我想为什么不尝试添加相同的颜色15次。这工作。

我改变

colors: ['#FF0000'] 

colors: ['#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000', '#FF0000'] 

一个限制是它们基于一个从零开始的索引,所以如果我添加任何其他Flot data series他们之间我必须重新排列颜色。


没关系我任何问题,我再次阅读API文档,发现了color不是lines对象的一部分。这就是我做错了。

予改变的数据对象于此,颜色被设置在每行的末尾:

  var data = [     
       { data: line10, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line15, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line20, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line25, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line30, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line35, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line40, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line50, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line60, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line70, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line80, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line90, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line100, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line110, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 
       { data: line120, lines: { show: true, lineWidth: 2 }, points: { show: false }, editable: false, clickable: false, hoverable: false, color: "#FF0000" }, 


       { data: startPoint, lines: { show: true }, points: { show: true }, editable: true, editMode: 'xy', color: '#00FF00' }, 
      ]; 
相关问题