Difference between revisions of "Team:Peking/Practices"

Line 28: Line 28:
 
     }
 
     }
 
     .back-to-top{z-index:9999;}
 
     .back-to-top{z-index:9999;}
 +
 +
    #map_wrapper {
 +
    height: 400px;
 +
}
 +
 +
#map_canvas {
 +
    width: 100%;
 +
    height: 100%;
 +
}
 
     </style>
 
     </style>
 
</head>
 
</head>
Line 202: Line 211:
 
                 <h3 class="classic-title" id="CCiC" style="margin-top:50px"><span>Goal</span></h3>
 
                 <h3 class="classic-title" id="CCiC" style="margin-top:50px"><span>Goal</span></h3>
 
                 <div class="col-md-12">
 
                 <div class="col-md-12">
−
                      <div id="map" data-position-latitude="23.858092" data-position-longitude="90.262181" data-position-latitude="22" data-position-longitude="33"></div>
+
                    <div id="map_wrapper">
−
                      <script>
+
                      <div id="map_canvas" class="mapping"></div>
−
                        (function ( $ ) {
+
                      </div>
−
                            $.fn.CustomMap = function( options ) {
+
                      <script>
−
                          var posLatitude = $('#map').data('position-latitude'),
+
                      jQuery(function($) {
−
                          posLongitude = $('#map').data('position-longitude');
+
    // Asynchronously Load the map API
−
                            var settings = $.extend({
+
    var script = document.createElement('script');
−
                            home: { latitude: posLatitude, longitude: posLongitude },
+
    script.src = "http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize";
−
                            text: '<div class="map-popup"><h4>Web Development | ZoOm-Arts</h4><p>A web development blog for all your HTML5 and WordPress needs.</p></div>',
+
    document.body.appendChild(script);
−
                          icon_url: $('#map').data('marker-img'),
+
});
−
                            zoom: 15
+
−
                            }, options );
+
−
         
+
−
                            var coords = new google.maps.LatLng(settings.home.latitude, settings.home.longitude);
+
−
         
+
−
          return this.each(function() {
+
−
            var element = $(this);
+
−
           
+
−
            var options = {
+
−
              zoom: settings.zoom,
+
−
              center: coords,
+
−
              mapTypeId: google.maps.MapTypeId.ROADMAP,
+
−
              mapTypeControl: false,
+
−
              scaleControl: false,
+
−
              streetViewControl: false,
+
−
              panControl: true,
+
−
              disableDefaultUI: true,
+
−
              zoomControlOptions: {
+
−
                style: google.maps.ZoomControlStyle.DEFAULT
+
−
              },
+
−
              overviewMapControl: true,
+
−
            };
+
−
           
+
−
            var map = new google.maps.Map(element[0], options);
+
−
           
+
−
            var icon = {
+
−
              url: settings.icon_url,
+
−
              origin: new google.maps.Point(0, 0)
+
−
            };
+
−
           
+
−
            var marker = new google.maps.Marker({
+
−
              position: coords,
+
−
              map: map,
+
−
              icon: icon,
+
−
              draggable: false
+
−
            });
+
−
           
+
−
            var info = new google.maps.InfoWindow({
+
−
              content: settings.text
+
−
            });
+
−
           
+
−
            google.maps.event.addListener(marker, 'click', function() {
+
−
              info.open(map, marker);
+
−
            });
+
−
           
+
−
            var styles = [{"featureType":"landscape","stylers":[{"saturation":-100},{"lightness":65},{"visibility":"on"}]},{"featureType":"poi","stylers":[{"saturation":-100},{"lightness":51},{"visibility":"simplified"}]},{"featureType":"road.highway","stylers":[{"saturation":-100},{"visibility":"simplified"}]},{"featureType":"road.arterial","stylers":[{"saturation":-100},{"lightness":30},{"visibility":"on"}]},{"featureType":"road.local","stylers":[{"saturation":-100},{"lightness":40},{"visibility":"on"}]},{"featureType":"transit","stylers":[{"saturation":-100},{"visibility":"simplified"}]},{"featureType":"administrative.province","stylers":[{"visibility":"on"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"on"},{"lightness":-25},{"saturation":-100}]},{"featureType":"water","elementType":"geometry","stylers":[{"hue":"#ffff00"},{"lightness":-25},{"saturation":-97}]}];
+
−
           
+
−
            map.setOptions({styles: styles});
+
−
          });
+
  
−
};
+
function initialize() {
−
}( jQuery ));
+
    var map;
 +
    var bounds = new google.maps.LatLngBounds();
 +
    var mapOptions = {
 +
        mapTypeId: 'roadmap'
 +
    };
 +
                   
 +
    // Display a map on the page
 +
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
 +
    map.setTilt(45);
 +
       
 +
    // Multiple Markers
 +
    var markers = [
 +
        ['London Eye, London', 51.503454,-0.119562],
 +
        ['Palace of Westminster, London', 51.499633,-0.124755]
 +
    ];
 +
                       
 +
    // Info Window Content
 +
    var infoWindowContent = [
 +
        ['<div class="info_content">' +
 +
        '<h3>London Eye</h3>' +
 +
        '<p>The London Eye is a giant Ferris wheel situated on the banks of the River Thames. The entire structure is 135 metres (443 ft) tall and the wheel has a diameter of 120 metres (394 ft).</p>' +        '</div>'],
 +
        ['<div class="info_content">' +
 +
        '<h3>Palace of Westminster</h3>' +
 +
        '<p>The Palace of Westminster is the meeting place of the House of Commons and the House of Lords, the two houses of the Parliament of the United Kingdom. Commonly known as the Houses of Parliament after its tenants.</p>' +
 +
        '</div>']
 +
    ];
 +
       
 +
    // Display multiple markers on a map
 +
    var infoWindow = new google.maps.InfoWindow(), marker, i;
 +
   
 +
    // Loop through our array of markers & place each one on the map 
 +
    for( i = 0; i < markers.length; i++ ) {
 +
        var position = new google.maps.LatLng(markers[i][1], markers[i][2]);
 +
        bounds.extend(position);
 +
        marker = new google.maps.Marker({
 +
            position: position,
 +
            map: map,
 +
            title: markers[i][0]
 +
        });
 +
       
 +
        // Allow each marker to have an info window   
 +
        google.maps.event.addListener(marker, 'click', (function(marker, i) {
 +
            return function() {
 +
                infoWindow.setContent(infoWindowContent[i][0]);
 +
                infoWindow.open(map, marker);
 +
            }
 +
        })(marker, i));
  
−
jQuery(document).ready(function() {
+
        // Automatically center the map fitting all markers on the screen
−
  jQuery('#map').CustomMap();
+
        map.fitBounds(bounds);
−
});
+
    }
−
</script>
+
 
 +
    // Override our map zoom level once our fitBounds function runs (Make sure it only runs once)
 +
    var boundsListener = google.maps.event.addListener((map), 'bounds_changed', function(event) {
 +
        this.setZoom(14);
 +
        google.maps.event.removeListener(boundsListener);
 +
    });
 +
   
 +
}
 +
                      </script>
  
  

