zhangkun
/
ditie2.0_web


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176
							<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <link href="/Content/layui/css/layui.css" rel="stylesheet" />
    <link href="/Content/css/public.css" rel="stylesheet" />
    <link href="/Content/css/callscreen/callscreen.css" rel="stylesheet" />
    <link href="/Content/layui/css/modules/layui-icon-extend/iconfont.css" type="text/css" rel=" stylesheet" />
    <link href="/Content/css/font-awesome/css/font-awesome.min.css" type="text/css" rel=" stylesheet" />
    <script src="/Content/dist/echarts.js" type="text/javascript"></script>
    <script src="/Content/dist/theme/dahua.js" type="text/javascript"></script>
</head>
<body>
    
    <div id="divimagereport" style="height: 300px; width: 100%;">
    </div>
    <script type="text/javascript">
        //获取url中的参数
        function getUrlParam(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
            var r = window.location.search.substr(1).match(reg);  //匹配目标参数
            if (r != null) return unescape(r[2]); return null; //返回参数值
        }
    </script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: '/Content/dist'
            }
        });

        // 使用
        require(
        [
                'echarts',
                'echarts/chart/bar', // 使用柱状图就加载bar模块，按需加载
                'echarts/chart/line'
        ],
        function (ec) {
            var dahuatheme
            require(['echarts/theme/dahua'], function (theme) {
                dahuatheme = theme;
            });
            // 基于准备好的dom，初始化echarts图表
            var myChart = ec.init(document.getElementById('divimagereport'), dahuatheme);
            option = {
                title: {
                    show: false,
                    text: '',
                    subtext: ''
                },
                tooltip: {
                    trigger: 'axis'
                },
                legend: {
                    data: ['咨询', '表扬', '挂失', '建议', '投诉']
                },
                toolbox: {
                    show: true,
                    feature: {
                        dataView: { show: true, readOnly: false },
                        magicType: { show: true, type: ['line', 'bar'] },
                        restore: { show: true },
                        saveAsImage: { show: true }
                    }
                },
                calculable: true,
                xAxis: [
                    {
                        type: 'category',
                        axisLabel: {
                            interval: 0
                        },
                        data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
                    }
                ],
                yAxis: [
                    {
                        type: 'value'
                    }
                ],
                series: [
                    {
                        name: '咨询',
                        type: 'bar',
                        data: [@Model.Week1],
                        markPoint: {
                            data: [
                                { type: 'max', name: '最大值' },
                                { type: 'min', name: '最小值' }
                            ]
                        },
                        markLine: {
                            data: [
                                { type: 'average', name: '平均值' }
                            ]
                        }
                    },
                    {
                        name: '表扬',
                        type: 'bar',
                        data: [@Model.Week2],
                        markPoint: {
                            data: [
                                { type: 'max', name: '最大值' },
                                { type: 'min', name: '最小值' }
                            ]
                        },
                        markLine: {
                            data: [
                                { type: 'average', name: '平均值' }
                            ]
                        }
                    },
                    {
                        name: '挂失',
                        type: 'bar',
                        data: [@Model.Week3],
                        markPoint: {
                            data: [
                                { type: 'max', name: '最大值' },
                                { type: 'min', name: '最小值' }
                            ]
                        },
                        markLine: {
                            data: [
                                { type: 'average', name: '平均值' }
                            ]
                        }
                    },
                    {
                        name: '建议',
                        type: 'bar',
                        data: [@Model.Week4],
                        markPoint: {
                            data: [
                                { type: 'max', name: '最大值' },
                                { type: 'min', name: '最小值' }
                            ]
                        },
                        markLine: {
                            data: [
                                { type: 'average', name: '平均值' }
                            ]
                        }
                    },
                    {
                        name: '投诉',
                        type: 'bar',
                        data: [@Model.Week5],
                        markPoint: {
                            data: [
                                { type: 'max', name: '最大值' },
                                { type: 'min', name: '最小值' }
                            ]
                        },
                        markLine: {
                            data: [
                                { type: 'average', name: '平均值' }
                            ]
                        }
                    }
                ]
            };
            // 为echarts对象加载数据
            myChart.setOption(option);
        }
    );
    </script>
</body>
</html>