2012-06-11 216 views
2

我想使用Highcharts将条形图添加到背景图像中,并将其显示在UIWebView中。Highcharts Backgroundimage条形图

到目前为止,我一直在使用这个小插件,它在最新的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); 
     } 
    };  
})(); 

回答

2

我有一个类似的问题在我的iPad并没有出现在我的渐变背景。

我最后解决了这个问题,在我的JS中使用backgroundColor:null,并在ID上使用CSS3渐变并声明了DIV的高度。这最有可能与背景图片一起工作。

+0

是的我认为它应该检查网格CSS文件 –