2013-05-02 4 views
5

Ich bin völlig neu bei HighCharts und ich verwiesen Beispiel http://blog.li-labs.com/developing-ios-apps-with-custom-charting/ und versuchte das gleiche, aber auf iPad Simulator bekomme ich einen leeren Bildschirm.Wie Sie Highcharts auf UIWebView in iOS hinzufügen?

Ich habe Fragen auf Stack-Overflow verwiesen, aber es funktioniert immer noch nicht. Kann mir jemand sagen, wo ich falsch liege.

EDIT: Code in meiner HTML-Datei:

<!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> 

How to add and use the Javascript libraries in XCode

Here is a simple view of how I handle the code and data within XCode.

  1. Download the Javascript reporting package from your preferd chart site. In my case: http://www.highcharts.com/download

  2. Add or import the files into XCode resources. (I suggest creating a group called JS).

  3. When adding a resource to XCode it will generally be marked as being needed to be compiled. Ensure that the files are not listed as being “Compiled”. The easiest way is to simply drag the files from Targets -> Your Project Name -> Compiled Sources into Targets -> Your Project Name -> Copy Bundle Resources.

  4. Create a test html file or simply import one from your HighChart (or any other javascript chart library) examples folder. In my case I name it hcpie.html

  5. Ensure that any file references in the tags do not recurse or move into any folder (even if they are in one in your project). e.g.

RIGHT =

WRONG =

  1. Create a UIWebView within Interface Designer and link it to your view (in my case I named it chart1). e.g.

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

@end

  1. Simply reference the HTML example file when loading.

    • (void)viewDidLoad {

NSString *pathOfFile = [[NSBundle mainBundle] pathForResource:@”hcpie” ofType:@”html”]; NSString *htmlText = [NSString stringWithContentsOfFile:pathOfFile encoding:NSUTF8StringEncoding error:nil];

NSURL *baseURL = [NSURL fileURLWithPath:pathOfFile];

[chart1 loadHTMLString: htmlText baseURL:baseURL];

[super viewDidLoad];

}

+0

Highcharts hat seinen iOS-Wrapper. – Raptor

Antwort

6

Schritte: -

1) Zunächst nur eine HTML-Datei Creat und das nötige Code tun oder für Testversion kann von HTML-Code kopieren Beispiele, die Sie aus Paket http://www.highcharts.com/download

erhalten 2) Stellen Sie sicher, dass die Skripts in HTML richtige .JS-Verknüpfungen haben für zB: - <script src="http://code.highcharts.com/highcharts.js"></script>

oder

, wenn Sie wollen, es zu lokal können Sie <script src="highcharts.js"></script> Aber stellen Sie sicher schreiben, dass die Js-Dateien gibt es im Anwendungsordner.

3) NSString *htmlFile = [[NSBundle mainBundle] pathForResource:@"graph" ofType:@"html"]; 
    NSString* htmlString = [NSString stringWithContentsOfFile:htmlFile encoding:NSUTF8StringEncoding error:nil]; 
    [obj loadHTMLString:htmlString baseURL:nil]; // Webview *obj; 

Ich hoffe, dies hilft Ihnen. In meinem Fall funktioniert es.

+0

Ich habe versucht, wie Sie erwähnt haben. Trotzdem funktioniert es nicht. Überprüfen Sie nur meine HTML-Datei als auch. Ich habe die Frage bearbeitet.Still – parilogic

+2

schreiben im Körperteil anstelle von LittleIDev

+0

Ich führe deinen HTML-Code durch Änderung wie oben beschrieben aus. Und es funktioniert. Bitte lassen Sie mich wissen, funktioniert es für Sie? – LittleIDev

1

Ich habe versucht, die Vorschläge in diesem Beitrag und konnte nicht die HighChart laden.

Das Problem endete als "loadHTMLString" -Aufruf. Das Übergeben von nil für die baseURL war falsch. Hier ist, was für mich gearbeitet - ich brauchte die tatsächliche baseURL weitergeben müssen:

NSString *htmlFile = [[NSBundle mainBundle] pathForResource:url ofType:@"html"]; 
NSString* htmlString = [NSString stringWithContentsOfFile:htmlFile encoding:NSUTF8StringEncoding error:nil]; 

NSURL *baseURL = [NSURL fileURLWithPath:htmlFile]; 

[webView loadHTMLString:htmlString baseURL:baseURL]; 
+0

Ich habe das auch versucht, aber für mich öffnet es perfekt in Safari in Mac, aber nicht im Simulator arbeiten. Irgendeine Hilfe. –

+0

'NSString * htmlFile = [[NSBundle mainBundle] PfadFürRessource: @" Zeile "vonTyp: @" htm "]; NSString * htmlString = [NSString stringWithContentsOfFile: htmlFile-Codierung: NSUTF8StringEncoding-Fehler: nil]; UIWebView * obj = [[UIWebView-Zuordnung] initWithFrame: CGRectMake (0, 100, self.contentView.frame.size.width, 650)]; obj.delegate = selbst; [self.contentView addSubview: obj]; NSURL * baseURL = [NSURL-DateiURLWithPath: htmlFile]; [obj loadHTMLString: htmlString baseURL: baseURL]; ' –

+0

@BalramTiwari meine Antwort funktioniert in der SIM, auf realen Geräten, etc. Vielleicht kopierst du nicht alle deine .js-Ressourcen auf das Gerät? Vielleicht möchten Sie Ihre Projektkonfiguration überprüfen, insbesondere den Abschnitt "Bundle-Ressourcen kopieren" auf der Registerkarte "Phasen erstellen" Ihres Projekts. – DiscDev

0

Nützliche Code für den Aufruf von .html in UIWebView.

-(void)viewDidLoad 
    { 
    NSString *pathOfFile = [[NSBundle mainBundle] pathForResource:@"chart" ofType:@"html"]; 

    NSString *htmlText =[NSString stringWithContentsOfFile:pathOfFile encoding:NSUTF8StringEncoding error:nil]; 

    NSURL *baseURL = [NSURL fileURLWithPath:pathOfFile]; 

    [UIWebView loadHTMLString: htmlText baseURL:baseURL]; 
    } 
Verwandte Themen