我想使用 Highcharts 将背景图像添加到条形图中,并将其显示在 UIWebView
中。
到目前为止,我一直在使用这个小插件,它在最新的 Chrome 中运行良好。 但是,一旦我将其加载到 UIWebView 中,图像就不会显示。 我认为这与iOS可能无法解析图像文件的正确路径有关?
是否有另一种(更简单的)方法可以将背景图像添加到条形图中?
在我的 Highcharts 数据系列中
color: {
pattern: 'static/img/theimage.png',
width: 160,
height: 500
}
插件
/**
* Highcharts pattern fill plugin
*/
(function() {
var idCounter = 0,
base = Highcharts.Renderer.prototype.color;
Highcharts.Renderer.prototype.color = function(color, elem, prop) {
if (color && color.pattern && prop === 'fill') {
// SVG renderer
if (this.box.tagName == 'svg') {
var id = 'highcharts-pattern-'+ idCounter++;
var pattern = this.createElement('pattern')
.attr({
id: id,
patternUnits: 'userSpaceOnUse',
width: color.width,
height: color.height
})
.add(this.defs),
image = this.image(
color.pattern, 0, 0, color.width, color.height
)
.add(pattern);
return 'url(' + this.url + '#' + id + ')';
// VML renderer
} else {
var markup = ['<', prop, ' type="tile" src="', color.pattern, '" />'];
elem.appendChild(
document.createElement(this.prepVML(markup))
);
}
} else {
return base.apply(this, arguments);
}
};
})();
最佳答案
我也遇到了类似的问题,我的 iPad 没有显示渐变背景。
我最终解决了这个问题,在我的 JS 中添加了 backgroundColor: null ,并在 ID 上使用 CSS3 渐变并声明了 DIV 的高度。这很可能也适用于背景图像。
关于css - 条形图的 Highcharts 背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10982137/