Difference between revisions of "Team:SMMU-China/Design"

Line 210: Line 210:
 
    </div>
 
    </div>
 
  </details>
 
  </details>
 +
</div>
 +
</div>
 +
 +
<div class="medium_framework">
 +
<div id="wrapper">
 +
  <div id="chart-area">
 +
 +
  </div>
 +
  <div id="chart-bar">
 +
 +
  </div>
 
</div>
 
</div>
 
</div>
 
</div>
Line 232: Line 243:
  
 
<script src="https://2019.igem.org/Template:SMMU-China/JS_notebook?action=raw&ctype=text/javascript"></script>
 
<script src="https://2019.igem.org/Template:SMMU-China/JS_notebook?action=raw&ctype=text/javascript"></script>
 +
<script src="https://2019.igem.org/Template:SMMU-China/JS_apexchart?action=raw&ctype=text/javascript"></script>
 +
<script>
 +
var data = generateDayWiseTimeSeries(new Date("22 Apr 2017").getTime(), 115, {
 +
  min: 30,
 +
  max: 90
 +
});
 +
var options1 = {
 +
  chart: {
 +
    id: "chart2",
 +
    type: "area",
 +
    height: 230,
 +
    foreColor: "#ccc",
 +
    toolbar: {
 +
      autoSelected: "pan",
 +
      show: false
 +
    }
 +
  },
 +
  colors: ["#00BAEC"],
 +
  stroke: {
 +
    width: 3
 +
  },
 +
  grid: {
 +
    borderColor: "#555",
 +
    yaxis: {
 +
      lines: {
 +
        show: false
 +
      }
 +
    }
 +
  },
 +
  dataLabels: {
 +
    enabled: false
 +
  },
 +
  fill: {
 +
    gradient: {
 +
      enabled: true,
 +
      opacityFrom: 0.55,
 +
      opacityTo: 0
 +
    }
 +
  },
 +
  markers: {
 +
    size: 5,
 +
    colors: ["#000524"],
 +
    strokeColor: "#00BAEC",
 +
    strokeWidth: 3
 +
  },
 +
  series: [
 +
    {
 +
      data: data
 +
    }
 +
  ],
 +
  tooltip: {
 +
    theme: "dark"
 +
  },
 +
  xaxis: {
 +
    type: "datetime"
 +
  },
 +
  yaxis: {
 +
    min: 0,
 +
    tickAmount: 4
 +
  }
 +
};
 +
 +
var chart1 = new ApexCharts(document.querySelector("#chart-area"), options1);
 +
 +
chart1.render();
 +
 +
var options2 = {
 +
  chart: {
 +
    id: "chart1",
 +
    height: 130,
 +
    type: "bar",
 +
    foreColor: "#ccc",
 +
    brush: {
 +
      target: "chart2",
 +
      enabled: true
 +
    },
 +
    selection: {
 +
      fill: {
 +
        color: "#fff",
 +
        opacity: 0.4
 +
      },
 +
      xaxis: {
 +
        min: new Date("27 Jul 2017 10:00:00").getTime(),
 +
        max: new Date("14 Aug 2017 10:00:00").getTime()
 +
      }
 +
    }
 +
  },
 +
  colors: ["#FF0080"],
 +
  series: [
 +
    {
 +
      data: data
 +
    }
 +
  ],
 +
  stroke: {
 +
    width: 2
 +
  },
 +
  grid: {
 +
    borderColor: "#444"
 +
  },
 +
  markers: {
 +
    size: 0
 +
  },
 +
  xaxis: {
 +
    type: "datetime",
 +
    tooltip: {
 +
      enabled: false
 +
    }
 +
  },
 +
  yaxis: {
 +
    tickAmount: 2
 +
  }
 +
};
 +
 +
var chart2 = new ApexCharts(document.querySelector("#chart-bar"), options2);
 +
 +
chart2.render();
 +
 +
function generateDayWiseTimeSeries(baseval, count, yrange) {
 +
  var i = 0;
 +
  var series = [];
 +
  while (i < count) {
 +
    var x = baseval;
 +
    var y =
 +
      Math.floor(Math.random() * (yrange.max - yrange.min + 1)) + yrange.min;
 +
 +
    series.push([x, y]);
 +
    baseval += 86400000;
 +
    i++;
 +
  }
 +
  return series;
 +
}
 +
</script>
  
 
</html>
 
</html>

Revision as of 15:27, 11 August 2019

XiaoTian
Home
Home
PROJECT
Description
Design
Experiments
Notebook
Contribution
Results
Demonstrate
Improve
Attributions
PARTS
Parts Overview
Basic Parts
Composite Parts
Part Collection
Safety
Safety
HUMAN PRACTICES
Human Practices
Education & Engagement
AWARDS
Model
Software
page_banner_default
Design
This is a descriptive paragraph.

Column 1

smmu_default_pic

Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

Column 1/2

smmu_default_pic

Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

Column 1/2

smmu_default_pic

Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

TABLE

Name Sequence Relative Strength
A1 AACCGGTT 1.00
A2 TTGGCCAA 2.00

Notebook

Day 1

our team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

our team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

Day 2

our team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

Day 3

our team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season! Your team has been approved and you are ready to start the iGEM season!

Contact Us
E-Mail: igem-smmu@smmu.edu.cn
Phone: +86 021-81870925
© 2019. SMMU. All rights reserved.