84 lines
3.6 KiB
PHTML
84 lines
3.6 KiB
PHTML
|
<?php
|
||
|
$this->headTitle($this->config->title->site);
|
||
|
$this->headTitle($this->config->title->data);
|
||
|
$this->headTitle('时空导航');
|
||
|
$this->headTitle()->setSeparator(' - ');
|
||
|
$this->headLink()->appendStylesheet('/css/metadata.css');
|
||
|
$this->breadcrumb('<a href="/">首页</a>');
|
||
|
$this->breadcrumb('<a href="/data">'.$this->config->title->data.'</a>');
|
||
|
$this->breadcrumb('<a href="/data/timeline">时空导航</a>');
|
||
|
$this->breadcrumb()->setSeparator(' > ');
|
||
|
$this->headScript()->appendFile('http://maps.google.com/maps?file=api&v=2&key=ABQIAAAACD-MqkkoOm60o_dvwdcKVhRBSKpgcP88GYi6r2Of16IkMX_4YhSBQsywCi4J2_fh4nBuWmK7gyRjLg');
|
||
|
$this->headScript()->appendFile('/js/timeline_var.js');
|
||
|
$this->headScript()->appendFile('/js/timeline_js/timeline-api.js');
|
||
|
$this->headScript()->appendFile('/js/timemap/timemap.js');
|
||
|
$this->headScript()->captureStart();
|
||
|
?>
|
||
|
var tm;
|
||
|
window.onload=function() {
|
||
|
tm = TimeMap.init({
|
||
|
mapId: "map", // Id of map div element (required)
|
||
|
timelineId: "timeline", // Id of timeline div element (required)
|
||
|
options: {
|
||
|
eventIconPath: "../images/"
|
||
|
},
|
||
|
datasets: [
|
||
|
{
|
||
|
id: "artists",
|
||
|
title: "Artists",
|
||
|
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; ?>
|
||
|
"polygon" : [
|
||
|
{
|
||
|
"lat" : <?php echo $row['south']; ?>,
|
||
|
"lon" : <?php echo $row['west']; ?>
|
||
|
},{
|
||
|
"lat" : <?php echo $row['north']; ?>,
|
||
|
"lon" : <?php echo $row['west']; ?>
|
||
|
},{
|
||
|
"lat" : <?php echo $row['north']; ?>,
|
||
|
"lon" : <?php echo $row['east']; ?>
|
||
|
},{
|
||
|
"lat" : <?php echo $row['south']; ?>,
|
||
|
"lon" : <?php echo $row['east']; ?>
|
||
|
},{
|
||
|
"lat" : <?php echo $row['south']; ?>,
|
||
|
"lon" : <?php echo $row['west']; ?>
|
||
|
}
|
||
|
],
|
||
|
"title" : "<?php echo $row['title']; ?>",
|
||
|
"options" : {
|
||
|
// set the full HTML for the info window
|
||
|
"infoHtml": "<a href=/data/<?php echo $row['uuid']; ?>><?php echo $row['title']; ?></a><hr /><img src=/data/thumb/id/<?php echo $row['id']; ?> />"
|
||
|
}
|
||
|
},
|
||
|
<?php endforeach; ?>
|
||
|
]
|
||
|
}
|
||
|
}
|
||
|
],
|
||
|
bandIntervals: [
|
||
|
Timeline.DateTime.MONTH,
|
||
|
Timeline.DateTime.DECADE
|
||
|
]
|
||
|
});
|
||
|
// manipulate the timemap further here if you like
|
||
|
}
|
||
|
window.onunload=GUnload();
|
||
|
<?php $this->headScript()->captureEnd(); ?>
|
||
|
<div id='tools'><?= $this->partial('data/tools.phtml'); ?></div>
|
||
|
<div id="timemap" style="clear:both;">
|
||
|
<div id="timeline" style="height:300px;width:100%;"></div>
|
||
|
<div id="map" style="height:300px;"></div>
|
||
|
</div>
|