QWebView + JS 实现简单地图

最新推荐文章于 2017-08-29 10:57:30 发布
最新推荐文章于 2017-08-29 10:57:30 发布
阅读量1.8k 收藏 3
点赞数
分类专栏： Qt
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fuyunzhishang1/article/details/43952011
版权 

直接上代码：
map.html

<span style="font-family: Arial, Helvetica, sans-serif;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"></span>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">
        body, html, #allmap {
            width: 100%;
            height: 100%;
            overflow: hidden;
            margin: 0;
        }

        #l-map {
            height: 100%;
            width: 78%;
            float: left;
            border-right: 2px solid #bcbcbc;
        }

        #r-result {
            height: 100%;
            width: 20%;
            float: left;
        }
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
    <title>百度地图的Hello, World</title>
</head>
<body>
    <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">

  /*  var map = new BMap.Map("allmap");            // 创建Map实例
    map.enableScrollWheelZoom();                            //启用滚轮放大缩小
    map.enableKeyboard();								//启用键盘控制
    var point = new BMap.Point(123.452155, 29.482552);    // 创建点坐标
    map.centerAndZoom("上海", 8);                     // 初始化地图,设置中心点坐标和地图级别。

    var marker1 = new BMap.Marker(new BMap.Point(123.452155, 29.482552));  // 创建标注
    map.addOverlay(marker1);
    var infoWindow1 = new BMap.InfoWindow("我在这哦!");
    marker1.addEventListener("click", function () { this.openInfoWindow(infoWindow1); });//给mark添加鼠标单击事件
    */
    var map = new BMap.Map("allmap");            // 创建Map实例  
    initialize();
    function location1(s1, s2) {					//根据经纬度定位
        map.clearOverlays();
        var point = new BMap.Point(s1, s2);
        var marker2 = new BMap.Marker(point); // 创建标注
        marker2.enableDragging();
        var title = "经度：" + marker2.getPosition().lng + " " + "纬度 :" + marker2.getPosition().lat;
        marker2.setTitle(title);

        var menu = new BMap.ContextMenu();
        menu.addItem(new BMap.MenuItem("点我", function () { alert("You are welcome !");}));
        marker2.addContextMenu(menu);

        map.addOverlay(marker2);
        map.centerAndZoom(point, 10);
    }

     function locationBycity(ss) {					//查找某个城市
		initialize();
        map.clearOverlays();
        map.centerAndZoom(ss);
		return true;
    }

    var local = new BMap.LocalSearch(map, {
        renderOptions: { map: map, autoViewport: true }
    });

    function findCity(name) {		//查找某个城市
        local.search(name);
    }
	
	function lookBy3D(lng,lat,city) {			//显示城市3D图形
	    map.clearOverlays();
		map.setCurrentCity(city);  //设置当前城市
		var point = new BMap.Point(lng, lat);  // 创建点坐标
		map.centerAndZoom(point, 18);                 // 初始化地图，设置中心点坐标和地图级别
		
		map.setMapType(BMAP_PERSPECTIVE_MAP);     //修改地图类型为3D地图
	}

    function initialize() {
        //---------------------------------------------基础示例---------------------------------------------  
        //map.centerAndZoom(new BMap.Point(116.4035,39.915),15);  //初始化时，即可设置中心点和地图缩放级别。
最低0.47元/天 解锁文章
Newtown-Gao
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Qt实现的百度在线地图与离线地图（利用QWebKit实现）
06-03
更新webkit离线地图，离线地图API包含v1.0和v1.3，嵌入式Qt实现百度在线地图与离线地图，利用QWebKit实现。功能包含：离线与在线切换，街道与卫星地图切换，坐标查找，添加坐标。其它功能后续更新，适合嵌入式Qt地图开发初学者参考。另附地图下载工具：全能地图下载器（未注册，下载后的图片会带有水印，可作学习利用），谢谢支持！
Qt实现的百度在线地图与离线地图（利用QWebEngine实现）
05-22
嵌入式Qt实现百度在线地图与离线地图，利用QWebEngine实现，其中包含Qt与js通信技术，如需使用QWebKit实现，方法逻辑类似。功能包含：离线与在线切换，街道与卫星地图切换，坐标查找，添加坐标。其它功能后续更新，适合嵌入式Qt地图开发初学者参考。另附地图下载工具：全能地图下载器（未注册，下载后的图片会带有水印，可作学习利用），谢谢支持！
调试QWebView中javascript代码的方法
战神无悔的专栏
07-17 3844
调试QWebView中javascript代码的方法在QT开发中经常遇到要在应用中嵌入网页的需求，一般情况下，我们用QT提供的QWebview。但是怎么调试网页代码以前没接触过，直到发现原来QT提供了调试工具inspector，具体方法放在下面以作备忘： QWebSettings *settings = ui.webView->settings(); settings->setAttribut
QT5.9.2 QWebEngineView实现百度离线地图示例
05-22
使用Qt5.9.2实现百度离线地图，可以用于离线地图的项目开发中。代码中给出了Qt给js发送数据和js给Qt发送数据的双向传递
高德地图之实例开发（一）加载地图
zhuzhu81的博客
08-29 1724
相信做地图开发的亲们，刚接触肯定第一反映，地图？怎么插入页面，怎么写。。。。然后就是百度。 那么这里就涉及一点，用什么地图？ 这里我给大家讲解的是高德地图详解，随后也会分享我自己的实例项目给到大家。 废话不多说，上图。 首先在html中我们需要一个盛装地图的容器，说白就是建个div给地图用，大家都知道div也就是个盒子 随后肯定就是要咬对这个div的样式进行修改 #mapCon
Qt QWebview调用JS，实现QQ邮箱自动填写输入框，模拟鼠标点击网页按钮！！
09-29
本篇文章将详细探讨如何利用Qt的QWebView组件与JavaScript交互，实现如标题所述的“QQ邮箱自动填写输入框以及模拟鼠标点击网页按钮”。 首先，QWebView是QtWebKit模块的一部分，它允许在Qt应用程序中嵌入一个Web...
WebViewToDos:简单的QWebView实用举例,通过QWebView实现一个任务提醒小工具,Qt5开发
06-26
Simple Todo-List in QWebView简单的QWebView实用举例,通过QWebView实现一个任务提醒小工具,Qt5开发.##使用说明本工具用于测试QWebView的使用,包括浏览器的设置,JS对象的注入,双向调用和访问工具的实用功能是按时间...
QT5使用百度地图实现经典经纬度查询
04-03
QT5使用百度地图实现经典经纬度查询的知识点涵盖了多个方面，包括QT框架的理解与应用、C++编程基础、网络通信以及地图API的使用。以下是对这些知识点的详细说明： 1. **QT框架**：QT是跨平台的应用程序开发框架，...
Qt例程源代码QWebView.7z
07-19
通过`QWebView`，开发者可以在Qt应用程序中轻松地集成Web内容，实现网页的加载、导航、以及与网页上的JavaScript代码通信。 ### QWebView的主要功能 1. **加载网页**：`QWebView`可以加载本地HTML文件或远程URL，...
Qt加载百度地图和谷歌地图
11-30
我们将主要关注如何利用QWebView类来实现地图的加载。 首先，让我们了解QWebView类。QWebView是QtWebKit模块的一部分，它允许我们在Qt应用程序中显示和操作Web内容。通过使用QWebView，我们可以加载HTML页面，执行...
QT调用Google map通过webkit在线显示地图
ltc785950614的专栏
01-08 3623
QT调用Google map通过webkit在线显示地图 改原理只是通过QT的webkit类，来显示Google map，然后通过JavaScript脚本将经纬度通过地图的标志（小红点）来显示当前的位置。不过想通过这个来实现定位误差还是比较大的。因为这个不能真正的算是调用Google的API进行定位。 具体工作比较简单主要是要找到JavaScript的Demo，网上很多资料
qt实现电子地图
B_zhang的专栏
01-06 5140
Qt电子地图？QGIS啊.<br /> 这个网址可以找到源代码，以及安装版。http://www.qgis.org/wiki/Download 这儿是QGIS官网http://www.qgis.org.
QT调用百度地图api
w1019220367的专栏
08-27 8998
整个流程参照： http://blog.csdn.net/lizuqingblog/article/details/18357721?utm_source=tuicool&utm_medium=referral 但是，参照该博客做出来的效果，无法显示地图。 查阅官方demo，修改了其中的一个参数： var map = new BMap.Map("container");
Qt4 QWebView的使用例子
热门推荐
ccf19881030的专栏
10-13 2万+
最近项目中使用QT4框架开发PC端软件，所以耐着性子学习了一下QT相关的东西。   下面是QT4中QWebView的使用方法，觉得蛮方便的。我使用的开发环境是：Win7+Qt 4,8,5开发库+qtcreator-2.8.0+VS2008编译器。   首先创建一个空的QT项目，取名字为：WebViewDemo   再创建一个main.cpp，代码如下： #include #include
WebView的放大与缩小－－－ 新发现的问题
tudusi
11-04 339
今天用到了WebView的放大与缩小： 加代码： wv.getSettings().setBuiltInZoomControls(true); //显示放大缩小 controler wv.getSettings().setSupportZoom(true); //可以缩放 wv.getSettings().setDefaultZoom(ZoomDensity.CLOSE);//默认缩...
QT QWebview 调用所加载网页中的JS函数
u013366022的专栏
03-30 4850
you should be able to execute your script using QWebFrame::evaluateJavaScript method. See if an example below would work for you: initializing webview: QWebView *view = new QWebView(this->centra
Qt QWebView百度地图导航
最新发布
05-01
要在Qt中使用百度地图导航，你可以使用QWebView来加载百度地图网页并与JavaScript交互。以下是一个简单的示例代码： ```cpp #include <QtWidgets/QApplication> #include <QtWebKitWidgets/QWebView> int main(int argc, char *argv[]) { QApplication a(argc, argv); QWebView webView; webView.load(QUrl("http://api.map.baidu.com/direction?origin=latlng:39.9887,116.4758|name:我的位置&destination=latlng:40.057406655722,116.29644071709|name:北京大学&mode=driving&region=北京&output=html&src=yourCompanyName|yourAppName")); webView.show(); return a.exec(); } ``` 在这个例子中，我们使用QWebView加载了一个百度地图导航的网页。你可以使用`load()`函数加载你想要的任何百度地图网页。在这个例子中，我们设置了起点和终点，以及导航模式和地区。你可以根据自己的需要修改这些参数。当网页加载完成后，用户可以在QWebView中浏览和操作地图。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值