搜索
查看: 6253|回复: 1

[web] echarts调用示例

   关闭 [复制链接]

30

主题

695

帖子

4178

积分

超级版主

Rank: 8Rank: 8

积分
4178
发表于 2015-12-2 23:46:55 | 显示全部楼层 |阅读模式
相关帖:嵌入open flash chart 图表组件

  1. import win.ui;
  2. /*DSG{{*/
  3. var winform = win.form(text="aardio echarts";right=909;bottom=669;border="dialog frame";max=false;min=false)
  4. /*}}*/

  5. import web.form;
  6. var wb = web.form( winform );

  7. import web.json;
  8. wb.external = {
  9.     getOption = function( num ){
  10.         var data = {
  11.             calculable = true;
  12.             legend = {
  13.                 data = { "直接访问"; "邮件营销"; "联盟广告"; "视频广告"; "搜索引擎" };
  14.                 orient = "vertical";
  15.                 x = "left"
  16.             };
  17.             series = {
  18.                 {
  19.                     center = { "50%"; "60%" };
  20.                     data = {
  21.                         { name = "直接访问"; value = 335 };
  22.                         { name = "邮件营销"; value = 310 };
  23.                         { name = "联盟广告"; value = 234 };
  24.                         { name = "视频广告"; value = 135 };
  25.                         { name = "搜索引擎"; value = 1548 }
  26.                     };
  27.                     name = "访问来源"; radius = "55%"; type = "pie"
  28.                 }
  29.             };
  30.             title = { subtext = "纯属虚构"; text = "某站点用户访问来源"; x = "center"         };
  31.             toolbox = {
  32.                 feature = {
  33.                     dataView = { readOnly = false; show = true };
  34.                     magicType = {
  35.                         option = { funnel = { funnelAlign = "left"; max = 1548; width = "50%"; x = "25%" }};
  36.                         show = true;
  37.                         type = { "pie"; "funnel" }
  38.                     };
  39.                     mark = { show = true };
  40.                     restore = { show = true };
  41.                     saveAsImage = { show = true }
  42.                 }; show = true
  43.             };
  44.             tooltip = { formatter = "{a} <br/>{b} : {c} ({d}%)"; trigger = "item" }
  45.         }
  46.         
  47.         var json = web.json.stringify(data);
  48.         return wb.script.eval( "(" + json + ")" )
  49.     }
  50. }

  51. wb.html = /**
  52. <!doctype html>
  53. <html>
  54. <head>
  55.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  56.     <meta charset="UTF-8">  
  57. </head>
  58. <body>
  59.     <div id="main" style="height:600px;"></div>
  60.     <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
  61.     <script>
  62.         var myChart = echarts.init(document.getElementById('main'));
  63.         myChart.setOption( external.getOption() );
  64.     </script>
  65. </body>
  66. </html>
  67. **/
  68. winform.show(); //显示窗体

  69. //启动消息循环
  70. win.loopMessage();
复制代码

评分

参与人数 3银币 +55 收起 理由
zzxvictory + 5 很给力!
小X + 40 赞一个!
liubing19860405 + 10 赞一个!

查看全部评分

回复

使用道具 举报

186

主题

2542

帖子

1万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
13974
发表于 2017-2-12 12:44:33 | 显示全部楼层

echarts调用示例 - webkit版本

import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio echarts";right=909;bottom=669;border="dialog frame";max=false;min=false)
/*}}*/

import web.kit.form;
var wb = web.kit.form( winform );

import web.json;
wb.external = {
    getOption =
function( num ){
        
var data = {
            calculable =
true;
            legend = {
                data = {
"直接访问"; "邮件营销"; "联盟广告"; "视频广告"; "搜索引擎" };
                orient =
"vertical";
                x =
"left"
            };
            series = {
                {
                    center = {
"50%"; "60%" };
                    data = {
                        { name =
"直接访问"; value = 335 };
                        { name =
"邮件营销"; value = 310 };
                        { name =
"联盟广告"; value = 234 };
                        { name =
"视频广告"; value = 135 };
                        { name =
"搜索引擎"; value = 1548 }
                    };
                    name =
"访问来源"; radius = "55%"; type = "pie"
                }
            };
            title = { subtext =
"纯属虚构"; text = "某站点用户访问来源"; x = "center"    };
            toolbox = {
                feature = {
                    dataView = { readOnly =
false; show = true };
                    magicType = {
                        option = { funnel = { funnelAlign =
"left"; max = 1548; width = "50%"; x = "25%" }};
                        show =
true;
                        
type = { "pie"; "funnel" }
                    };
                    mark = { show =
true };
                    restore = { show =
true };
                    saveAsImage = { show =
true }
                }; show =
true
            };
            tooltip = { formatter =
"{a} <br/>{b} : {c} ({d}%)"; trigger = "item" }
        }
        
        
return web.json.stringify(data);
    }
}

wb.html =
/**
<!doctype html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta charset="UTF-8">  
</head>
<body>
    <div id="main" style="height:600px;"></div>
    <script src="http://echarts.baidu.com/dist/echarts.min.js"></script>
    <script>
        var myChart = echarts.init(document.getElementById('main'));
        myChart.setOption( JSON.parse( external.getOption() ) );
    </script>
</body>
</html>
**/

winform.show();
//显示窗体

//启动消息循环
win.loopMessage();

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册会员

本版积分规则

手机版|未经许可严禁引用或转载本站文章|站长邮箱|aardio.com|aardio官方社区 ( 皖ICP备09012014号 )

GMT+8, 2018-9-22 23:27 , Processed in 0.062500 second(s), 23 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表