1

当您将鼠标悬停在相关条形上时,我试图隐藏所有标签并仅在 jqplot 中显示条形图的 x 和 y 值。我已经能够摆脱 y 轴标签,但无法正确摆脱 x 轴标签。此外,x 轴的荧光笔中的值正在转换为整数,而不是包含文本值。有任何想法吗?

这是html:

    <html>
<head>
<!--[if lt IE 9]><script language="javascript" type="text/javascript"
src="/static/jqplot/excanvas.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/jquery-1.5.1.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/jquery.jqplot.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.highlighter.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.cursor.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.barRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.categoryAxisRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.canvasAxisTickRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<script language="javascript" type="text/javascript" src="http://www.jqplot.com/src/plugins/jqplot.canvasTextRenderer.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.jqplot.com/src/jquery.jqplot.min.css" />
</head>
<div id="numbertimeschart" style="width: 800px; height=600px"></div>
<script type="text/javascript">
$.jqplot('numbertimeschart',  [[['Nov 10, 2012, 02:22PM, number 6', 123.70500016212463], ['Nov 10, 2012, 02:22PM, number 5', 121.24499988555908], ['Nov 10, 2012, 02:22PM, number 4', 123.40899991989136], ['Nov 10, 2012, 02:22PM, number 3', 123.13800001144409], ['Nov 10, 2012, 02:22PM, number 2', 127.06200003623962], ['Nov 10, 2012, 01:10PM, number 9', 121.8140001296997], ['Nov 10, 2012, 01:10PM, number 8', 124.24000000953674], ['Nov 10, 2012, 01:10PM, number 7', 122.05999994277954], ['Nov 10, 2012, 01:10PM, number 6', 124.79999995231628], ['Nov 10, 2012, 01:10PM, number 5', 123.58000016212463], ['Nov 10, 2012, 01:10PM, number 4', 124.0149998664856], ['Nov 10, 2012, 01:10PM, number 3', 124.79500007629395], ['Nov 10, 2012, 01:10PM, number 2', 126.04999995231628], ['Nov 10, 2012, 11:37AM, number 8', 120.31300020217896], ['Nov 10, 2012, 11:37AM, number 7', 123.29999995231628], ['Nov 10, 2012, 11:37AM, number 6', 122.19000005722046], ['Nov 10, 2012, 11:37AM, number 5', 121.6819999217987], ['Nov 10, 2012, 11:37AM, number 4', 122.83599996566772], ['Nov 10, 2012, 11:37AM, number 3', 124.12800002098083], ['Nov 10, 2012, 11:37AM, number 2', 127.18899989128113]]],{     
    seriesDefaults:{
        renderer:$.jqplot.BarRenderer,
    },
    series:[
        {
            label: 'Most recent 20 numbers for Test',
            color: '#fa554f',
            markerOptions: {
                show: false,
            },
        },
    ],
    grid:{
        background: "#FFFFFF",
        gridLineColor: "#222222",
        borderColor: "#323232",
        borderWidth: 1.0,
    },
    axesDefaults: {
        pad: 0,
        showTicks: false,
        showTickMarks: false,
    },
    axes:{
        xaxis:{
            renderer: $.jqplot.CategoryAxisRenderer,
            rendererOptions: {
                tickRenderer: $.jqplot.AxisTickRenderer,
                tickOptions: {
                    show: false,
                    showLabel: false,
                    formatString: '%s',
                },
            }
        },
        yaxis:{
            tickOptions: {
                formatString: '%.2f',
            }
        }
    },
    highlighter: {
        show: true,
        sizeAdjust: 0,
        tooltipLocation: 'ne',
    },
    legend:{
        show: true,
        location: 'nw',
    },
    cursor:{
        show: false, 
    }
});
</script>
</html>
4

1 回答 1

0

荧光笔:{显示:true,sizeAdjust:7.5,tooltipAxes:'y',},

//////////////

tooltipAxes: 'both', // 在工具提示中显示哪个轴值,x、y 或两者。

于 2014-05-19T03:45:05.700 回答