2010.02.23——google map api----五岳剑派 拖拽的标注
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML ><HEAD><TITLE>五岳剑派</TITLE>
<script type="text/javascript" src="http://ditu.google.cn/maps?file=api&v=2&key=abcdefg&sensor=true_or_false"></script>
<SCRIPT type="text/javascript">
//<![CDATA[
// Copyright 2007 Google Inc.
// All Rights Reserved.
/**
* 这个例子演示了 Google 地图 API 的以下功能:
* * 可拖拽的标注
* * 自定义标注的图标
* * 计算地理距离
* * 事件处理（单击）
* * 消息提示窗口（气泡窗口）
* * 和文档模型(DOM)交互
*
* @author haogang
*/
var targets = [
{'name':'东岳泰山', 'pt':[36.207715, 117.144470], 'icon':'images/red'},
{'name':'西岳华山', 'pt':[34.525793, 110.048676], 'icon':'images/blue'},
{'name':'南岳衡山', 'pt':[27.293689, 112.806244], 'icon':'images/yellow'},
{'name':'北岳恒山', 'pt':[39.607804, 113.656311], 'icon':'images/purple'},
{'name':'中岳嵩山', 'pt':[34.523389, 113.005028], 'icon':'images/green'}
];
var markers = []; // 给用户拖拽的标注
var targetMarkers = []; // 显示正确答案的标注
var showAnswer = true; // 当前的视图模式（解题模式，答案模式）
var map; // 全局的 Google Map 控件
var error = 100; // 判断正误时允许的误差，以公里为单位
/**
* 在表格里显示图例，帮助用户了解不同标注的含义
*/
function loadTableItems() {
for (i = 0; i < targets.length; i++) {
document.write('<tr><td><img src="' + targets[i]['icon']
+ '.png"/> ' + targets[i]['name'] + '</td></tr>');
}
}
/**
* 在“解题模式”和“答案模式”间切换，同时也更改切换按钮的标签
*/
function switchMarkers() {
showAnswer = !showAnswer;
// 先清除掉当前的所有标注
map.clearOverlays();
// 再根据当前模式加入对应的标注
for (i = 0; i < targets.length; i++) {
map.addOverlay(showAnswer ? targetMarkers[i] : markers[i]);
}
var switcher = document.getElementById('switcher');
switcher.value = showAnswer ? '隐藏答案' : '显示答案';
}
/**
* 为气泡提示窗口创建 DOM 对象，包括地点的名称和简要描述
* @param {Number} i 该地点在 targets 数组中的下标
*/
function createInfoWindow(i) {
// 从网页的隐藏部分载入该地点的描述性文字
var targetDescs = document.getElementById('targetDescs');
var desc = targetDescs.getElementsByTagName('div')[i].innerHTML;
// 为气泡提示窗口创建动态 DOM 对象，这里我们用 DIV 标签
var div = document.createElement('div');
div.innerHTML = '<div style="font-size: 9pt; width:300px"><b>'
+ targets[i]['name'] + '</b><br/>' + desc + '</div>';
// 当用户关闭气泡时 Google Map API 会自动释放该对象
return div;
}
/**
* 本函数为每个地点创建两个标注：一个给用户拖拽，另一个显示标准答案
* @param {Number} i 该地点在 targets 数组中的下标
*/
function createMarker(i) {
// 先创建给用户拖拽的标注：一开始它们依次排列在地图的左上角
// 下一行代码演示了如何将 map 控件的像素坐标转化为经纬度
var initPt = map.fromContainerPixelToLatLng(new GPoint((i + 1) * 30, 50));
var ico = new GIcon(G_DEFAULT_ICON, targets[i]['icon'] + '.png');
// 参数 draggable: true 表示可拖拽
markers.push(new GMarker(initPt, { draggable: true, icon: ico }));
// 再创建正确答案的标注：将它们放在正确的位置上，而且是不可拖拽的
var targetPt = new GLatLng(targets[i]['pt'][0], targets[i]['pt'][1]);
var marker = new GMarker(targetPt, { icon: new GIcon(ico) });
targetMarkers.push(marker);
// 为正确答案标注添加事件处理函数：用户单击它时会弹出气泡提示
GEvent.addListener(marker, 'click',
function() {
marker.openInfoWindow(createInfoWindow(i));
}
);
}
/**
* 比较用户的答案和正确答案，并给用户打分
*/
function judge() {
var correct = 0;
for (i = 0; i < targets.length; i++) {
// 获得对应的两个坐标，并求出它们的距离 dist （以米为单位）
var target = new GLatLng(targets[i]['pt'][0], targets[i]['pt'][1]);
var marker = markers[i].getPoint();
var dist = target.distanceFrom(marker);
// 根据误差判断正误，并根据正误将标注的图标切换为“勾”或“差”
if (dist > error * 1000) {
markers[i].getIcon().image = targets[i]['icon'] + '_cross.png';
} else {
markers[i].getIcon().image = targets[i]['icon'] + '_tick.png';
correct++;
}
}
// 计算得分（正确率）
var score = document.getElementById('score');
score.innerHTML = correct * 100 / targets.length;
// 保证切换到“解题模式”，用户才能看到图标的变化，从而知道哪些错了
if (showAnswer) {
switchMarkers();
} else {
// 刷新地图：必须重新添加标注，才能反映图标的变化
for (i = 0; i < targets.length; i++) {
map.removeOverlay(markers[i]);
map.addOverlay(markers[i]);
}
}
}
/**
* 创建地图控件，以及两组标注
*/
function load() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById('map'));
// 将视图移到中国
map.setCenter(new GLatLng(37, 107), 4);
// 为 targets 数组中的每个地点，创建两个标注
for (i = 0; i < targets.length; i++) {
createMarker(i);
}
// 进入“解题模式”
switchMarkers();
}
}
//]]>
</SCRIPT>
<META content="MSHTML 6.00.3790.4357" name="GENERATOR"></HEAD>
<BODY onload="load()" onunload="GUnload()">
<TABLE width="100%">
<TBODY>
<TR>
<TD style="WIDTH: 700px">
<DIV id="map" style="WIDTH: 700px; HEIGHT: 500px"></DIV></TD>
<TD vAlign="top"><B>请在地图中标出以下位置：</B><BR>
<HR>
<TABLE id="targetList" width="100%">
<TBODY>
<SCRIPT
type="text/javascript">
loadTableItems();
</SCRIPT>
</TBODY></TABLE>
<HR>
<INPUT onclick="judge()" type="button" value="评判"> <INPUT id="switcher" onclick="switchMarkers()" type="button" value="switcher">
<HR>
<B>得分：<SPAN id="score" style="COLOR: red"></SPAN></B> </TD></TR></TBODY></TABLE>
<DIV id="targetDescs" style="DISPLAY: none">
<DIV>位于山东省泰安县境的泰山，又称“岱宗”、“岱”即大山，“岱”为长辈，意即：泰山是中国大山的长辈。泰山雄踞于山东省中部，海拔1545米。 </DIV>
<DIV>西岳华山位于西安市东120公里处的华阴县城南，海拔2200米，以奇险峻秀著称，素称“天下奇险第一山”，也是著名的道教圣地之一。 </DIV>
<DIV>衡山又称南岳，位于湖南省衡山县，山势雄伟，绵延数百公里。七十二峰中以祝融、天柱、芙蓉、紫盖、石 五峰最有名。最高峰为祝融峰，海拔1290米。
</DIV>
<DIV>五岳中以北岳恒山最高，位于山西省浑源县城南四公里处，绵延150余公里。主峰天峰领海拔2017米。高耸入云，给人以顶天立地之感。 </DIV>
<DIV>中岳嵩山，位于河南省登峰县境，因地处中原，古称“中岳”。其主峰峻极峰海拔1584米。 山峰多寺也多，有“上有七十二峰、下有七十寺”之说。
</DIV></DIV></BODY></HTML>
分享到：
相关推荐
android studio下载
【新质生产力】新质生产力赋能智能制造数字化解决方案.pptx
基于matlab实现的用于应用布格重力异常数据反演地下异常密度体.rar
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
无人机最强算法源码，易于部署和学习交流使用
数据库课程设计后端 使用Springboot + Mybatis + Redis + Maven 数据库课程设计实战.zip，使用到了所有的相关SQL 的操作，如增删改查等，让你可以在一个项目里面，锻炼到所有的数据库相关的知识。项目亲测可以运行，里面含有运行相关的文档，不会的可以丝我请求帮助。 数据库课程设计后端 使用Springboot + Mybatis + Redis + Maven 具体的表和相关的数据如下： 用户（电话号码，密码，身份证号，邮箱，真实姓名，用户类型，性别，地址） 乘客（用户电话号码，乘客身份证号，乘客真实姓名，乘客电话号码，乘客类型，地址） 列车信息（列车编号，车次，列车类型，列车车厢数，列车始发站，列车终点站，列车开车时间，列车到达时间，列车到达日期，列车运行时间，列车状态） 列车座位信息（列车编号，车厢号，座位类型，座位数） 列车经停信息（列车编号，车次，车站编号，车站名，到达时间，总运行时间，开车时间） 订单信息（订单编号，用户电话号码，乘客身份证号码，列车编号，出发站编号，到达站编号，车厢号，座位编号，订单创建时间，订单状态，开车时间）
咨询的分析方法gl.ppt
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
These're the OpenMV codes written by microPython in 2019 NUEDC. 2019年电赛无人机题目（B题）OpenMV相关代码（原创）.zip
无人机最强算法源码，易于部署和学习交流使用
熊出没.zip
基于SpringBoot和Vue的家教信息平台设计与实现.zip 有完整的部署指导文档，源码也是完整的，可以直接运行，里面包含了所有的相关步骤。 本文旨在设计和实现一套基于Java技术的家教信息系统，采用Spring Boot框架构建后端服务，MySQL数据库存储数据，Vue.js作为前端框架实现用户界面。该系统旨在解决家教信息管理的问题，包括家教师资信息管理、用户信息管理以及家教入驻等功能。通过综合运用Java、Spring Boot、MySQL和Vue等技术，实现了系统的高效运行和良好的用户体验。系统提供了用户注册、登录、信息查看和编辑等功能，同时支持家教的发布和查看，用户信息的管理以及家教审核的后台管理。家长可以方便地寻找合适的家教老师，家教老师也能够更便捷地管理自己的信息和相关资料。通过本设计，展示了Java技术在现代化家教信息系统中的应用，为家教行业的信息化管理提供了一种有效的解决方案。该系统的设计与实现将为家长、家教老师和用户提供便利，促进家教行业的发展与进步。 关键词：SpringBoot; MySQL; 系统设计; 家教
无人机最强算法源码，易于部署和学习交流使用
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
（R语言）-6-箱线图的绘制
麦肯锡-xx联通固定市场举措gl.ppt
附件是在PyCharm中配置Python环境步骤，文件绿色安全，请大家放心下载，仅供交流学习使用，无任何商业目的！
本课程实验分为数字集成电路设计实验与全定制设计实验两部分。 实验1—4为基于Cadence的数字集成电路设计实验部分，主要内容为通过一个简单数字低通滤波器的设计、综合、仿真，让学生熟悉数字集成电路前段实际设计流程，以培养学生实际设计集成电路的能力。具体为：实验1Matlab实现数字低通滤波器算法设计。 实验2Linux环境下基本操作。 实验3RTLCompiler对数字低通滤波器电路的综合。 实验4NC对数字低通滤波器电路的仿真。 其中，实验1主要目的是为了展示算法分析的方法和重要性。使用Matlab实现数字滤波器的算法设计和HDL代码生成。由于Matlab工具可以在Windows环境下工作，而其他集成电路EDA工具均需要在linux下工作，故建议本实验在课堂演示和讲述，学生课下练习。实验2的主要目的是学习linux下的基本操作。包括目录管理、文件管理、文件编辑以及文件压缩等在使用集成电路EDA工具时所需要的操作。本实验是实验3和实验4的基础，建议在实验室完成。
一、简介 基于Transformer模型构建的聊天机器人，可实现日常聊天。 二、系统说明 2.1 功能介绍 使用者输入文本后，系统可根据文本做出相应的回答。 2.2 数据介绍 * 百度中文问答 WebQA数据集 * 青云数据集 * 豆瓣数据集 * chatterbot数据集 由于数据集过大，因此不会上传，如有需要可以在issue中提出。 2.3. 模型介绍（v1.0版本） 基于Transformer模型，使用Python中的keras-transformer包。 训练的参数文件没有上传，如有需要可在issue中提出。 三、注意事项 * keras-transformer包需要自行安装：`pip install keras-transformer`。 * 如果需要实际运行，参数文件放在`ModelTrainedParameters`文件下；`ListData`文件下包含了已经处理好的字典等数据，不需要修改，直接运行Main.py即可。 * 如果需要自行训练，将数据集文件放在`DataSet`文件下。 * `HyperParameters.py`文件中包含了系统所需