Question

我正在使用jqPlot来绘制一些重量数据......如果我没有指定只在xAxis上显示年份，那么显示器就会混乱......但似乎我无法获得显示的完整日期何时突出显示任何数据点。有没有办法让荧光笔使用日期识别格式化程序，而不是简单的printf东西？

<link rel="stylesheet" type="text/css" hrf="jqPlot/jquery.jqplot.min.css" />

<script>

$(document).ready(function(){
  var line1=

  [['1999.03.17',205],
  ['2001.06.15',189],
  ['2001.10.11',179],
  ['2004.01.09',192.5 ],
  ['2006.04.12',221.5],
  ['2007.12.06',216.5],
  ['2009.01.26',220],
  ['2010.06.22',215],
  ['2011.01.03',210],
  ['2012.04.20',208],
  ['2012.05.09',207.8],
  ['2013.05.03',201.2],
  ['2014.01.23',190.9]
];

var plot2 = $.jqplot('chart2', [line1], {
 highlighter: {
    show: true,
    formatString: "%s %d",
    tooltipAxes:'xy'        
  },

  axes:{
    xaxis:{
      renderer:$.jqplot.DateAxisRenderer, 
      tickOptions:{formatString:'%y'},
        tickInterval:'1 years'
    }
  },
  series:[{lineWidth:4, markerOptions:{show:false}}]
 });
});

Answer 1

以下是解决方案：JsFiddle

$(document).ready(function () {
    function tooltipeditor(str, seriesIndex, pointIndex, plot) {
        var data = plot.data[seriesIndex][pointIndex]
        return "<div>" + data[0] + " , " + data[1] + "</div>";
    }

    var line1 =

    [
        ['1999/03/17', 205],
        ['2001/06/15', 189],
        ['2001/10/11', 179],
        ['2004/01/09', 192.5],
        ['2006/04/12', 221.5],
        ['2007/12/06', 216.5],
        ['2009/01/26', 220],
        ['2010/06/22', 215],
        ['2011/01/03', 210],
        ['2012/04/20', 208],
        ['2012/05/09', 207.8],
        ['2013/05/03', 201.2],
        ['2014/01/23', 190.9]
    ];

    var plot2 = $.jqplot('chart1', [line1], {
        highlighter: {
            show: true,
            tooltipContentEditor: tooltipeditor
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.DateAxisRenderer,
                tickOptions: {
                    formatString: '%y'
                },
                //tickInterval: '1 years'
            }
        },
        series: [{
            lineWidth: 4,
            markerOptions: {
                show: true
            },

        }]
    });
});

jqPlot：显示高亮显示的完整日期和值，仅在轴上显示年份？

1 个答案: