Skip to content

Commit 14146c4

Browse files
ryotayamanakaryotayamanaka
authored
add 'change tile layer for the basemap' demo (oracle-samples#139)
1 parent 14fa8a1 commit 14146c4

10 files changed

+2051
-1658
lines changed

‎spatial/mvc-map-api/demos/h/change_tilelayers.html

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Demo: Change tile layers</title>
5+
<link rel="stylesheet" type="text/css" href="../css/a.css">
6+
<script type="text/javascript" src="../../jquery/jquery-3.5.1.min.js"></script>
7+
<script type="text/javascript">
8+
$(document).ready(function(){
9+
$("#navigation").load("shared_links.html");
10+
11+
$('.map_iframe').css('height', $('#content').height()*0.8+'px');
12+
$('.map_iframe').css('width', $('#content').width()+'px');
13+
});
14+
</script>
15+
</head>
16+
<body>
17+
<span class="header"><img src="../css/images/oracle.png"> Maps API Demos</span>
18+
<hr class="oj-hr">
19+
20+
<div id="container">
21+
<div id="navigation"></div>
22+
<div id="content" class="panel">
23+
<table>
24+
<tr>
25+
<td>
26+
<iframe src="../u/change_tilelayers.html" class="map_iframe" height="950" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"> </iframe>
27+
</td>
28+
</tr>
29+
</table>
30+
</div>
31+
<div class="clear" style="height:1px">
32+
</div>
33+
</div>
34+
</body>
35+
</html>

‎spatial/mvc-map-api/demos/h/shared_links.html

Lines changed: 84 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,84 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<hr>
4-
<table width="90%">
5-
<tr>
6-
<td><span><A href="tileLayer.html">Oracle Maps</A></span></td>
7-
<td><A target="_blank" href="../u/tileLayer.html"><img src="../css/images/htmlfile_16.png"></A></td>
8-
</tr>
9-
<tr>
10-
<td><span><A href="tileLayer_custom.html">Custom Tile Layer</A></span></td>
11-
<td><A target="_blank" href="../u/tileLayer_custom.html"><img src="../css/images/htmlfile_16.png"></A></td>
12-
</tr>
13-
<tr>
14-
<td><span><A href="tileLayer_offline.html">Offline Tile Layer</A></span></td>
15-
<td><A target="_blank" href="../u/tileLayer_offline.html"><img src="../css/images/htmlfile_16.png"></A></td>
16-
</tr>
17-
<tr>
18-
<td><span><A href="tileLayer_here.html">HERE Maps</A></span></td>
19-
<td><A target="_blank" href="../u/tileLayer_here.html"><img src="../css/images/htmlfile_16.png"></A></td>
20-
</tr>
21-
<tr>
22-
<td><span><A href="tileLayer_osm.html">OSM Maps</A></span></td>
23-
<td><A target="_blank" href="../u/tileLayer_osm.html"><img src="../css/images/htmlfile_16.png"></A></td>
24-
</tr>
25-
</table>
26-
27-
<hr>
28-
29-
<table width="90%">
30-
31-
<tr>
32-
<td><span><A href="jdbc_states_labels.html">Vector Layer (JDBC)</A></span></td>
33-
<td><A target="_blank" href="../u/jdbc_states_labels.html"><img src="../css/images/htmlfile_16.png"></A></td>
34-
</tr>
35-
36-
<tr>
37-
<td><span> <A href="datapack.html">Vector Layer (DATAPACK)</A></span></td>
38-
<td><A target="_blank" href="../u/datapack.html"><img src="../css/images/htmlfile_16.png"></A></td>
39-
</tr>
40-
41-
<tr>
42-
<td><span> <A href="styleBinding2.html">Vector Layer Style Binding</A></span></td>
43-
<td><A target="_blank" href="../u/styleBinding2.html"><img src="../css/images/htmlfile_16.png"></A></td>
44-
</tr>
45-
<tr>
46-
<td><span> <A href="state_county_drilldown.html">Vector Layer Drill Down</A></span></td>
47-
<td><A target="_blank" href="../u/state_county_drilldown.html"><img src="../css/images/htmlfile_16.png"></A></td>
48-
</tr>
49-
<tr>
50-
<td><span> <A href="alta_peak_trail.html">Alta Peak Trail</A></span></td>
51-
<td><A target="_blank" href="../u/alta_peak_trail.html"><img src="../css/images/htmlfile_16.png"></A></td>
52-
</tr>
53-
</table>
54-
55-
<hr>
56-
57-
<table width="90%">
58-
<tr>
59-
<td><span><A href="dtl_jdbc.html">Dynamic Tile Layer</A></span></td>
60-
<td><A target="_blank" href="../u/dtl_jdbc.html"><img src="../css/images/htmlfile_16.png"></A></td>
61-
</tr>
62-
</table>
63-
64-
<hr>
65-
66-
<table width="90%">
67-
<tr>
68-
<td><span><A href="geom_edit.html">Geometry Editing</A></span></td>
69-
<td><A target="_blank" href="../u/geom_edit.html"><img src="../css/images/htmlfile_16.png"></A></td>
70-
</tr>
71-
</table>
72-
73-
<hr>
74-
75-
<table width="90%">
76-
77-
</table>
78-
79-
80-
</html>
1+
<!DOCTYPE html>
2+
<html>
3+
<hr>
4+
<table width="90%">
5+
<tr>
6+
<td><span><A href="tileLayer.html">Oracle Maps</A></span></td>
7+
<td><A target="_blank" href="../u/tileLayer.html"><img src="../css/images/htmlfile_16.png"></A></td>
8+
</tr>
9+
<tr>
10+
<td><span><A href="tileLayer_custom.html">Custom Tile Layer</A></span></td>
11+
<td><A target="_blank" href="../u/tileLayer_custom.html"><img src="../css/images/htmlfile_16.png"></A></td>
12+
</tr>
13+
<tr>
14+
<td><span><A href="tileLayer_offline.html">Offline Tile Layer</A></span></td>
15+
<td><A target="_blank" href="../u/tileLayer_offline.html"><img src="../css/images/htmlfile_16.png"></A></td>
16+
</tr>
17+
<tr>
18+
<td><span><A href="tileLayer_here.html">HERE Maps</A></span></td>
19+
<td><A target="_blank" href="../u/tileLayer_here.html"><img src="../css/images/htmlfile_16.png"></A></td>
20+
</tr>
21+
<tr>
22+
<td><span><A href="tileLayer_osm.html">OSM Maps</A></span></td>
23+
<td><A target="_blank" href="../u/tileLayer_osm.html"><img src="../css/images/htmlfile_16.png"></A></td>
24+
</tr>
25+
</table>
26+
27+
<hr>
28+
29+
<table width="90%">
30+
31+
<tr>
32+
<td><span><A href="jdbc_states_labels.html">Vector Layer (JDBC)</A></span></td>
33+
<td><A target="_blank" href="../u/jdbc_states_labels.html"><img src="../css/images/htmlfile_16.png"></A></td>
34+
</tr>
35+
36+
<tr>
37+
<td><span> <A href="datapack.html">Vector Layer (DATAPACK)</A></span></td>
38+
<td><A target="_blank" href="../u/datapack.html"><img src="../css/images/htmlfile_16.png"></A></td>
39+
</tr>
40+
41+
<tr>
42+
<td><span> <A href="styleBinding2.html">Vector Layer Style Binding</A></span></td>
43+
<td><A target="_blank" href="../u/styleBinding2.html"><img src="../css/images/htmlfile_16.png"></A></td>
44+
</tr>
45+
<tr>
46+
<td><span> <A href="state_county_drilldown.html">Vector Layer Drill Down</A></span></td>
47+
<td><A target="_blank" href="../u/state_county_drilldown.html"><img src="../css/images/htmlfile_16.png"></A></td>
48+
</tr>
49+
<tr>
50+
<td><span> <A href="alta_peak_trail.html">Alta Peak Trail</A></span></td>
51+
<td><A target="_blank" href="../u/alta_peak_trail.html"><img src="../css/images/htmlfile_16.png"></A></td>
52+
</tr>
53+
</table>
54+
55+
<hr>
56+
57+
<table width="90%">
58+
<tr>
59+
<td><span><A href="dtl_jdbc.html">Dynamic Tile Layer</A></span></td>
60+
<td><A target="_blank" href="../u/dtl_jdbc.html"><img src="../css/images/htmlfile_16.png"></A></td>
61+
</tr>
62+
</table>
63+
64+
<hr>
65+
66+
<table width="90%">
67+
<tr>
68+
<td><span><A href="geom_edit.html">Geometry Editing</A></span></td>
69+
<td><A target="_blank" href="../u/geom_edit.html"><img src="../css/images/htmlfile_16.png"></A></td>
70+
</tr>
71+
<tr>
72+
<td><span><A href="change_tilelayers.html">Change Tile Layers</A></span></td>
73+
<td><A target="_blank" href="../u/change_tilelayers.html"><img src="../css/images/htmlfile_16.png"></A></td>
74+
</tr>
75+
</table>
76+
77+
<hr>
78+
79+
<table width="90%">
80+
81+
</table>
82+
83+
84+
</html>

‎spatial/mvc-map-api/demos/u/alta_peak_trail.html

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
1-
<!DOCTYPE html>
2-
<html>
3-
<head>
4-
<title>Map API Demo: Alta Peak Trail</title>
5-
<meta charset="UTF-8">
6-
<meta name="viewport" content="width=device-width">
7-
<script language="JavaScript" src="https://elocation.oracle.com/mapviewer/jslib/v19.1/oraclemapsv2.js"></script>
8-
<script type="text/javascript" src="js/alta_peak_trail.js"></script>
9-
<script type="text/javascript">
10-
OM.gv.setResourcePath("https://elocation.oracle.com/mapviewer/jslib/v19.1");
11-
$(document).ready( function(){
12-
showMap();
13-
});
14-
</script>
15-
</head>
16-
<body>
17-
<div id="map" style=" position: absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden;"></div>
18-
</body>
19-
</html>
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Map API Demo: Alta Peak Trail</title>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width">
7+
<script language="JavaScript" src="https://elocation.oracle.com/mapviewer/jslib/v19.1/oraclemapsv2.js"></script>
8+
<script type="text/javascript" src="js/alta_peak_trail.js"></script>
9+
<script type="text/javascript">
10+
OM.gv.setResourcePath("https://elocation.oracle.com/mapviewer/jslib/v19.1");
11+
$(document).ready( function(){
12+
showMap();
13+
});
14+
</script>
15+
</head>
16+
<body>
17+
<div id="map" style=" position: absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden;"></div>
18+
</body>
19+
</html>

‎spatial/mvc-map-api/demos/u/change_tilelayers.html

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Map API Demo: Change Tile Layers</title>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width">
7+
<script type="text/javascript" src="https://elocation.oracle.com/mapviewer/jslib/v2.3/oraclemapsv2.js"></script>
8+
<script type="text/javascript" src="js/change_tilelayers.js"></script>
9+
<script type="text/javascript">
10+
$(document).ready( function(){
11+
showMap();
12+
});
13+
</script>
14+
</head>
15+
<body>
16+
<div style=" position: absolute; left:0px; top:0px; width:100%; height:800px; overflow:hidden;">
17+
<table style="width:100%">
18+
<tr>
19+
<td width="100%">
20+
<div id="map" style="width:100%;height:600px"></div>
21+
</td>
22+
</tr>
23+
<tr>
24+
<td height="20%">
25+
<!--a nested table-->
26+
<table style="width:100%">
27+
<tr>
28+
<th align="">Tile Layer</th>
29+
<th>Vector Layer</th>
30+
</tr>
31+
<tr>
32+
<td height="20%">
33+
<div id="selection3">
34+
<fieldset id="group3">
35+
Select tile layer as basemap<br>
36+
<input type="radio" id="radioBtn31" name="group3" onmouseup="radio_selTileLayer(this);" /> Oracle Maps<br>
37+
<input type="radio" id="radioBtn32" name="group3" onmouseup="radio_selTileLayer(this);" /> BI World Maps<br>
38+
<input type="radio" id="radioBtn33" name="group3" onmouseup="radio_selTileLayer(this);" /> OSM Positron<br>
39+
<input type="radio" id="radioBtn34" name="group3" onmouseup="radio_selTileLayer(this);" /> OSM Dark<br>
40+
</fieldset>
41+
</div>
42+
</td>
43+
<td height="20%">
44+
<div id="selection2">
45+
<fieldset id="group2">
46+
Select vector layer<br>
47+
<input type="checkBox" id="checkBox21" name="group2" onmouseup="checkBox_Toggle(this);" /> States<br>
48+
<input type="checkBox" id="checkBox22" name="group2" onmouseup="checkBox_Toggle(this);" /> Counties<br>
49+
<input type="checkBox" id="checkBox23" name="group2" onmouseup="checkBox_Toggle(this);" /> Cities<br>
50+
<input type="checkBox" id="checkBox24" name="group2" onmouseup="checkBox_Toggle(this);" /> Customers<br>
51+
</fieldset>
52+
</div>
53+
</td>
54+
</tr>
55+
56+
<tr>
57+
<td>
58+
This demo illustrates how to change the tile layers as basemaps.
59+
</td>
60+
</tr>
61+
</table>
62+
</td>
63+
</tr>
64+
</table>
65+
</div>
66+
</body>
67+
68+
</html>

0 commit comments

Comments
 (0)