您可以在Appcelerator市场中找到的ti.charts模块仅适用于iOS。 我想要一个轻量级的解决方案，该解决方案可以在Android和iOS上运行，并提供最常见的图表，条形图，折线图，饼图等。实现此目的最简单的方法是，我在Web视图中使用图表Javascript库。
我的资格：
- 快速
- 没有jQuery依赖
- 初画动画
- 良好的默认样式
现在有很多javascript图表库，但没有很多可以满足上述所有条件。 大量依赖jQuery。 我之前弄乱过一些依赖jQuery的东西，当数据点太多时，它们的渲染时间通常很慢，而太多的数据点意味着很多。 webView是您可以使用的最耗资源的组件之一，因此可以做得越多越好，以保持简单。
在经过数周的搜索后，第二天我偶然发现了一个完全符合我想要的内容的新图书馆。 ChartJS。 这是将图表实施到webView中的方法，同时还传递自定义数据点。
除了自动生成的文件外，该项目中还有3个文件
app.js
来源/chart.html
source / chart.wvjs –此文件包含Chart.js中的javascript，位于此处
app.js var win = Titanium.UI.createWindow（{backgroundColor：'#fff'}）; var chartView = Ti.UI.createWebView（{高度：200，宽度：320，左侧：0，顶部：0，showScrollbars：false，touchEnabled：false，url：'/ source / chart.html'}）; win.add（chartView）; var button = Ti.UI.createButton（{title：'Regenerate'，top：220，}）; win.add（按钮）; button.addEventListener（'click'，function（）{var options = {}; options.data = new Array（Math.floor（Math.random（）* 1001），Math.floor（Math.random（）* 1001） ，Math.floor（Math.random（）* 1001），Math.floor（Math.random（）* 1001），Math.floor（Math.random（）* 1001））; Ti.App.fireEvent（'renderChart' ，options）;}）; win.open（）;
首先，我们创建窗口，Web视图和一个按钮以使用新数据重绘图形。 单击按钮后，我们将创建一个名为options的对象。 生成1到1000之间的5个随机数，并将其分配给options.data数组。
然后使用2个参数调用Ti.App.fireEvent。 renderChart 是传递的第一项，这意味着在代码中的某个地方，我们需要具有相同名称的对应事件监听器。 第二项是选项对象。 现在，您可能会问自己为什么我没有直接传递数组……它将无法工作，应该有一个对象。 通过将数组附加到对象，我们可以将该数据传递到将位于html文件中的事件侦听器。
为了使webView与Titanium本身进行通信，必须使用这样的事件处理程序。 Titanium和webView需要一种方法来打开一条通讯线，而这正是这么做的。
views / chart.html
图表库的默认文件扩展名是.js。 我发现使用.js扩展名时可能与Titanium有冲突，因此请确保重命名从WebView调用的javascript文件。 我的偏好是.wvjs，但您实际上可以使用任何东西。
您可以看到我们在renderListener的 eventListener中 包含了图表Javascript代码。 当从我们的Titanium代码执行fireEvent时，将执行此操作。 画布的宽度和高度是通过JavaScript指定的，而不是将属性添加到HTML，这是为了在我们使用新数据重新生成新图表时清除画布中存在的内容。
