Foxtable(狐表)用户栏目专家坐堂 → [分享]百度ECharts使用示例


  共有26724人关注过本帖树形打印复制链接

主题:[分享]百度ECharts使用示例

帅哥,在线噢!
有点蓝
  1楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:106242 积分:540333 威望:0 精华:9 注册:2015/6/24 9:21:00
[分享]百度ECharts使用示例  发帖心情 Post By:2017/7/10 17:22:00 [显示全部帖子]

最近有好几个人咨询能否使用百度ECharts,这里做了个例子,使用上其实不复杂,就是要搞懂官方给的用法。

之前有个miniui的例子:http://www.foxtable.com/bbs/dispbbs.asp?BoardID=2&ID=103145&skin=0,用法其实都一样,结合狐表的weui,可以很快速的使用一些第三方的框架组件。

同样,lib.zip解压后放到路径(d:\web\lib\),路径示例
D:\web\lib\map.js
D:\web\lib\data1.txt
D:\web\lib\data2.txt
 下载信息  [文件大小:   下载次数: ]
点击浏览该文件:lib.zip


HttpRequest事件代码

Dim fl As String = "d:\web\" & e.path
If filesys.FileExists(fl)
    Dim idx As Integer = fl.LastIndexOf(".")
    Dim ext As String  = fl.SubString(idx)
    Select Case ext
        Case ".jpg",".gif",".png",".bmp",".wmf",".js",".css" ,".html",".htm",".zip",".rar",".txt"
            e.WriteFile(fl)
            Return '这里必须返回
    End Select
End If
Dim wb As New WeUI
Select Case e.Path
    Case "test.htm"
        wb.AppendHTML("<script src='http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js'></script>",True)
        wb.AppendHTML("<script src='http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js'></script>",True)
        wb.AppendHTML("<script src='http://echarts.baidu.com/gallery/vendors/echarts/echarts-all-3.js'></script>",True)
        wb.AppendHTML("<script src='http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js'></script>",True)
        
        With wb.AddArticle("","ar1")
            .AddTitle("h1","ECharts测试")
            .AddTitle("h2","1. 条形图")
            .AddContent("<div id=""main1"" style=""width: 600px;height:400px;""></div>")
            .AddTitle("h2","2. 地图")
            .AddContent("<div id=""main2"" style=""width: 600px;height:400px;""></div>")
        End With
        wb.AppendHTML("<script src='./lib/map.js'></script>")
        
        e.WriteString(wb.Build)
    Case "getdata.htm" '获取数据,这里通过文件返回json数据,实际应用可以结合数据库查询和JObject返回json数据
        Dim json As String
        If e.GetValues("type") = "1" Then
            json  = FileSys.ReadAllText("d:\web\lib\data1.txt")
        Else
            json  = FileSys.ReadAllText("d:\web\lib\data2.txt")
        End If
        e.WriteString(json)
End Select
 下载信息  [文件大小:   下载次数: ]
点击浏览该文件:管理项目11.foxdb


效果:

此主题相关图片如下:1.png
按此在新窗口浏览图片


[此贴子已经被作者于2017/7/10 17:29:02编辑过]

[本帖被加为精华]
 回到顶部
帅哥,在线噢!
有点蓝
  2楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:106242 积分:540333 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2017/7/11 14:43:00 [显示全部帖子]

测试没有问题哦,或者换个方法返回数据测试也可以的

......
    Case "getdata.htm"
        Dim json As String
        If e.GetValues("type") = "1" Then
            json  = FileSys.ReadAllText("d:\web\lib\data1.txt")
        Else
            Dim jo As New JObject
            Dim ja As New Jarray '定义数组
            Dim arr() As String = {"北京","天津","上海","重庆","河北","河南","云南"}
            For Each csh As String In arr
                Dim j2 As new JObject
                j2("name") = csh
                j2("value") = Rand.Next(3,20)
                ja.Add(j2)
            Next
            jo("foxtable") = ja '将Roles设置为前面定义的数组
            json = jo.ToString
        End If
        e.WriteString(json )
......

 回到顶部
帅哥,在线噢!
有点蓝
  3楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:106242 积分:540333 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2017/7/20 18:06:00 [显示全部帖子]

看懂1楼的例子就知道是怎么一回事了。你需要学一点js/ajex的知识
[此贴子已经被作者于2017/7/20 18:06:38编辑过]

 回到顶部
帅哥,在线噢!
有点蓝
  4楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:106242 积分:540333 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2017/7/21 20:25:00 [显示全部帖子]

Dim jo As New JObject
Dim ja1 As New JArray     '定义数组
Dim ja2 As New JArray     '定义数组

For Each dr As DataRow In DataTables("表A").DataRows
    ja1.Add(dr("月份"))
    ja2.Add(dr("数量"))
Next

jo("categories") = ja1
jo("data") = ja2
json = jo.ToString

 回到顶部
帅哥,在线噢!
有点蓝
  5楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:超级版主 帖子:106242 积分:540333 威望:0 精华:9 注册:2015/6/24 9:21:00
  发帖心情 Post By:2017/7/24 23:08:00 [显示全部帖子]

测试一下就知道答案了

 回到顶部