我正在使用jqwidgets。在那些小部件中,我使用的是径向规。对于该径向规,我想提供径向背景色。我有一个类似这样的代码,用于在径向量规中更改背景颜色。

$('#gauge').jqxGauge({ style: { fill: '#cccccc', stroke: '#cccccc' }});


在上面的代码中,我尝试了类似的方法,

$('#gauge').jqxGauge({ style: { fill: 'linear-gradient(to top, #000 19%, #000 41%, #232323 49%, #fff)', stroke: 'linear-gradient(to top, #000 19%, #000 41%, #232323 49%, #fff)' }});


但这是行不通的。请帮我。

谢谢。

最佳答案

我认为CSS渐变不会随着SVG填充一起起作用。

因此,您需要在嵌入到页面中的SVG中定义渐变。然后,您可以参考它们作为您的量规。

因此,例如,填充1的等效SVG梯度定义为:

<svg width="0" height="0">
    <defs>
        <linearGradient id="gaugefill" x1="0" y1="1" x2="0" y2="0">
            <stop offset="19%" stop-color="#000"/>
            <stop offset="41%" stop-color="#000"/>
            <stop offset="49%" stop-color="#232323"/>
            <stop offset="100%" stop-color="#fff"/>
        </linearGradient>
    </defs>
</svg>


将此放在您页面的某个位置。然后,您应该可以通过以下方法将其应用于您的仪表:

$('#gauge').jqxGauge({ style: { fill: 'url(#gaugefill)', stroke: '#ccccc` }});


我把中风留给你做。

PS。免责声明:我没有使用过这些小部件,因此这只是一个有根据的猜测。

关于css - jqwidgets径向量规样式背景,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32968020/

10-11 12:39