百度开源项目插件 - Echarts 图表

DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>EChartstitle>
    <script src="../../res/js/echarts.js">script>
    <script src="../../res/js/jquery.js">script>
head>
<body>
    <div id="main" style="width: 600px;height:400px;">div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));

        
        // 指定图表的配置项和数据
        var option = {

            color: ['#ca8622', '#bda29a'],
            //['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3']
            title: {
                text: '维度分析'
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    crossStyle: {
                        color: '#999'
                    }
                }
            },
            legend: {
                data: ['销量','小组绩效']
            },
            xAxis: {
                data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
            },
            yAxis: {},
            series: [{
                name: '销量',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20]
            },
            {
                name: '小组绩效',
                type: 'bar',
                data: [85,90,88,86,95,90]
            }
            ]
        };
        

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        
        //$.getJSON('Handler1.ashx', {
        //    request:"ssss"
        //}, function (json) {
        //    alert("22");
            
        //}
        //);


        /* 测试可以
        $.ajax({
            url: 'Handler1.ashx',
            type: 'GET',
            dataType: 'json',
            timeout: 1000,
            async: false,
            success: function (xml,dstat) {
                // alert(xml);
                //此处xml就是XML的jQuery对象了，你可以用find()、next()或XPath等方法在里面寻找节点， 和用jQuery操作HTML对象没有区别    
                option = xml;
                myChart.setOption(option);
            },
            error: function (er) {
                alert(er.responseText);
            }
        });
        */


    script>
body>
html>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;

namespace AppBox.CRM.Gift
{
    /// 

    /// Handler1 的摘要说明
    /// 
    public class Handler1 : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "application/json";
            //context.Response.Write("Hello World");
            StringBuilder strjson = new StringBuilder();
            strjson.AppendLine("{");
            strjson.AppendLine("\"title\": {");
            strjson.AppendLine("    \"text\": 'ECharts 入门示例'");
            strjson.AppendLine("},");
            strjson.AppendLine("\"tooltip\": {},");
            strjson.AppendLine("\"legend\": {");
            strjson.AppendLine("    \"data\": ['销量']");
            strjson.AppendLine("},");
            strjson.AppendLine("\"xAxis\": {");
            strjson.AppendLine("    \"data\": [\"衬衫\", \"羊毛衫\", \"雪纺衫\", \"裤子\", \"高跟鞋\", \"袜子\"]");
            strjson.AppendLine("},");
            strjson.AppendLine("\"yAxis\": {},");
            strjson.AppendLine("\"series\": [{");
            strjson.AppendLine("    \"name\": '销量',");
            strjson.AppendLine("    \"type\": 'bar',");
            strjson.AppendLine("    \"data\": [20, 20, 20, 10, 10, 100]");
            strjson.AppendLine("}]");
            strjson.AppendLine("}");
            context.Response.Write(strjson.ToString().Replace("'","\""));
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

echarts.js文件,刚开始下载错了.