use jquery, timemap 2.0.1, colorbox
This commit is contained in:
parent
a189a8dd1a
commit
f076cb743a
|
@ -8,14 +8,40 @@ $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.cn/maps?file=api&v=2&key='.$this->config->google->maps->api);
|
||||
//$this->headScript()->appendFile('http://maps.google.cN/maps?file=api&v=2&key='.$this->config->google->maps->api);
|
||||
$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();
|
||||
$this->headScript()->appendFile('/js/jquery-1.7.min.js');
|
||||
$this->headScript()->appendFile('/js/timemap.2.0.1/lib/mxn/mxn.js?(google)');
|
||||
$this->headScript()->appendFile('/js/timemap.2.0.1/timemap.pack.js');
|
||||
$this->headScript()->appendFile('/js/jquery.colorbox-min.js');
|
||||
$this->headLink()->appendStylesheet('/css/colorbox.css');
|
||||
?>
|
||||
var tm;
|
||||
window.onload=function() {
|
||||
|
||||
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>
|
||||
<script type="text/javascript" charset="utf-8">
|
||||
var tm;
|
||||
$(window).bind("load", function() { var timeout = setTimeout(function() { initLoader(); }, 100);});
|
||||
//$(window).bind("load", function() { var timeout = setTimeout(function() { gmaploaded(); }, 1000);});
|
||||
function loadMaps() {
|
||||
google.load("maps", "2", {"callback" : tmloaded,"base_domain": "ditu.google.cn"});
|
||||
}
|
||||
|
||||
function initLoader() {
|
||||
var script = document.createElement("script");
|
||||
script.src = "https://www.google.com/jsapi?key=<?php echo $this->config->google->maps->api; ?>&callback=loadMaps";
|
||||
script.type = "text/javascript";
|
||||
document.getElementsByTagName("head")[0].appendChild(script);
|
||||
}
|
||||
function tmloaded() {
|
||||
tm = TimeMap.init({
|
||||
mapId: "map", // Id of map div element (required)
|
||||
timelineId: "timeline", // Id of timeline div element (required)
|
||||
|
@ -59,7 +85,7 @@ window.onload=function() {
|
|||
"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=/service/thumb/id/<?php echo $row['id']; ?> />"
|
||||
"infoHtml": "<a href=/data/<?php echo $row['uuid']; ?>><?php echo $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']; ?>\"});' />"
|
||||
}
|
||||
},
|
||||
<?php endforeach; ?>
|
||||
|
@ -74,10 +100,4 @@ window.onload=function() {
|
|||
});
|
||||
// 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>
|
||||
</script>
|
Loading…
Reference in New Issue