westdc-zf1/application/default/views/scripts/yrnmr/timemap.phtml

81 lines
3.1 KiB
PHTML

<?php
$this->headTitle($this->config->title->site);
$this->headTitle($this->config->title->data);
$this->headTitle('时空导航');
$this->headTitle()->setSeparator(' - ');
$this->headLink()->appendStylesheet('/css/water.css');
$this->headScript()->appendFile('/js/OpenLayers.js');
$this->headScript()->appendFile('/js/timeline_var.js');
$this->headScript()->appendFile('/js/timeline_js/timeline-api.js');
$this->headScript()->appendFile('/js/timemap.2.0.1/lib/mxn/mxn.js?(openlayers)');
$this->headScript()->appendFile('/js/timemap.2.0.1/timemap.pack.js');
$this->nav[] = array('link'=>"/yrnmr",'title'=>'黄河上游宁蒙河段');
?>
<style>
img{max-width:none}
</style>
<?= $this->render('breadcrumbs.phtml'); ?>
<div class="row">
<div class="span2">
<?= $this->partial('yrnmr/navi.phtml'); ?>
</div>
<div class="span10">
<div id="timemap">
<div id="timeline" style="height:400px;border-bottom:1px solid #abc;"></div>
<div id="map" style="height:400px;"></div>
</div>
</div>
<script type="text/javascript" charset="utf-8">
$('#map').height($(window).height()/2);
$('#timeline').height($(window).height()/2);
$("html,body").animate({scrollTop:$('#timemap').offset().top},600);
var tm;
$(function() {
tm = TimeMap.init({
mapId: "map", // Id of map div element (required)
timelineId: "timeline", // Id of timeline div element (required)
scrollTo:"2012-01-01",
options: {
eventIconPath: "../images/"
},
datasets: [
{
id: "metadata",
title: "Metadata",
theme: "orange",
// note that the lines below are now the preferred syntax
type: "basic",
options: {
items: [
<?php
foreach($this->rows as $row) : ?>
{
"start" : "<?php echo $row['timebegin']; ?>",
<?php if ($row['timeend']!='') : ?>
"end" : "<?php echo $row['timeend']; ?>",
<?php endif; ?>
"point" :
{
"lat" : <?php echo ($row['south']+$row['north'])/2; ?>,
"lon" : <?php echo ($row['west']+$row['east'])/2; ?>
},
"title" : "<?php echo htmlspecialchars($row['title']); ?>",
"options" : {
"infoHtml": "<div class='info'><a href=/yrnmr/view/uuid/<?php echo $row['uuid']; ?>><?php echo htmlspecialchars($row['title']); ?></a><hr /><img src=/service/thumb/id/<?php echo $row['id']; ?> onclick='$.colorbox({photo:\"true\",href:\"/service/bigthumb/id/<?php echo $row['id']; ?>\"});' /></div>",
}
},
<?php endforeach; ?>
]
}
}
],
bandIntervals: [
Timeline.DateTime.MONTH,
Timeline.DateTime.YEAR
]
});
});
</script>