Jquery 条形图渐变背景不显示-高度图
我正在使用Highcharts.js-library在我的网站上创建一个条形图,我希望有一个渐变作为条形图的背景色(填充)。我在JSFIDLE做过,一切都很好。但是当我在我的网站上使用相同的代码时,它不起作用,我也不知道为什么 我的js代码如下:Jquery 条形图渐变背景不显示-高度图,jquery,html,css,svg,highcharts,Jquery,Html,Css,Svg,Highcharts,我正在使用Highcharts.js-library在我的网站上创建一个条形图,我希望有一个渐变作为条形图的背景色(填充)。我在JSFIDLE做过,一切都很好。但是当我在我的网站上使用相同的代码时,它不起作用,我也不知道为什么 我的js代码如下: $(function () { Highcharts.chart('container', { title: { text: '' }, xAxis: {
$(function () {
Highcharts.chart('container', {
title: {
text: ''
},
xAxis: {
categories: ['Driftsinntekter forrige år', 'Resultat før skatt forrige år', 'Egenkapital', 'Driftsresultat', 'Årsresultat']
},
defs: {
gradient0: {
tagName: 'linearGradient',
id: 'gradient-0',
x1: 0,
y1: 0,
x2: 0,
y2: 1,
children: [{
tagName: 'stop',
offset: 0
}, {
tagName: 'stop',
offset: 1
}]
}, glow: {
tagName: 'filter',
id: 'glow',
opacity: 0.5,
children: [{
tagName: 'feGaussianBlur',
result: 'coloredBlur',
stdDeviation: 1.5
}, {
tagName: 'feMerge',
children: [{
tagName: 'feMergeNode',
in: 'coloredBlur'
}, {
tagName: 'feMergeNode',
in: 'SourceGraphic'
}]
}]
}
},
series: [{
type: 'bar',
keys: ['y', 'selected'],
data: [
[29.9, false],
[71.5, false],
[106.4, false],
[129.2, false],
[144.0, false]
]
}]
});
});
我的CSS是这样的(它在一个单独的文件中):
是实时页面-如果您向下滚动到“Regnskap”部分,您将看到图表网格,但没有条形图。如果您使用web开发工具,您可以看到“Driftsinntekter forrigeår”上有一个条,但它只是没有显示出来
我将库和css文件包括在head
-标记中,如下所示:
<script src="http://code.highcharts.com/highcharts.js"></script>
<link rel="stylesheet" href="/resources/css/charts.css">
希望有人能帮忙。提前谢谢 现在开始工作了。我的问题是我在
head
-标记中包含了错误的Highcharts模式
我必须包括这个(样式模式):
填充和筛选的url中似乎存在问题:
fill:url(#gradient-0)代码>过滤器:url(#发光)代码>
<script src="http://code.highcharts.com/highcharts.js"></script>
<link rel="stylesheet" href="/resources/css/charts.css">
<script src="https://code.highcharts.com/js/highcharts.js"></script>