2015-04-01 79 views
0

所以我正在学习flot图表,但我在使用选项时很难让标签显示或图例。某些选项将起作用(如线条的fill和fillColor),但不是其他选项? 把我的头撞在桌上Jquery Flot Chart标签不显示

由于某种原因,它在jsfiddle中完全不显示,但它在我的web应用程序中却显示出来。

<h1>Flot Examples</h1> 
<div id="placeholder" class="placeholder" style="width:500px; height:300px; background-color:darkcyan;" runat="server"> 

<script type="text/javascript"> 
    var data, data1, dataTime, options, chart; 
    var date = new Date(); //2015 
    var date1 = date.setDate(date.getDate()); 
    var date2 = date.setDate(date.getDate() - 365); //2015 
    var date3 = new Date(date.getFullYear() - 2, date.getMonth() - 5, date.getDate() - 6); 

    dataTime = [ 
     [date1, 1], 
     [date2, 3], 
     [date3, 6] 
    ]; 
    data2 = [dataTime]; 

    data1 = [ 
     [1, 4], 
     [2, 5], 
     [3, 6], 
     [4, 9], 
     [5, 7], 
     [6, 6], 
     [7, 2], 
     [8, 1], 
     [9, 3] 
    ]; 
    data = [data1]; 
    options = { 
     series: { 
      //bars: { show: true } 
      lines: { 
       show: true, 
       // fill: true, 
       //fillColor: "#000000" 
      }, 

     }, 
     xaxis: { 
      mode: "time" 
     }, 
     yaxis: { 
      min: 1 
     }, 
     selection: { 
      mode: "x" 
     }, 
     grid: { 
      show: true 
     }, 
     // clickable: true, 
     // hoverable: true, 
     shadowSize: 20, 
     highlightColor: "#ffffff", //this is the color of the circle that appears 
     label: { 
      string: "invisible" 
     }, 
     tooltip: true, 
     legend: { 
      show: true, 
      labelBoxBorderColor: "#ffffff", 
      position: "ne", 
      margin: 10, 
      backgroundColor: "#66ccff", 

     } 

    }; 

    $(document).ready(function() { 
     // chart1 = $.plot($('<%= placeholder.ClientID %>'), data, options); 
     chart1 = $.plot($(".placeholder"), data2, options); 
    }); 
</script>![enter image description here][1] 
+0

http://jsfiddle.net/#&togetherjs=zj9whJmvV5 – Rainhider 2015-04-01 20:12:26

+0

标签,工具提示或图例都不起作用,但我仅在4-1-2015年深入研究过标签 – Rainhider 2015-04-01 20:13:40

+0

Rainhider 2015-04-01 20:14:48

回答

1

我推荐这个插件用于轴标签:https://github.com/markrcote/flot-axislabels。它可以让你真的简单地为x轴和y轴添加一个标签。

+0

就像一个魅力。 – Rainhider 2015-04-02 16:28:29

+0

很高兴听到它。一定要看看人们制作的所有其他Flot插件。有机会,如果你被困在某个地方,有人已经为它做出了解决方案。 – jonmrich 2015-04-02 16:37:19

+0

我在哪里可以找到那些? – Rainhider 2015-04-02 16:39:08