net_echarts使用democontext.Request.

 

 一:引用脚本

  <script type="text/javascript" charset="utf-8" src="../../../scripts/echart/echarts.min.js"></script>

二:设置显示位置

<div id="echart" style="height: 92%;">
</div>

三:ajax数据加载

<script>
var tempurl = "../vote_ajax.ashx?nocache=" + Math.random();
var voteid = "1";
var varXAxis;
var varSeries;
$.ajax({
type: "GET",
contentType: "application/json",
cache: false,
url: "../vote_ajax.ashx",
data: { voteid:voteid,action:"votedata"},
//data: { action: "votedata", voteid: voteid },
dataType: "json",
async:false,
success: function (result) {
if (result != null && result.xAxis != null)
{
varXAxis = result.xAxis.split(',');
}
if (result != null && result.series != null) { 
var jsonS = ("[" + result.series + "]").replace(/'/g, '"');
varSeries = $.parseJSON(jsonS);
}
}
});

// 初始化图表标签
var myChart = echarts.init(document.getElementById('echart'));
var options = {
//定义一个标题
title: {
text: '统计结果'
},
legend: {
data: ['销量']
},
//X轴设置
xAxis: {data:varXAxis},
//{
// data: ['60分', '70分', '80分', '90分', '100分']
// },
yAxis: {
},
//name=legend.data的时候才能显示图例
series: varSeries
//[{
// name: '销量',
// type: 'bar',
// data: ['12', '32', '45', '21', '1']
//}]

};
myChart.setOption(options);
</script>

四:ajax设置

 public void ProcessRequest(HttpContext context)
        {

            string action = context.Request.QueryString("action");
            string voteid = context.Request.QueryString("voteid");
            switch (action) 
            { 
                case "votedata":
                    votedata(context,voteid);
                    break;
            }
        }

          #region
        private void votedata(HttpContext context,string _vote_id)
        {
            StringBuilder strJson = new StringBuilder();
            string xAxis="60分,70分,80分,90分,100分";
            strJson.Append("{\"xAxis\":\"" + xAxis + "\",");
            string series="{'name':'销量','type':'bar','data':['12', '32', '45', '21', '1']}";
            strJson.Append("\"series\":\"" + series + "\"}");
            context.Response.Write(strJson);
            return;

        }

 

posted @ 2017-07-27 17:34  花影疏帘  阅读(93)  评论(0)    收藏  举报