Question

我使用jquery flot显示图表....我想显示双x轴.....两者都有相同的值..我怎么能显示这个？请帮忙

此致 Nisanth

Answer 1

请通过插件检查代码这是一个示例的源代码检查链接 http://people.iola.dk/olau/flot/examples/multiple-axes.html - 感谢@Mads Skjern更正链接

这是jflot开发团队的示例的示例部分

<html> 
 <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>Flot Examples</title> 
    <link href="layout.css" rel="stylesheet" type="text/css"></link> 
    <!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.min.js"></script><![endif]--> 
    <script language="javascript" type="text/javascript" src="../jquery.js"></script> 
    <script language="javascript" type="text/javascript" src="../jquery.flot.js"></script> 
 </head> 
    <body> 
    <h1>Flot Examples</h1> 

    <div id="placeholder" style="width:600px;height:300px;"></div> 

    <p>Dual axis support showing the raw oil price in US $/barrel of
    crude oil (left axis) vs. the exchange rate from US $ to € (right
    axis).</p> 

    <p>As illustrated, you can put in secondary y and x axes if you
    need to. For each data series, simply specify the axis number.</p> 

<script id="source" language="javascript" type="text/javascript"> 
$(function () {
    var oilprices = [[1167692400000,61.05], [1167778800000,58.32], [1167865200000,57.35], [1167951600000,56.31], .... some data..... [1219874400000,115.59], [1219960800000,115.46], [1220306400000,109.71], [1220392800000,109.35], [1220565600000,106.23], [1220824800000,106.34]];
    var exchangerates = [[1167606000000,0.7580], [1167692400000,0.7580], [1167778800000,0.75470], ... some data..[1220738400000,0.70120], [1220824800000,0.7010], [1220911200000,0.70050]];

    $.plot($("#placeholder"),
           [ { data: oilprices, label: "Oil price ($)" },
             { data: exchangerates, label: "USD/EUR exchange rate", yaxis: 2 }],
           { 
             xaxis: { mode: 'time' },
             yaxis: { min: 0 },
             y2axis: { tickFormatter: function (v, axis) { return v.toFixed(axis.tickDecimals) +"€" }},
             legend: { position: 'sw' } });
});
</script> 
 </body> 
</html>

Jquery flot双轴

1 个答案: