以文本方式查看主题

-  Foxtable(狐表)  (http://foxtable.net/bbs/index.asp)
--  专家坐堂  (http://foxtable.net/bbs/list.asp?boardid=2)
----  [求助]狐表的WEB开发结合echarts,当后台数据发生变化时,echarts中的图表可以实时变化吗?  (http://foxtable.net/bbs/dispbbs.asp?boardid=2&id=119380)

--  作者:ymjr2011
--  发布时间:2018/5/23 20:34:00
--  [求助]狐表的WEB开发结合echarts,当后台数据发生变化时,echarts中的图表可以实时变化吗?
狐表的WEB开发结合echarts,当后台数据发生变化时,echarts中的图表可以实时变化吗?
--  作者:有点甜
--  发布时间:2018/5/23 20:53:00
--  

后台数据变化后,前台是否知道?

 

1、你可以定时load数据,把最新的数据设置图表;

 

2、你可以利用openqq即时同步数据,然后设置图表。


--  作者:ymjr2011
--  发布时间:2018/5/23 21:41:00
--  

后台数据变化后,前台是否知道?

 

1、你可以定时load数据,把最新的数据设置图表;

 

2、你可以利用openqq即时同步数据,然后设置图表。  (这个应该怎么做?)


--  作者:有点甜
--  发布时间:2018/5/23 21:46:00
--  

参考

 

http://www.foxtable.com/webhelp/scr/3006.htm

 

建议先把openqq一整章看完 http://www.foxtable.com/webhelp/scr/3053.htm

 


--  作者:ymjr2011
--  发布时间:2018/5/24 10:16:00
--  
第一种方式应该要简单点,请问load后应该怎么把data数据再写过去呢?
--  作者:有点甜
--  发布时间:2018/5/24 10:22:00
--  
以下是引用ymjr2011在2018/5/24 10:16:00的发言:
第一种方式应该要简单点,请问load后应该怎么把data数据再写过去呢?

 

你当初怎么写进去的,load之后就怎么写进去。

 

不然做个实例说明。

[此贴子已经被作者于2018/5/24 10:21:52编辑过]

--  作者:ymjr2011
--  发布时间:2018/5/24 17:11:00
--  
map.js
var myChart1 = echarts.init(document.getElementById(\'main1\'),\'macarons\');
var myChart2 = echarts.init(document.getElementById(\'main2\'),\'macarons\');
$.get(\'getdata.htm?type=1\').done(function (jsonstr) {
var mydata = eval(\'(\' + jsonstr + \')\');
    myChart1.setOption({
        title: {
            text: \'\'
        },
        tooltip: {
},
     textStyle:{
color:\'#000\'
},
        xAxis: {
            data: mydata.categories
        },
        yAxis: {},
        series: [{
            name: \'\',
            type: \'bar\',
            data: mydata.data
        }]
    });
});



$.get(\'getdata.htm?type=2\').done(function (jsonstr) {
var mydata = eval(\'(\' + jsonstr + \')\');
    myChart2.setOption({
tooltip:{
formatter: "{a} <br/>{b} : {c}%"
},

    series: [{
            name: \'foxtable\',
            type: \'gauge\',
            detail: {formatter:\'{value}%\'},
           
            data: [{value: 90, name: \'完成率\'}],
axisLine: {
                lineStyle: {
                    color: [[0.2, "rgb(255, 0, 0)"], [0.8, "rgb(255, 255, 86)"], [1, "rgb(33, 255, 0)"]]
                }
            }
        }]

});

});


httprequest

Dim fl As String = "d:\\web\\" & e.path
Dim wb As New WeUI
Dim sb As New StringBuilder
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
Else
    
End If

Select Case e.Path
    Case "test.htm"

          With wb.AddArticle("","ar1")          
            Dim str As String = FileSys.ReadAllText("d:\\web\\index.html", encoding.default)
            AddContent(str)
        End With
        \'
        wb.AppendHTML("<script src=\'./lib/map.js\'></script>")
        \'
        e.WriteString(wb.Build)
    Case "getdata.htm"
        Dim json As String
        If e.GetValues("type") ="1" Then
            
            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
        Else
            json  = FileSys.ReadAllText("d:\\web\\lib\\data2.txt")
            
        End If
        
        
        e.WriteString(json)
End Select
e.WriteString(wb.Build)

--  作者:ymjr2011
--  发布时间:2018/5/24 17:12:00
--  
当 DataTables("表A")  数据发生变化后,如何让web页面的图表数据也变化?


--  作者:有点甜
--  发布时间:2018/5/24 17:18:00
--  
以下是引用ymjr2011在2018/5/24 17:12:00的发言:
当 DataTables("表A")  数据发生变化后,如何让web页面的图表数据也变化?

 

js里面写一个定时器,定时获取后台数据,获取到以后显示到你的echar图表上,即可。

 

https://www.baidu.com/baidu?wd=js+%E5%AE%9A%E6%97%B6%E5%99%A8

 

https://www.baidu.com/baidu?wd=jquery+%E5%AE%9A%E6%97%B6%E5%99%A8

 

 


--  作者:ymjr2011
--  发布时间:2018/5/25 19:34:00
--  
版主,基于上面的JS代码,定时器应该怎么改?