UIWebview “动态”操作 SVG
我想知道如何操作已加载到 UIWebview 中的 SVG 文件。目前我正在将 SVG 文件加载到 HTML 文件中，然后将其加载到 UIWebview 中。我认为您会使用 Javascript 来执行此操作，但不确定具体是如何进行的。理想情况下，我希望能够在 iPad 应用程序中即时操作 SVG。我知道您可以将代码“注入”到 UIWebview 中，但我的尝试没有成功。清澈如泥？好吧，也许一些代码会有所帮助。
以下是我如何将 html 文件加载到视图控制器 .m 文件内的 UIWebview 中：
- (void)viewDidLoad
{
[super viewDidLoad];
NSString* path = [[NSBundle mainBundle] pathForResource:@"SVG" ofType:@"html"];
NSString* content = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
webView = [UIWebView new];
webView.frame = CGRectMake(0, 0, 1024, 768);
webView.dataDetectorTypes = UIDataDetectorTypeAll;
webView.userInteractionEnabled = YES;
[webView loadHTMLString:content baseURL:[[NSBundle mainBundle] bundleURL]];
[self.view addSubview:webView];
[webView release];
}
文件内的代码：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SVG</title>
</head>
<body>
<object id="circle" data="Circle.svg" width="250" height="250" type="image/svg+xml"/>
</body>
</html>
...最后这是 SVG 文件内的代码：
<svg xmlns="http://www.w3.org/2000/svg">
<circle id="redcircle" cx="200" cy="50" r="50" fill="red" />
</svg>
这是加载到 UIWebview 中的html UIWebview 中一个漂亮的红色小圆圈。现在我希望能够在视图控制器 .m 文件中快速操作圆圈。例如，当用户触摸iPad屏幕时，将填充颜色属性更改为绿色。这可能吗？
我希望这一切都有道理。有点复杂。但最终我想做的是在 HTML 框架中使用 SVG 动态创建图形并将其显示在 UIWebview 中。
任何帮助将不胜感激。谢谢。
I would like to know how to manipulate SVG files that I have loaded into a UIWebview. Currently I am loading an SVG file into an HTML file and then loading that into a UIWebview. I presume that you would use Javascript to do this but am not sure how the go about it exactly. Ideally I would like to be able to manipulate the SVG on the fly in an iPad app. I am aware that you can 'inject' code into the UIWebview but have had no success with my attempts. Clear as mud? Well perhaps a bit of code will help.
Here is how I load the html file into the UIWebview inside the view controller .m file:
- (void)viewDidLoad
{
[super viewDidLoad];
NSString* path = [[NSBundle mainBundle] pathForResource:@"SVG" ofType:@"html"];
NSString* content = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
webView = [UIWebView new];
webView.frame = CGRectMake(0, 0, 1024, 768);
webView.dataDetectorTypes = UIDataDetectorTypeAll;
webView.userInteractionEnabled = YES;
[webView loadHTMLString:content baseURL:[[NSBundle mainBundle] bundleURL]];
[self.view addSubview:webView];
[webView release];
}
Here is the code inside the html file that is loaded into the UIWebview:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SVG</title>
</head>
<body>
<object id="circle" data="Circle.svg" width="250" height="250" type="image/svg+xml"/>
</body>
</html>
...and finally here is the code inside the SVG file:
<svg xmlns="http://www.w3.org/2000/svg">
<circle id="redcircle" cx="200" cy="50" r="50" fill="red" />
</svg>
Which creates a nice little red circle in the UIWebview. Now I would like to be able to manipulate the circle on the fly back in the view controller .m file. For example when the user touches the iPad screen, change the fill color attribute to green. Is this even possible?
I hope this all makes sense. It's a bit convoluted. But ultimately what I am trying to do is create graphics on the fly with SVG in an HTML framework and display it in a UIWebview.
Any help would be appreciated. Thanks.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您可以在页面首次加载后的任何时候将其传递给 webView 上的 stringByEvaluatingJavaScriptFromString 来执行任意 Javascript - 就像响应触摸事件一样。
因此，如果查找 SVG 对象并更改颜色的 Javascript 看起来像这样（YMMV，还没有实际测试过这一点）：
您可以使用以下命令执行它：
You can execute arbitrary Javascript by passing it to stringByEvaluatingJavaScriptFromString on the webView at any point after the page has first loaded - like in response to a touch event.
So if the Javascript to find the SVG object and change the color looks something like (YMMV, haven't actually tested this):
You can execute it with: