## 一、前言说明
一般的地图厂家会提供三种类型的地图，街道图、卫星图、混合图，其中街道图就是带了路网的常规地图，卫星图是没有路网的，混合图是带了路网的卫星图，其实路网图一般都是叠加上去的，所有地图厂家都提供了叠加图层的功能，意味着在街道图上还可以叠加卫星图等，只不过一般不会这么用，一般都是在街道图上叠加路况图，卫星图上叠加路网图形成混合图。天地图比较特殊，还有个地形图，杂交下来相当于有六种地图，包括矢量底图、矢量注记、影像底图、影像注记、地形底图、地形注记。
地图样式功能用的很少，一般用户都是选择默认样式风格，最多就有个暗黑色的护眼模式，地图厂商有些会内置一些风格，后期都提供了非常强大的自定义样式的，绑定在自己的秘钥下，需要自己去地图管理后台配置好对应的样式。
## 二、效果图

## 三、相关代码
```cpp
#include "frmmapdemoother.h"
#include "ui_frmmapdemoother.h"
#include "qthelper.h"
#include "maphelper.h"
frmMapDemoOther::frmMapDemoOther(QWidget *parent) : QWidget(parent), ui(new Ui::frmMapDemoOther)
{
ui->setupUi(this);
this->initForm();
}
frmMapDemoOther::~frmMapDemoOther()
{
delete ui;
}
void frmMapDemoOther::initForm()
{
}
void frmMapDemoOther::loadMapStyle(int mapCore)
{
MapHelper::loadMapStyle(ui->cboxMapStyle, (MapCore)mapCore);
}
void frmMapDemoOther::receiveDataFromJs(const QString &type, const QVariant &data)
{
//不可见不用继续/说明不是本界面的操作触发的
if (!this->isVisible()) {
return;
}
QString result = data.toString();
if (type == "zoom") {
QString info = QString("当前地图缩放: %1").arg(result);
QtHelper::showMessageBoxInfo(info);
} else if (type == "center") {
QString point = MapHelper::getLngLat2(result);
ui->txtPointCenter->setText(point);
} else if (type == "bounds") {
MapHelper::loadMapBounds(result, ui->txtPointLeftBottom, ui->txtPointRightTop, ui->txtPointCenter);
} else if (type == "rotate") {
QString info = QString("当前旋转角度: %1").arg(result);
QtHelper::showMessageBoxInfo(info);
} else if (type == "tilt") {
QString info = QString("当前倾斜角度: %1").arg(result);
QtHelper::showMessageBoxInfo(info);
}
}
void frmMapDemoOther::on_btnGetZoom_clicked()
{
emit runJs("getCenter()");
emit runJs("getZoom()");
}
void frmMapDemoOther::on_btnGetBounds_clicked()
{
emit runJs("getBounds()");
}
void frmMapDemoOther::on_cboxMapType_currentIndexChanged(int index)
{
emit runJs(QString("setMapType(%1)").arg(index));
}
void frmMapDemoOther::on_cboxMapStyle_currentIndexChanged(int index)
{
QString style = ui->cboxMapStyle->itemData(index).toString();
emit runJs(QString("setMapStyle('%1')").arg(style));
}
void frmMapDemoOther::on_btnSetRotate_clicked()
{
#ifndef webengine
//QtHelper::showMessageBoxError("当前浏览器内核不支持地图旋转\n请用Qt自带的webengine浏览器内核");
//return;
#endif
emit runJs(QString("setRotate(%1)").arg(ui->sboxRotate->value()));
}
void frmMapDemoOther::on_btnGetRotate_clicked()
{
emit runJs("getRotate()");
}
void frmMapDemoOther::on_btnSetTilt_clicked()
{
#ifndef webengine
//QtHelper::showMessageBoxError("当前浏览器内核不支持地图倾斜\n请用Qt自带的webengine浏览器内核");
//return;
#endif
emit runJs(QString("setTilt(%1)").arg(ui->sboxTilt->value()));
}
void frmMapDemoOther::on_btnGetTilt_clicked()
{
emit runJs("getTilt()");
}
```
## 四、相关地址
1. 国内站点：[https://gitee.com/feiyangqingyun](https://gitee.com/feiyangqingyun)
2. 国际站点：[https://github.com/feiyangqingyun](https://github.com/feiyangqingyun)
3. 个人作品：[https://blog.csdn.net/feiyangqingyun/article/details/97565652](https://blo