簡體   English   中英

浮圖折線圖漸變填充

[英]Flot Line chart gradient fill

我的問題可能會或可能不會在Flot上重復出現此漸變

根據上面的鏈接的答案,我試圖將折線填充應用於折線圖。 它沒有按預期工作。 這是我嘗試過的代碼;

$(function () {
    var d1 = [[1,14], [2,15], [3,18], [4,16], [5,19], [6,17], [7,15], [8,16], 
        [9,20], [10,16], [11,18]];
    $.plot("#line-chart", [{
        data: d1,
        label: "Data",
        }],
        {
            series: {
                lines: {
                    show: true,
                    lineWidth: 1,
                    fill: 0.25,
                },
                gradient: {
                    radial: true,
                    colors: [
                        {opacity: 0.5},
                        {opacity: 1.0}
                    ]
                },
                shadowSize: 0,
                points: {
                    show: true,
                }
            },
            yaxis: {
                min: 10,
                max: 22,
                tickColor: 'rgba(255,255,255,0.15)',
                tickDecimals: 0,
                font :{
                    lineHeight: 13,
                    style: "normal",
                    color: "rgba(255,255,255,0.8)",
                },
                shadowSize: 0,
            },
            xaxis: {
                tickColor: 'rgba(255,255,255,0)',
                tickDecimals: 0,
                font : {
                    lineHeight: 13,
                    style: "normal",
                    color: "rgba(255,255,255,0.8)", 
                }
            },
            grid: { 
                borderWidth: 1,
                borderColor: 'rgba(255,255,255,0.25)',
                labelMargin:10,
                hoverable: true,
                clickable: true,
                mouseActiveRadius:6,
            },
            legend: {
                show: false
            }
        }
    );
});

幫我在折線圖上添加漸變填充。

漸變選項是pie插件使用的特殊功能。 常規系列將漸變更像是一種可以用作系列fillColor的顏色。

請看一下文檔的“ 指定漸變”部分下的示例。

我用;

網格:{backgroundColor:{顏色:[“#4ca8fa”,“#2887da”]},

在javascript部分中顯示漸變背景(如果有幫助的話)。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM