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


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

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

帅哥哟,离线,有人找我吗?
天若千颖
  1楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/20 7:54:00 [显示全部帖子]

这个插件的图标类型真丰富,但是一定需要HttpRequest事件才能用吗?难道普通开发版就没法使用这样高级的图表插件了?
建议版主做一个Foxtable普通开发版也能用的例子,大家也方便用在自己的项目中,这样将大大丰富Foxtable的图表功能。

 回到顶部
帅哥哟,离线,有人找我吗?
天若千颖
  2楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/20 8:20:00 [显示全部帖子]

 Echart是基于浏览器的图表插件,可以用Foxtable内置的Webbrowser来打开,我看Echart的代码也并不复杂,数据调用的格式也很规范。
 
 http://echarts.baidu.com/gallery/editor.html?c=doc-example/line-stack-tiled

  xAxis: {
        type: 'category',
        boundaryGap: false,
        data: ['周一','周二','周三','周四','周五','周六','周日']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        name: '成交',
        type: 'line',
        smooth: true,
        data: [10, 12, 21, 54, 260, 830, 710]
    },

 
   如果是普通开发版,如何替换成Foxtable表格中的数据?普通开发版没有HttpRequest事件。

[此贴子已经被作者于2017/7/20 8:26:20编辑过]

 回到顶部
帅哥哟,离线,有人找我吗?
天若千颖
  3楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/20 12:47:00 [显示全部帖子]

也就是说Echart即使Foxtable的普通开发版,也能集成到Foxtable里面使用?

如果是这样的话,我就研究研究,以后作图的种类就多太多了。

 回到顶部
帅哥哟,离线,有人找我吗?
天若千颖
  4楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/20 17:03:00 [显示全部帖子]

对,版主提供一个完整的例子吧,用Foxtable中的表格中的数据绘图,也是对Foxtable图表功能的一大扩展,也方便大家临摹。

 回到顶部
帅哥哟,离线,有人找我吗?
天若千颖
  5楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/24 15:56:00 [显示全部帖子]

蓝版,你好,如果这个例子,是不是可以采用如下方案集成到Foxtable中。

http://echarts.baidu.com/gallery/editor.html?c=bar-tick-align  把下载得到的DEMO的全部代码保存到Foxtable表格中,其中一下红色部分要修改

 xAxis : [
        {
            type : 'category',
            Date:#XData1#,                  ‘需要用通配符如#XDate1#替换  ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis : [
        {
            type : 'value'
        }
    ],
    series : [
        {
            name:'直接访问',
            type:'bar',
            barWidth: '60%',
            Data:#Data2#    '通配符#Data2替换 [10, 52, 200, 334, 390, 330, 220]
        }
    ]
 
  在绘图的时候,直接读取表格中的上述代码并把上述内容并使用ja1.Tostring和Ja2.Tostring去Replace#Data1#和Date2,连续替换两次。
 
  需要这样去替换吗?

   但是有的数据是有单引号,有的数据没有引号(如上面Data2的数据),json如何能让解吸出来的数据没有引号?
[此贴子已经被作者于2017/7/24 15:56:36编辑过]

 回到顶部
帅哥哟,离线,有人找我吗?
天若千颖
  6楼 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:三尾狐 帖子:682 积分:4871 威望:0 精华:0 注册:2014/6/15 16:01:00
  发帖心情 Post By:2017/7/25 9:01:00 [显示全部帖子]

思路先放这里吧,有空再来折腾,感觉Echart集成到Foxtable不是特方面,不同的图数据引用格式不一样,做起来很麻烦。



 回到顶部