sapui5代码中使用jquey插件flot画图

来源:互联网 发布:起点 科幻 知乎 编辑:程序博客网 时间:2024/06/05 23:52

下载js类库放到app的js目录下面

修改文件manifest.json

    "resources": {            "js": [                {                    "uri": "js/jquery.flot.js"                },                {                    "uri": "js/jquery.flot.stack.js"                },                {                    "uri": "js/JUMFlot.min.js"                }            ],            "css": [                {                    "uri": "css/style.css"                }            ]

controller js代码中画图即可,比如

plotspider: function() {        var d1 = [ [0,10], [1,20], [2,80], [3,70], [4,60] ];        var d2 = [ [0,30], [1,25], [2,50], [3,60], [4,95] ];        var d3 = [ [0,50], [1,40], [2,60], [3,95], [4,30] ];        var data = [                { label: "Pies", color:"green",data: d1,                 spider: {show: true, lineWidth: 12} },            { label: "Apples",color:"orange",data: d2,             spider: {show: true} },            { label: "Cherries",color:"red",data: d3,             spider: {show: true} }             ];        var options = {            series:{                 editMode: 'v',editable:true,                spider:{                    active: true,highlight: {mode: "area"},                    legs: {                             data: [{label: "SAP"},{label: "Huawei"},{label: "Lenovo"},{label: "三桶油"},{label: "中国电信"}],                        legScaleMax: 1, legScaleMin:0.8                    },                    spiderSize: 0.9                      }            },            grid:{                 hoverable: true,clickable: true, editable:true,                tickColor: "rgba(0,0,0,0.2)",mode: "spider"            }        };        $.plot($("#flotContainer"), data, options);      },
原创粉丝点击