Difference between revisions of "Team:SJTU-BioX-Shanghai/HP test page"

 
(12 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
<html>
+
<html>
−
    <meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0, maximum-scale=1, user-scalable=no, minimal-ui">
+
<head> 
−
<style>
+
<meta charset="utf-8">
−
/* Clear the default wiki settings */
+
<title>做一个简单的图表</title>  
−
+
</head>  
−
#home_logo, #sideMenu { display:none; }
+
<body> 
−
#sideMenu, #top_title, .patrollink , #bars_item {display:none;}
+
−
#content { width:100%; padding:0px; margin-top:-7px; margin-left:0px;}
+
−
body {background-color:white; }
+
−
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
−
#globalWrapper{padding:0;}
+
−
        p {margin:0}
+
−
        #HQ_page p{text-align:inherit;}
+
−
        #top_menu_inside #user_item{padding-top:0px;}
+
−
#top_menu_inside{border-left:0px;border-right:0px;width:auto;}
+
−
li{margin-bottom:0;}
+
−
</style>
+
  
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/jquery?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/script?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/popper?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/ripple?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/bootstrap?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/nav?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script src="https://2017.igem.org/Template:SJTU-BioX-Shanghai/Javascript/echarts?
 +
            action=raw&amp;ctype=text/javascript"></script>
 +
        <script type="text/javascript">
 +
            // 基于准备好的dom，初始化echarts实例
 +
            var myChart = echarts.init(document.getElementById('radar'));
  
−
    <body>
+
            // 指定图表的配置项和数据
−
        <p>Hello World 1</p>
+
            var option = {
−
        <p>Hello World 2</p>
+
                title: {
−
        <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
+
                    text: ' '
−
        <script> 
+
                },
−
        d3.select("body").selectAll("p").text("www.ourd3js.com");     
+
                tooltip: {},
−
        </script>
+
                legend: {
−
    </body>
+
                    data: ['Chip', 'Microdroplet', 'Paper']
 +
                },
 +
                radar: {
 +
                    // shape: 'circle',
 +
                    name: {
 +
                        textStyle: {
 +
                            color: '#fff',
 +
                            backgroundColor: '#999',
 +
                            borderRadius: 3,
 +
                            padding: [3, 5]
 +
                        }
 +
                    },
 +
                    indicator: [{
 +
                        name: 'Even Color',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Technical Realization',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Obvious Color',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Culture Environment',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Bacteria fixation',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Price',
 +
                        max: 5
 +
                    }, {
 +
                        name: 'Portable',
 +
                        max: 5
 +
                    }, ]
 +
                },
 +
                series: [{
 +
                    name: ' Radar graph for three potential loaders ',
 +
                    type: 'radar',
 +
                    // areaStyle: {normal: {}},
 +
                    data: [{
 +
                        value: [3, 3, 1, 1, 4, 4,5],
 +
                        name: 'Chip'
 +
                       
 +
                    }, {
 +
                        value: [1, 2, 2, 5, 5, 4,5],
 +
                        name: 'Microdroplet',
 +
                       
 +
                    }, {
 +
                        value: [4, 5, 5, 3, 3, 5,5],
 +
                        name: 'Paper',
 +
                     
 +
                    }]
 +
                }]
 +
            };
  
 +
            myChart.setOption(option);
 +
        </script>
  
 +
</body> 
 
</html>
 
</html>

Latest revision as of 22:15, 13 August 2018

做一个简单的图表