Revision as of 10:39, 3 September 2015

Peking iGEM 2015

Practices

Study how our work affects the world, and how the world affects our work.

Goal

Peking iGEM 2015 Team is trying to develop a new detection method based on the nucleic acid of pathogenic microorganism, with the aim of applying it to the diagnosis of pulmonary tuberculosis. It is worth considering for all the researchers of life sciences that how to put the achivements of the basic study into clinical practice. Human practice of Peking this year pays much attention to the identification of the clinical requirements, discussions on the feasibility of our project, and spread of knoweldge about tuberculosis and synthetic biology. By ultilizing the basic ideas of translational medicine, our team has set up a bridge between fundamental research and clinical practices.

Actions and Achievements

Investigation of the current epidemic situation of TB
We’ve interviewed clinicians both in research institute and basic-level hospitals, and researchers of Beijing Research Institute for TB Control. We’ve learned about the epidemic status of TB in China, front diagnostic techniques and their clinical applications. Besides, we’ve visited the central laboratory of Beijing Research Institute for TB Control, and discussed with their researchers on our project, acquiring valuable improvement suggestions.
Questionnaire survey
We’ve investigated common people about their awareness of tuberculosis and synthetic biology. Analysis of the results reminds us and the government of the urgency to propagandize knowledge of tuberculosis and synthetic biology. Low awareness rate of TB is the cause of high TB burden in China, and a lack of public understanding of synthetic biology will also be an obstacle for us to promote applications of this new subdiscipline in clinical medicine.
Team as a platform of we-media, new media and scientific popularization
This year our team does a lot of work to propagandize knowledge of TB and synthetic biology to both adults and school students, along with the construction of a network platform with more than ** followers. We’ve adopted various means of popularization such as handing out propagandistic handbooks, giving lectures, showing them around iGEM lab, and giving messages to our Wechat followers.
Ethetic discussions with the bioethicist
We’ve conducted a discussion on the ethical issues in synthetic biology and our project with Doctor Xie Guangkuan of the Institute of Medical Humanities of PKU. A comprehensive assessment on the ethical problems of our project has been achieved after the discussion.
Organization of CCiC
From August 14th to 15th, Conference of China iGEMer Committee (CCiC) was held in Peking University. 34 teams, more than 300 iGEMers from all over China have attended this meeting, making it an excellent academic meet-up in the history of iGEM in China.
An assessment of the economic aspect of our project