Highcharts Backgroundimage для гистограммы

Я хочу добавить фоновое изображение в гистограмму с помощью 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);
        }
    };    
})();

person alex    schedule 11.06.2012    source источник


Ответы (1)


У меня была похожая проблема: мой iPad не отображал градиентный фон.

В конце концов я решил это, поместив backgroundColor: null в свой JS и используя градиент CSS3 для идентификатора и объявив высоту DIV. Это, скорее всего, будет работать и с фоновым изображением.

person hcharge    schedule 20.06.2012
comment
да, я думаю, что так и должно быть, проверьте файлы CSS сетки - person Lakshitha Udara; 21.06.2012