zhouxuxuxiu 发表于 2016-1-13 16:52:54

支持响应式设计的DevExtreme Web UI开发框架 | 附在线演示

DevExtreme Web为触摸设备和传统桌面构建响应式的Web应用程序,全程采用HTML5,CSS和JavaScript编写。主要提供的UI组件有Data Grid、Pivot Grid、图表数据可视化、Form Layout、日程日历、多功能组件。下面通过几个示例来感受下它的强大!你也可以下载Universal安装包或者到 DevExpress中文网 查看更多示例和教程哦!http://7jpreg.com1.z0.glb.clouddn.com/devextreme-golfclub.jpg
Golf Club一个用于在线预订高尔夫课程的系统。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/Scheduler.png
Schedulerhttp://js.devexpress.com/Content/Images/DemosPage/widgets/DateBox.png
DateBoxhttp://js.devexpress.com/Content/Images/DemosPage/widgets/Popup.png
Popuphttp://js.devexpress.com/Content/Images/DemosPage/widgets/SelectBox.png
SelectBox
| 在线Demo

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-stockmarket.jpg
Stock Market金融监测仪表盘。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/DataGrid.png
DataGrid
http://js.devexpress.com/Content/Images/DemosPage/widgets/PivotGrid.png
PivotGrid
http://js.devexpress.com/Content/Images/DemosPage/widgets/Chart.png
Chart
http://js.devexpress.com/Content/Images/DemosPage/widgets/Sparkline.png
Sparkline

| 在线Demo

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-devav.jpg
DevAV仿Office的在线web应用。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/DataGrid.png
DataGrid

http://js.devexpress.com/Content/Images/DemosPage/widgets/Gallery.png
Gallery

http://js.devexpress.com/Content/Images/DemosPage/widgets/FileUploader.png
FileUploader

http://js.devexpress.com/Content/Images/DemosPage/widgets/Chart.png
Chart


| 在线Demo

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-salesviewer.jpg
Sales Viewer模拟实时数据分析的数据可视化web应用。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/Chart.png
Chart


http://js.devexpress.com/Content/Images/DemosPage/widgets/DataGrid.png
DataGrid
http://js.devexpress.com/Content/Images/DemosPage/widgets/Sparkline.png
Sparkline


http://js.devexpress.com/Content/Images/DemosPage/widgets/RangeSelector.png
RangeSelector


http://js.devexpress.com/Content/Images/DemosPage/widgets/Menu.png
Menu
http://js.devexpress.com/Content/Images/DemosPage/widgets/Popup.png
Popup

| 在线Demo

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-salesdashboard.jpg
Sales Dashboard专为触摸设备做了优化的数据可视化web应用。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/Chart.png
Chart


http://js.devexpress.com/Content/Images/DemosPage/widgets/Gauge.png
Gauge

http://js.devexpress.com/Content/Images/DemosPage/widgets/DataGrid.png
DataGrid



http://js.devexpress.com/Content/Images/DemosPage/widgets/Sparkline.png
Sparkline



http://js.devexpress.com/Content/Images/DemosPage/widgets/VectorMap.png
VectorMap

http://js.devexpress.com/Content/Images/DemosPage/widgets/RangeSelector.png
RangeSelector


扫描后在移动设备上在线体验:http://api.qrserver.com/v1/create-qr-code/?size=110x110&data=http%3a%2f%2fjs.devexpress.com%2fDemos%2fSalesDashboard%2f

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-dxhotels.jpg
DXHotels一个在线酒店预订系统。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/Accordion.png
Accordion


http://js.devexpress.com/Content/Images/DemosPage/widgets/Gallery.png
Gallery

http://js.devexpress.com/Content/Images/DemosPage/widgets/DateBox.png
DateBox


http://js.devexpress.com/Content/Images/DemosPage/widgets/Popup.png
Popup



| 在线Demo

http://7jpreg.com1.z0.glb.clouddn.com/devextreme-servermonitor.jpg
WebServer Monitor一个监测服务器状况的web系统。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/Chart.png
Chart



http://js.devexpress.com/Content/Images/DemosPage/widgets/RangeSelector.png
RangeSelector



| 在线Demo





http://7jpreg.com1.z0.glb.clouddn.com/devextreme-widgetsgallery.jpg
Widgets Gallery一个用了大量DevExtreme UI 组件的应用集合。用到的HTML5组件:
http://js.devexpress.com/Content/Images/DemosPage/widgets/DataGrid.png
DataGrid
http://js.devexpress.com/Content/Images/DemosPage/widgets/PivotGrid.png
PivotGrid
http://js.devexpress.com/Content/Images/DemosPage/widgets/Gauge.png
Gauge
http://js.devexpress.com/Content/Images/DemosPage/widgets/Bullet.png
Bullet

http://js.devexpress.com/Content/Images/DemosPage/widgets/Panorama.png
Panorama
http://js.devexpress.com/Content/Images/DemosPage/widgets/TabPanel.png
TabPanel
http://js.devexpress.com/Content/Images/DemosPage/widgets/TreeView.png
TreeView
http://js.devexpress.com/Content/Images/DemosPage/widgets/Slideout.png
Slideout

http://js.devexpress.com/Content/Images/DemosPage/widgets/RangeSlider.png
RangeSlider
http://js.devexpress.com/Content/Images/DemosPage/widgets/ColorBox.png
ColorBox
http://js.devexpress.com/Content/Images/DemosPage/widgets/TileView.png
TileView
http://js.devexpress.com/Content/Images/DemosPage/widgets/FileUploader.png
FileUploader















2016移动图表巅峰论坛


页: [1]
查看完整版本: 支持响应式设计的DevExtreme Web UI开发框架 | 附在线演示