flot jquery是可能绘制这种图表 [英] flot jquery is it possible to draw this kind of chart

查看:192
本文介绍了flot jquery是可能绘制这种图表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我用来绘制这种图表(一个垂直轴,一个水平轴):





现在我被要求做这样的图表:



如您所见,



我的问题



执行flot或

请参阅

www.flotcharts.org/flot/examples/axes-multiple/index.htmlrel =nofollow noreferrer>多轴。最小示例:

  $。plot(#placeholder,[
{data:d1},
{data:d2,yaxis:2} //设置第二个系列使用第二个轴
],{
yaxes:[{
min:0 //第一个轴的选项
},{
alignTicksWithAxis:1 //第二轴的选项,放在右边
position:right
}],
}

两个条形图和折线图在每个系列对象中混合:

  $ .plot(#placeholder,[{
data:d1,
lines:{show:true}
},{
data:d2,
bars:{show:true}
}]);

将这些放在一起,这里有一个 example




I used to draw this kind of chart (one vertical axis, one horizantal axis):

Now i have been asked to do this kind of chart:

as you see, the problem with the ordered chart that it contains (two vertical axis, one horizantal axis).

My question

does flot or any other jquery library able to do that please?

解决方案

See the flot example here on multiple axis. Minimal example:

$.plot("#placeholder", [
    { data: d1 },
    { data: d2, yaxis: 2 } // set second series to use second axis
], {
    yaxes: [ { 
            min: 0 // options for first axis
        }, {
            alignTicksWithAxis: 1 // options for second axis, put it on right
            position: "right"
        } ],
});

Two mix a bar and line chart set that in each's series object:

    $.plot("#placeholder", [{
        data: d1,
        lines: { show: true }
    }, {
        data: d2,
        bars: { show: true }
    }]);

Putting these together, here's an example:

这篇关于flot jquery是可能绘制这种图表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