java 高德地图数据库_SpringBoot整合Mybatis实现高德地图定位并将数据存入数据库的步骤详解...

第一步配置yml文件

server:

port: 8080

spring:

datasource:

username: root

password: 123456

url: jdbc:mysql://localhost:3306/spring?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC

driver-class-name: com.mysql.cj.jdbc.Driver

thymeleaf:

cache: false

prefix: classpath:/templates/

suffix: .html

encoding: UTF-8

content-type: text/html

mode: HTML5

mybatis:

mapper-locations: classpath:mapping/GaoDe.xml

type-aliases-package: car2021.winter.com.demo.entity

logging:

file:

name: car2021.winter.log

第二步对Mybatis进行配置，并将实体映射。

insert into GaoDe (time ,Longitude,Latitude,Position) values(#{time},#{Longitude},#{Latitude},#{Position})

第三步写HTML，并引入自己的高德API(需要申请key)

高德地图

body {

margin: 0;

height: 100%;

width: 100%;

position: absolute;

font-size: 12px;

}

#mapContainer {

position: absolute;

top: 0;

left: 0;

right: 0;

bottom: 0;

}

#tip {

background-color: #fff;

border: 1px solid #ccc;

padding-left: 10px;

padding-right: 2px;

position: absolute;

min-height: 65px;

top: 10px;

font-size: 12px;

right: 10px;

border-radius: 3px;

overflow: hidden;

line-height: 20px;

min-width: 400px;

}

#tip input[type="button"] {

background-color: #0D9BF2;

height: 25px;

text-align: center;

line-height: 25px;

color: #fff;

font-size: 12px;

border-radius: 3px;

outline: none;

border: 0;

cursor: pointer;

}

#tip input[type="text"] {

height: 25px;

border: 1px solid #ccc;

padding-left: 5px;

border-radius: 3px;

outline: none;

}

#pos {

height: 70px;

background-color: #fff;

padding-left: 10px;

padding-right: 10px;

position: absolute;

font-size: 12px;

right: 10px;

bottom: 30px;

border-radius: 3px;

line-height: 30px;

border: 1px solid #ccc;

}

#pos input {

border: 1px solid #ddd;

height: 23px;

border-radius: 3px;

outline: none;

}

#result1 {

max-height: 300px;

}

当前位置

请输入关键字：

autocomplete="off"/>

点击提交坐标信息

鼠标左键在地图上单击获取坐标

X： Y：

value=""/>

var windowsArr = [];

var marker = [];

var mapObj = new AMap.Map("mapContainer", {

resizeEnable: true,

view: new AMap.View2D({

resizeEnable: true,

zoom: 13//地图显示的缩放级别

}),

keyboardEnable: false

});

var clickEventListener = AMap.event.addListener(mapObj, 'click', function (e) {

document.getElementById("lngX").value = e.lnglat.getLng();

document.getElementById("latY").value = e.lnglat.getLat();

AMap.plugin('AMap.Geocoder', function () {

var geocoder = new AMap.Geocoder({

city: "010"//城市，默认：“全国”

});

geocoder.getAddress(e.lnglat, function (status, result) {

if (status === 'complete') {

document.getElementById("keyword1").value = result.regeocode.formattedAddress;

} else {

alert("无法获取地址")

}

})

});

});

function commitGaoDe() {

var Longitude = document.getElementById("lngX").value;

var Latitude = document.getElementById("latY").value;

var positionArea = document.getElementById("keyword1").value;