如何在iOS中添加UIWebView的Highcharts？ [英] How to add Highcharts on UIWebView in iOS?
问题描述
我对HighCharts完全陌生，我推荐了 http：// blog。 li-labs.com/developing-ios-apps-with-custom-charting/ ，并尝试相同，但在iPad模拟器上我得到一个空白屏幕。
<我已经提到了堆栈溢出问题，但仍然无法正常工作。
任何人都可以告诉我哪里会出错。
编辑：我的HTML文件中的代码：
<！DOCTYPE HTML>
< html>
< head>
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8>
< title> Highcharts示例< / title>
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js><<<< ; /脚本>
< script type =text / javascript>
$（function（）{
//放大颜色
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
]
};
}）;
//生成图表
$（'＃container'）。highcharts（{
图表：{
plotBackgroundColor：null，
plotBorderWidth：null，
plotShadow：假
}，
标题：{
text：'在特定网站的浏览器市场份额，2010'
}，
工具提示：{
pointFormat： '{series.name}：< b> {point.percentage}％< / b>' ，
percentageDecimals：1
}，
plotOptions：{$ b $ pie：{
allowPointSelect：true，
cursor：'pointer'，
dataLabels：{
enabled：true，
color：'＃000000'，
connectorColor：'＃000000'，
formatter：function（）{
return'< ; b>'+ this.point.name +'< / b>：'+ this.percentage +'％';
}
}
}
}，
系列：[{
类型：'pie'，
名称：'浏览器共享'，
数据：[
['Firefox'，45.0]，
['IE'，26.8]，
{
名称：'Chrome'，
y ：12.8，
切片：true，
选中：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 / javascriptsrc =highcharts.js>< / script>
< script type =text / javascriptsrc =exporting.js>< / script>
< div id =containerstyle =min-width：400px; height：400px; margin：0 auto>< / div>
< / body>
< / html>
如何在XCode中添加和使用JavaScript库
以下是我如何处理XCode中的代码和数据的一个简单视图。
从您喜欢的图表网站下载Javascript报告软件包。在我的情况下： http://www.highcharts.com/download
将文件添加或导入XCode资源。 （我建议创建一个名为JS的组）。
向XCode添加资源时，它通常会被标记为需要编译。确保文件未被列为
为已编译。最简单的方法是简单地将文件从
目标 - >您的项目名称 - >编译源文件拖动到目标 - >您的
项目名称 - >复制包资源。
创建一个测试html文件或者从HighChart（或任何其他的javascript图表库）示例文件夹中导入一个。在我的情况下，我
将其命名为hcpie.html确保标记中的任何文件引用不会递归或移动到任何文件夹中（即使他们在你的项目中一个）。
eg
RIGHT =
WRONG =
- 在Interface Designer中创建一个UIWebView并将其链接到您的视图（在我的例子中，我将它命名为chart1）。例如
@interface FirstViewController：UIViewController {IBOutlet UIWebView
* chart1; }
@end
- （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];
}
p>
1）首先创建一个html文件并执行必要的代码或者试用可以从您从包中获取的示例中复制html代码 http://www.highcharts.com/download
2）确保脚本在html中应该有正确的.js链接
，例如： - < script src =http://code.highcharts.com/highcharts.js>< / script> / code>
或
如果您想本地捐赠，可以写< script src =highcharts.js>< / script> $ b但是确保.js文件存在于您的应用程序文件夹中。
3）NSString * htmlFile = [[NSBundle mainBundle] pathForResource：@graphofType：@html];
NSString * htmlString = [NSString stringWithContentsOfFile：htmlFile encoding：NSUTF8StringEncoding error：nil];
[obj loadHTMLString：htmlString baseURL：nil]; // Webview * obj;
希望这对您有所帮助。在我的情况下它的工作。
I am totally new to HighCharts and I referred example http://blog.li-labs.com/developing-ios-apps-with-custom-charting/ and tried same, but on iPad simulator I am getting a blank screen.
I have referred questions on stack-overflow, but still it is not working. Can anyone tell where am I going wrong.
EDIT : Code in My HTML file :
<!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.
Download the Javascript reporting package from your preferd chart site. In my case: http://www.highcharts.com/download
Add or import the files into XCode resources. (I suggest creating a group called JS).
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.
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
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 =
- 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
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];
}
Steps:-
1) First just creat one html file and do the needful code or for trial can copy html code from examples that you get from package http://www.highcharts.com/download
2) Make sure that the scripts in html should have proper .js links
for e.g:- <script src="http://code.highcharts.com/highcharts.js"></script>
or
if you want to give it locally you can write <script src="highcharts.js"></script>
But make sure that the .js files are there in your application folder.
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;
Hope this help you. In my case its working.
这篇关于如何在iOS中添加UIWebView的Highcharts？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
