使用Jquery Mobile在移动设备上显示图表(d3js)

时间:2022-11-20 17:09:12

I am using Jquery Mobile to create a HTML5 Mobile Application which would be able to display charts which are created using d3js. These charts would be created on client side, however the data would be retrieved via server. The JQM pages are static HTML pages which would request data from server and create impromptu charts. However, I am having difficulty in understanding JQM ajax/hash mapping. When I redirect a request to another page it is unable to run javascript on that page. Hence I have used window.location.href = a.html to change pages instead of $.mobile.changePage(a.html).

我正在使用Jquery Mobile创建一个HTML5移动应用程序,它可以显示使用d3js创建的图表。这些图表将在客户端创建,但数据将通过服务器检索。 JQM页面是静态HTML页面,可以从服务器请求数据并创建即兴图表。但是,我很难理解JQM ajax / hash映射。当我将请求重定向到另一个页面时,它无法在该页面上运行javascript。因此我使用window.location.href = a.html来更改页面而不是$ .mobile.changePage(a.html)。

Each data page has an id so that it can be cached, how can I then create a new page link and feed it data.

每个数据页都有一个id,以便可以缓存,然后我如何创建新的页面链接并提供数据。

I have 2 files : index.html which contains list of data which a user can choose to see and then another file which is chart.html which contains information on how to create a chart using Javascript Ajax to fetch data from server. How is this possible using JQM.

我有2个文件:index.html包含用户可以选择查看的数据列表,然后是另一个文件,它是chart.html,其中包含有关如何使用Javascript Ajax从服务器获取数据创建图表的信息。如何使用JQM实现这一点。

1 个解决方案

#1


1  

I hope you have already run through JQM Page Links and JQM Page Scripting

我希望您已经完成了JQM Page Links和JQM Page Scripting

Since JQM fetches all subsequent pages via (Hi)Ajax and inserts their <body> tag into the current DOM; the <script>s defined on your subsequent pages are not executed.

由于JQM通过(Hi)Ajax获取所有后续页面并将其标记插入到当前DOM中;不会执行后续页面上定义的

You will need to include all your scripts in the <head> of your first page - index.html

您需要在第一页的中包含所有脚本 - index.html

For passing parameters between pages; you could simply use the plugins mentioned at the bottom of the JQM Page Scripting page

用于在页面之间传递参数;您可以简单地使用JQM页面脚本页面底部提到的插件

Although I personally just use the $.data() function :D

虽然我个人只是使​​用$ .data()函数:D

#1


1  

I hope you have already run through JQM Page Links and JQM Page Scripting

我希望您已经完成了JQM Page Links和JQM Page Scripting

Since JQM fetches all subsequent pages via (Hi)Ajax and inserts their <body> tag into the current DOM; the <script>s defined on your subsequent pages are not executed.

由于JQM通过(Hi)Ajax获取所有后续页面并将其标记插入到当前DOM中;不会执行后续页面上定义的

You will need to include all your scripts in the <head> of your first page - index.html

您需要在第一页的中包含所有脚本 - index.html

For passing parameters between pages; you could simply use the plugins mentioned at the bottom of the JQM Page Scripting page

用于在页面之间传递参数;您可以简单地使用JQM页面脚本页面底部提到的插件

Although I personally just use the $.data() function :D

虽然我个人只是使​​用$ .data()函数:D