1

我正在使用 Titanium Studio 中的一些附加插件为 android 设备创建一个饼图,所以这是我的 app.js

var earn=[' ',' '];
var textfield1 = Ti.UI.createTextField({
    value:earn[0],
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD, 
});
win.add(textfield1);
var textfield2 = Ti.UI.createTextField({
    value:earn[1],
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD, 
});
win.add(textfield2);
var webview = Titanium.UI.createWebView({
 url: 'chart.htm'
});
win.add(webview);

这是我的chart.htm

<script type="text/javascript" src="wz_jsgraphics.js"></script>
<script type="text/javascript" src="pie.js"></script>

<div id="pieCanvas" style="overflow: auto; position:relative;height:350px;width:380px;"></div>

<script type="text/javascript">
var p = new pie();
p.add("Jan",100);
p.add("Feb",200);
p.render("pieCanvas", "Pie Graph")

</script>

如果我要为我的“Jan”使用数组“earn[0]”,我如何从 app.js 文件中调用数组?当我将值“100”更改为“earn[0]”时,饼图将不会显示。帮助?

4

2 回答 2

1

试试这个:

应用程序.js

var earn = [100, 200];

var textfield1 = Ti.UI.createTextField({
    value: earn[0],
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD,
});
win.add(textfield1);

var textfield2 = Ti.UI.createTextField({
    value: earn[1],
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD,
});
win.add(textfield2);

var webview = Titanium.UI.createWebView({
    url: 'chart.htm'
});
win.add(webview);

webView.addEventListener('load', function (e) {
    webview.evalJS('createPie(earn);');
});

图表.htm

<script type="text/javascript" src="wz_jsgraphics.js"></script>
<script type="text/javascript" src="pie.js"></script>

<div id="pieCanvas" style="overflow: auto; position:relative;height:350px;width:380px;"></div>

<script type="text/javascript">
function createPie(arr) {
    var p = new pie();
    p.add("Jan", arr[0]);
    p.add("Feb", arr[1]);
    p.render("pieCanvas", "Pie Graph");
}
</script>

查看此链接以获得更多帮助:http: //developer.appcelerator.com/question/73121/passing-variable-from-titanium-js-class-to-html-script-

于 2013-04-24T11:03:08.690 回答
0

当您更改文本字段时,您的earn数组不会动态更新,如果这是您所要求的。您必须监听 texfields 何时触发更改事件,捕获该事件并获取新值,现在您可以更新饼图。

要做到这一点,以便在有人更改 texfields 中的值时更新图表,您需要执行以下操作:

/* app.js */
var textfield1 = Ti.UI.createTextField({
    value:' ',
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD, 
});
/* This is the important part */
textfield1.addEventListener('change', function(e) {
    var earn = [textfield1.value, textfield2.value];
    webview.evalJS('createPie(' + JSON.stringify(earn) +');');
});

var textfield2 = Ti.UI.createTextField({
    value:' ',
    keyboardType: Titanium.UI.KEYBOARD_NUMBER_PAD, 
});
/* This is the important part */
textfield2.addEventListener('change', function(e) {
    var earn = [textfield1.value, textfield2.value];
    // DO this
    webview.evalJS('createPie(' + JSON.stringify(earn) +');');
});

var webview = Titanium.UI.createWebView({
 url: 'chart.htm'
});

// Add views
win.add(textfield1);
win.add(textfield2);
win.add(webview);

在您的 HTML 中(我取自 Mohit 精心制作的 HTML):

<script type="text/javascript" src="wz_jsgraphics.js"></script>
<script type="text/javascript" src="pie.js"></script>

<div id="pieCanvas" style="overflow: auto; position:relative;height:350px;width:380px;"></div>

<script type="text/javascript">
function createPie(arr) {
    var earn = eval(arr); // convert from JSON string to JS, alternatively use JSON.parse
    var p = new pie();
    p.add("Jan", earn[0]);
    p.add("Feb", earn[1]);
    p.render("pieCanvas", "Pie Graph");
}
</script>

现在你有了骨头,你可能不得不弄乱 createPie() 函数,查看 Mohit 发送的链接,那里有详细的说明。

于 2013-04-24T14:18:22.370 回答