[英]Load a swift variable in HTML page
我正在開發一個快速的應用程序。 在其中一種視圖中,我正在使用圖表的amcharts
。 圖表應使用應從ViewController
加載的動態值。 在這種情況下,在我的html文件中,我使用了var數據,它是一個JSON對象。 JSON將根據輸入不斷變化。 我想將此data
變量從Viewcontroller.swift
文件傳遞到html
。 我怎么做 ?? 是這樣還是其他更好的方式?
共享ViewController和html代碼。
ViewController.swift
import UIKit
class PyramidChartView: UIViewController,UIWebViewDelegate{
@IBOutlet weak var webView: UIWebView!
override func viewDidLoad() {
super.viewDidLoad()
let path1 = NSBundle.mainBundle().pathForResource("amcharts", ofType: "js")
do {
let htmlFile1 = try NSString(contentsOfFile: path1!, encoding: NSUTF8StringEncoding)
webView.stringByEvaluatingJavaScriptFromString(htmlFile1 as String)
}
catch {
}
let path2 = NSBundle.mainBundle().pathForResource("funnel", ofType: "js")
do {
let htmlFile2 = try NSString(contentsOfFile: path2!, encoding: NSUTF8StringEncoding)
webView.stringByEvaluatingJavaScriptFromString(htmlFile2 as String)
}
catch {
}
let path = NSBundle.mainBundle().pathForResource("pyramid", ofType: "html")
do {
let pyramidHtmlFile = try NSString(contentsOfFile: path!, encoding: NSUTF8StringEncoding)
webView.loadHTMLString(pyramidHtmlFile as String, baseURL: nil)
}
catch {
}
}
override func viewWillAppear(animated: Bool) {
webView.delegate = self
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
pyramid.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>amCharts examples</title>
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="document.json"></script>
<script>
var chart;
var data = [
{
"title": "Ideas Implemented",
"value": 200
},
{
"title": "Ideas Under Review",
"value": 193
},
{
"title": "Ideas Rejected",
"value": 96
},
{
"title": "Ideas Approved",
"value": 72
},
{
"title": "Ideas Under Approval",
"value": 65
}
];
var legendData = {
"enabled": true,
"align": "left",
"autoMargins": false,
"autoMargins": true,
"forceWidth": false,
"equalWidths": false,
"left": 100,
"labelWidth": 0,
"maxColumns": 4,
"switchable": false,
"valueWidth": 50
}
AmCharts.ready(function () {
chart = new AmCharts.AmFunnelChart();
chart.rotate = false;
chart.align= "right";
chart.labelText="[[value]]",
chart.balloonText="<b>[[value]]</b>",
chart.balloon.fixedPosition = true;
chart.baseWidth="80%";
chart.height="100%";
chart.marginRight = 50;
chart.marginLeft = 5;
chart.fontSize = 8;
chart.labelEnabled = "false";
chart.titleField = "title";
chart.valueField = "value";
chart.startX = -500;
chart.dataProvider = data;
chart.depth3D = 100;
chart.angle = 30;
chart.outlineAlpha = 1;
chart.outlineThickness = 2;
chart.outlineColor = "#FFFFFF";
var legend = new AmCharts.AmLegend();
legend = new AmCharts.AmLegend();
legend.position = "bottom";
legend.fontSize = "10px";
legend.align = "left";
legend.markerType = "circle";
legend.valueText = "";
legend.markerSize = 7;
legend.marginLeft = 0;
legend.fontSize = 10;
legend.horizontalGap = 5;
legend.spacing = 5;
legend.verticalGap = 5;
legend.borderAlpha = 0.5;
legend.markerLabelGap = 5;
chart.addLegend(legend);
chart.write("chartdiv");
});
</script>
<style>
#chartdiv
{
position: relative;
width: 320px;
height: 400px;
}
#secondDiv{
height: 500px !important;
overflow: auto;
position: relative;
align: center;
markerSize: 2px;
maxColumns: 4;
}
</style>
</head>
<body>
<div id="chartdiv"></div>
</body>
</html>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.