引用 echarts的代码 时 路径错误,不能显示图表。怎么改

你说的那片绿 发布于 2015/12/07 14:54
阅读 741
收藏 0

引用网址:http://echarts.baidu.com/doc/example/topic/10-me-china/index.html

路径 改的都是本地的

<!DOCTYPE html>

<html lang="en">


<head>
    <meta charset="utf-8">
    <title>中国经济十年时空漫游</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="China">
    <meta name="author" content="kener.linfeng@gmail.com">


    <link href="echarts-2.2.7/doc/asset/css/bootstrap.css" rel="stylesheet">
    <link href="echarts-2.2.7/doc/asset/css/bootstrap-responsive.css" rel="stylesheet">
    <link rel="shortcut icon" href="echarts-2.2.7/doc/asset/ico/favicon.png">
    <style type="text/css">
        * {
            font-family: "Microsoft YaHei" !important;
        }
        
        body {
            background-image: url(echarts-2.2.7/doc/asset/img/groovepaper.png);
            background-repeat: repeat;
        }
        
        header {
            background-image: url(echarts-2.2.7/doc/asset/img/tweed.png);
            background-repeat: repeat;
        }
        
        h1 {
            color: #FFF;
            font-weight: bolder;
            margin: 20px 0;
        }
        
        section {
            background-image: url(echarts-2.2.7/doc/asset/img/ticks.png);
            background-repeat: repeat;
            padding: 10px;
        }
        
        footer {
            height: 100px;
            background-image: url(echarts-2.2.7/doc/asset/img/tweed.png);
            background-repeat: repeat;
            font-size: 14px;
            color: #CCC;
            text-align: center;
            padding-top: 15px;
            margin-top: 15px;
        }
        
        .nav.nav-tabs.nav-justified {
            margin-bottom: 0;
        }
        
        .ctrl-wrap {
            padding: 5px 20px 20px 20px;
            text-align: center;
        }
        
        .ctrl-content .btn {
            width: 7%;
        }
        
        .tab-content {
            padding: 20px;
            border: 1px solid #dddddd;
            border-top: 0px;
        }
        
        .g2wrap {
            height: 300px;
            width: 33%;
            float: left;
        }
        
        input[type="radio"] {
            margin: -5px 5px 0;
        }
        
        label {
            display: inline-block;
            margin-bottom: 5px;
            font-weight: bold;
        }
        
        footer a:hover {
            color: #62C462
        }
    </style>
</head>


<body>
    <!-- HEADER -->
    <header>
        <div class="container">
            <h1>中国经济十年时空漫游</h1>
        </div>
    </header>
    <section>
        <div class="container">
            <strong>引言:</strong>进入21世纪,中国经济延续了过去30多年的火箭式发展,也同样延续了地域与经济结构的不平衡。在过去十年中,各地之间的经济差距有多大?各地的经济结构有多大差异?每个人分享到多少经济成果?都可以在时空漫游中找到答案……
        </div>
    </section>
    <div class="container">
        <!-- CONTAINER -->
        <div class="row">
            <div id="overview" class="span12">
                <h3>2011年GDP:谁跻身万亿俱乐部 谁还在百亿级漂浮</h3>
               
                <div id="g0" style="height:550px"></div>
            </div>
            <div id="graphic" class="span12">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs nav-justified">
                    <li class="active">
                        <a id="tab1" href="#main1" data-toggle="tab">当经济成果摊到每个人身上…</a></li>
                    <li><a id="tab2" href="#main2" data-toggle="tab">经济发展有多不平衡?</a></li>
                    <li><a id="tab3" href="#main3" data-toggle="tab">房地产支撑GDP?</a></li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                    <div class="tab-pane active" id="main1">
                        <p>人均指标选择:
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios1" value="GDP" checked>GDP
                            </label>
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios2" value="Financial">金融
                            </label>
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios3" value="Estate">房地产
                            </label>
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios4" value="PI">第一产业
                            </label>
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios5" value="SI">第二产业
                            </label>
                            <label>
                                <input type="radio" name="optionsRadios" id="optionsRadios6" value="TI">第三产业
                            </label>
                        </p>
                        <div id="g1" style="height:400px"></div>
                      
                    </div>
                    <div class="tab-pane" id="main2">
                        <div class="ctrl-wrap">
                            <div class="ctrl-content">
                                <button type="button" class="btn btn-success" id="2002">2002</button>
                                <button type="button" class="btn btn-info" id="2003">2003</button>
                                <button type="button" class="btn btn-info" id="2004">2004</button>
                                <button type="button" class="btn btn-info" id="2005">2005</button>
                                <button type="button" class="btn btn-info" id="2006">2006</button>
                                <button type="button" class="btn btn-info" id="2007">2007</button>
                                <button type="button" class="btn btn-info" id="2008">2008</button>
                                <button type="button" class="btn btn-info" id="2009">2009</button>
                                <button type="button" class="btn btn-info" id="2010">2010</button>
                                <button type="button" class="btn btn-info" id="2011">2011</button>
                            </div>
                        </div>
                        <div id="g20" class="g2wrap"></div>
                        <div id="g21" class="g2wrap"></div>
                        <div id="g22" class="g2wrap"></div>
                        <div id="g23" class="g2wrap"></div>
                        <div id="g24" class="g2wrap"></div>
                       
                        <p style="clear:both"></p>
                    </div>
                    <div class="tab-pane" id="main3">
                        <div id="g3" style="height:400px"></div>
                        <p><i>*GDP与房地产的关系、与金融业的关系,房地产与金融业的关系,第一、二、三产业间的关系……任何两项或多项数据间均可进行比较。</i></p>
                      
                    </div>
                </div>
            </div>
            <!--/span-->
        </div>
        <!--/row-->
    </div>
    <!-- FOOTER -->
    <footer>
        <p>&copy; 2014 Data Journalism Workshop(华媒基金会 &middot; 数据新闻工作坊) &middot; 于博(新华社) &middot; 吴楚茵(南方都市报) &middot; <a href="http://weibo.com/kenerlinfeng" target="_blank">林峰</a>(百度)</p>
        <p><a href="http://echarts.baidu.com" target="_blank">Data Visualization by ECharts</a></p>
    </footer>


    <script src="echarts-2.2.7/doc/asset/js/jquery.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-transition.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-alert.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-modal.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-dropdown.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-scrollspy.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-tab.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-tooltip.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-popover.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-button.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-collapse.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-carousel.js"></script>
    <script src="echarts-2.2.7/doc/asset/js/bootstrap-typeahead.js"></script>
    <!-- core -->


 <script src="echarts-2.2.7/doc/example/www/js/echarts.js"></script>


    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/data-formatter.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/data-a-china.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/data-china.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/option0.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/option1.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/option2.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/option3.js"></script>
    <script src="echarts-2.2.7/doc/example/topic/10-me-china/js/djws.js"></script>
</body>


</html>
加载中
返回顶部
顶部