Como adicionar Highcharts no UIWebView no iOS?

Question

May 02, 2013, 09:11 AM

Como adicionar Highcharts no UIWebView no iOS?

Eu sou totalmente novo para HighCharts e me referi exemplohttp://blog.li-labs.com/developing-ios-apps-with-custom-charting/ e tentei mesmo, mas no simulador do iPad estou recebendo uma tela em branco.

Eu tenho referido perguntas sobre estouro de pilha, mas ainda não está funcionando. Alguém pode dizer onde estou indo errado.

EDIT: código no meu arquivo HTML:

 <!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript">
$(function () {

        // Radialize the colors
        Highcharts.getOptions().colors = Highcharts.map(Highcharts.getOptions().colors, function(color) {
            return {
                radialGradient: { cx: 0.5, cy: 0.3, r: 0.7 },
                stops: [
                    [0, color],
                    [1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
                ]
            };
        });

        // Build the chart
        $('#container').highcharts({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'Browser market shares at a specific website, 2010'
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage}%</b>',
                percentageDecimals: 1
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        color: '#000000',
                        connectorColor: '#000000',
                        formatter: function() {
                            return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                        }
                    }
                }
            },
            series: [{
                type: 'pie',
                name: 'Browser share',
                data: [
                    ['Firefox',   45.0],
                    ['IE',       26.8],
                    {
                        name: 'Chrome',
                        y: 12.8,
                        sliced: true,
                        selected: true
                    },
                    ['Safari',    8.5],
                    ['Opera',     6.2],
                    ['Others',   0.7]
                ]
            }]
        });
    });


        </script>
    </head>
    <body>
<!--<script src="../../js/highcharts.js"></script>-->
<!--<script src="../../js/modules/exporting.js"></script>-->

<script type="text/javascript" src="highcharts.js"></script>
<script type="text/javascript" src="exporting.js"></script>

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
    </body>
</html>

Como adicionar e usar as bibliotecas Javascript no XCode

Aqui está uma visão simples de como eu lido o código e os dados no XCode.

Faça o download do pacote de relatórios Javascript do seu site de gráficos preferencial. No meu caso:http://www.highcharts.com/download

Adicione ou importe os arquivos para os recursos do XCode. (Sugiro criar um grupo chamado JS).

Ao adicionar um recurso ao XCode, ele geralmente será marcado como necessário para ser compilado. Assegure-se de que os arquivos não estejam listados como sendo "Compilados". A maneira mais fácil é simplesmente arrastar os arquivos de Destinos -> Nome do Projeto -> Fontes Compiladas em Destinos -> Nome do Projeto -> Copiar Recursos do Pacote.

Crie um arquivo html de teste ou simplesmente importe um de sua pasta de exemplos HighChart (ou qualquer outra biblioteca de gráficos de javascript). No meu caso eu chamo de hcpie.html

Certifique-se de que quaisquer referências de arquivo nas tags não sejam recursivas ou movidas para nenhuma pasta (mesmo que estejam em uma em seu projeto). por exemplo.

DIREITA =

ERRADO =

Crie um UIWebView dentro do Designer de Interface e vincule-o à sua exibição (no meu caso, denominei chart1). por exemplo.

@interface FirstViewController: UIViewController {IBOutlet UIWebView * chart1; }

@fim

Simplesmente faça referência ao arquivo de exemplo HTML ao carregar.

(void) viewDidLoad {

NSString * pathOfFile = [[NSBundle mainBundle] pathForResource: @ ”hcpie” de tipo: @ ”html”]; NSString * htmlText = [NSString stringWithContentsOfFile: codificação pathOfFile: erro NSUTF8StringEncoding: nil];

NSURL * baseURL = [NSURL fileURLWithPath: pathOfFile];

[chart1 loadHTMLString: htmlText baseURL: baseURL];

[super viewDidLoad];

}