Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/397.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 弗洛特图表。x轴值以下的自定义颜色_Javascript_Flot - Fatal编程技术网

Javascript 弗洛特图表。x轴值以下的自定义颜色

Javascript 弗洛特图表。x轴值以下的自定义颜色,javascript,flot,Javascript,Flot,我有一个Flot条形码 $(function() { var barOptions = { series: { bars: { show: true, barWidth: 0.4, fill: true, fillColor: {

我有一个Flot条形码

$(function() {  
        var barOptions = {
            series: {
                bars: {
                    show: true,
                    barWidth: 0.4,
                    fill: true,
                    fillColor: {
                        colors: [{
                            opacity: 0.8
                        }, {
                            opacity: 0.8
                        }]
                    }
                }
            },
            xaxis: {
                mode: "categories",
                tickLength: 0 
            },              
            yaxis: {
                min:-200, max: 200,  tickSize: 50,
            },
            colors: ["#1ab394"],
            grid: {
                color: "#999999",
                hoverable: true,
                clickable: true,
                tickColor: "#D4D4D4",
                borderWidth:0
            },
            legend: {
                show: false
            },
            tooltip: true,
            tooltipOpts: {
                content: "Cost: %y %"
            }
        };

        var barData = {
            label: "bar",
            data: [         
            ["First", -100],["Second", 66.67],["Third", -177.77],]

        };

        $.plot($("#flot-bar-chart"), [barData], barOptions);            

    });

我希望0以下的每个条都是特定的颜色(例如红色)。我曾尝试使用threshold插件来实现这一点,但它增加了额外的值。有什么解决方案吗?

阈值插件不应添加额外的值,请参阅以下内容或代码片段:

$(函数(){
var气压选项={
系列:{
酒吧:{
秀:没错,
杆宽:0.4,
填充:是的,
填充颜色:{
颜色:[{
不透明度:0.8
}, {
不透明度:0.8
}]
},
对齐:“居中”
}
},
xaxis:{
模式:“类别”,
长度:0,
滴答声:[
[1,‘第一’],
[2,‘第二’],
[3,‘第三’]
]
},
亚克斯:{
最低:-200,
最高:200,
尺寸:50,
},
颜色:[“#1ab394”],
网格:{
颜色:#999999“,
悬停:是的,
可点击:正确,
勾选颜色:“D4”,
边框宽度:0
},
图例:{
节目:假
},
提示:正确,
工具提示:{
内容:“成本:%y%”
}
};
var barData={
标签:“酒吧”,
数据:[
[1, -100],
[2, 66.67],
[3, -177.77],
],
阈值:{
低于:0,,
颜色:“rgb(200、20、30)”
},
};
$.plot($(“#弗洛特条形图”),[barData],barOptions);
});
#flot条形图{
高度:300px;
}


谢谢。这是因为我的x轴没有刻度。也许你知道有没有可能在x轴的顶部显示数字?因为现在我看不到一些数字,也看不到更小的步长。你的y轴最小值只有-100而不是-200。对于非常小的条形图,您需要一种背景可读的条形图标签颜色,例如黑色。