### 地图组件就是添加地图样式的组件。点击“![](https://img.kancloud.cn/11/44/1144f49233281d716e1862bd89e8ef5f_39x32.png)”图标,再点击“地图”,即可创建新的图像,如图7.11;

![](https://img.kancloud.cn/00/3f/003fe84e3830d78c6ef117550db78bab_1182x609.png)

![](https://img.kancloud.cn/eb/b5/ebb56a16f485d6758ba33c80f763369e_801x40.png)

## **一、组件名称设置**

### 选中地图组件,在操作界面右侧的“图层名称”处可修改组件的名称,如图7.12。(名称最好要设置一下,方便后期组件管理)

![](https://img.kancloud.cn/8e/87/8e875ad7dfc40c1a11621666d8e8390e_1231x719.png)

![](https://img.kancloud.cn/a2/19/a219af29f8c24a2439ce9e01f60ecac5_799x43.png)

## **二、轮播**

### 选中该地图组件,在操作界面右侧,打开“开启轮播”开关,在“轮播时间”文本框中输入时间,来设置地图组件的轮播样式,如图7.13。

* ### 如果轮播时间想设为5秒,可在轮播时间的文本框中填写5000;

![](https://img.kancloud.cn/3b/b8/3bb8bcd7ac52e1b73a0c44bc4434ee62_1241x669.png)

![](https://img.kancloud.cn/91/c8/91c8080c2c42d3ee1c65e7303d618cad_793x39.png)

## **三、地图选择**

### 选中该地图组件,在操作界面右侧的“地图选择”处通过选择不同的地区来改变地图样式,如图7.14。

![](https://img.kancloud.cn/a1/55/a15503c4a3c8abd6ed3bba8ef123adb0_1261x759.png)

![](https://img.kancloud.cn/1f/95/1f954b730a837db3aef8304928027feb_789x36.png)

## **四、地图比例**

### 选中该地图组件,在操作界面右侧,拖动“地图比例”大小,来设置地图样式,如图7.15。

![](https://img.kancloud.cn/02/e5/02e5c5b62b22575fda39bde4d372c886_1112x753.png)

![](https://img.kancloud.cn/23/d1/23d1c893225a000ad2f1971a79cd5fae_801x40.png)

## **五、字体设置**

### 选中该地图,在操作界面右侧的“字体设置”处可修改地图组件的文字样式,如图7.16。

* ### 字体大小:文字的大小;

* ### 字体高亮颜色:鼠标点击的时候高亮显示的颜色;

* ### 字体颜色:文字的颜色;

![](https://img.kancloud.cn/82/c5/82c5e0a53ca9d40e626579df87d3efa8_1139x689.png)

![](https://img.kancloud.cn/b1/c4/b1c4157dc23cbcbc1b9d8f62447b71e3_803x42.png)

## **六、区域设置**

### 选中该地图组件,在操作界面右侧的“提示语设置”处可修改地图组件的提示语,如图7.17。

* ### 区域线:提示语的字体大小;

* ### 区域颜色:提示语的字体颜色;

* ### 区域高亮颜色:提示语的字体颜色;

![](https://img.kancloud.cn/de/ae/deae4c2896db1f26668a5f94fcd96bd6_1152x624.png)

![](https://img.kancloud.cn/64/58/64584b26ccce7d8df8ef6f0952951d6f_788x46.png)

## **七、边框颜色**

### 选中该地图组件,在操作界面右侧,通过设置边框颜色,来设置地图上区域之间的颜色样式,如图7.18。

![](https://img.kancloud.cn/6c/b2/6cb2fffb118d33c53547a2bed8f09c64_1094x718.png)

![](https://img.kancloud.cn/02/0b/020bee69cf9b36a8b6ccc6e7ecfc7303_803x36.png)

## **八、接口设置**

### 选中该漏斗图组件,在操作界面右侧,点击“![](https://img.kancloud.cn/5b/7b/5b7b521d49daa43bf957a43f3870dc71_342x76.png)”,可设置接口,如图7.19。

**备注:(1)接口只有广东有数据,可点广东,查看效果;(2)这里配置的都是最简单的柱形图样式,如果你想配置复杂的,请加官方交流群(群号码:769925425)咨询。**

### 1\. 数据类型

### 数据类型分为静态数据和动态数据;

* ### 静态数据:写死的数据;

* ### 动态数据:会随着接口传过来的数据实时变化;

### 2\. 接口地址

### (1)静态数据,接口地址传过来的内容要类似以下格式:

~~~

[{"name":"测试坐标1","value":1,"lng":118.30078125,"lat":36.91915611148194,"zoom":1},{"name":"测试坐标2","value":1,"lng":112.21435546875,"lat":37.965854128749434,"zoom":1}]

~~~

### (2)动态数据,接口地址传过来的内容要类似以下格式:

~~~

{"data":[{"name":"测试坐标1","value":1,"lng":118.30078125,"lat":36.91915611148194,"zoom":1},{"name":"测试坐标2","value":1,"lng":112.21435546875,"lat":37.965854128749434,"zoom":1}]}

~~~

### 3\. 刷新时间

### 这个参数主要针对动态数据设置的,完成数据的实时更新。

* ### 如果你想设置成5秒刷新一次,可以将刷新时间设置成“5000”;

### 4\. 刷新数据

### 这个参数主要是重新请求以下接口,完成数据的更新。

![](https://img.kancloud.cn/88/ad/88ad285a15d39d483c6f8c3788634f7c_346x437.png)

![](https://img.kancloud.cn/42/4e/424e153937ef0b3e65fe1cbe34fcaaef_800x46.png)

avue中地图使用实现地图的联动_7.1地图组件相关推荐

  1. 中国省市县联动地图,可更换成任意省,地图点击省市县下钻。可显示数据并根据数据大小标注不同颜色

    两类地图预览效果如下: 为了保证读者们都能理解透彻 我们先做中国地图省市县三级联动,再根据代码改成某个省的市县联动! 可用于大屏展示地图 地图可以是平面的也可以是3d的, 3d地图请参考我的另一篇文章 ...

  2. 经纬度坐标转换xy坐标 python_在Python中使用NewtonRaphson迭代将经纬度转换为xy Mollweide地图坐标...

    我试图编写一个程序,从用户那里获取一组经度和纬度坐标,将它们转换为Mollweide投影图的x&y坐标,然后报告这些坐标处的像素值(在本例中,是噪声温度).在 我使用的地图/数据是Haslam ...

  3. mapinfo在线地图插件_表格中如何可视化地址数据?用 SeaTable 的地图插件很方便...

    在一些有记录地址的表格里,如果只看文字信息,就很不直观.那么如何让表格里的地址在地图上直观地展示出来呢?SeaTable 最新版增加了地址列类型和地图插件.我们这里以员工信息表为例来说明这两个新功能如 ...

  4. arcgis 属性表 汇总_Arcgis中遥感影像地理配准、矢量化与地图制作

    目的: 将遥感图像进行地理配准.矢量化,并且制作地图. 要求: 对的遥感图像进行地理配准: 矢量化建筑物.绿地.道路.水体等主要地物要素: 对各类地物要素进行符号化设置并对其名称进行标注: 添加指北针 ...

  5. 侍魂微信第一个服务器,在游戏中,武者大大们来到的第一个地图叫什么名字?...

    在游戏中,武者大大们来到的第一个地图叫什么名字?(回答格式为:SH+答案,如答案是莉姆酱,则回复SH莉姆酱)这是侍魂胧月传说手游2019年7月23日微信问答试炼题目,答对侍魂手游的问答试炼可以获取兑换 ...

  6. DataGear 轻松制作支持图表联动的全国地图、省级地图数据可视化看板

    DataGear看板的图表联动功能,使您可以轻松制作支持图表联动的全国地图.省级地图数据可视化看板. 首先,新建两个数据集. 第一个是各省指标数据集,将用于绘制全国指标图表,它的SQL语句如下所示: ...

  7. Maps模块管理地图控件,用于在web页面中显示地图控件,提供各种接口操作地图控件,如添加标点、路线等。通过plus.maps可获取地图管理对象

    方法: openSysMap: 调用系统第三方程序进行导航 create: 创建Map对象 getMapById: 查找已经创建的Map对象 对象: Map: 地图控件对象 MapStyles: 地图 ...

  8. 利用ECharts3来实现ECharts2实例中的模拟迁徙效果,即背景地图为百度地图。 标签: ECharts3Echarts2模拟迁徙百度地图引入 2016-10-24 16:21 10065人阅

    利用ECharts3来实现ECharts2实例中的模拟迁徙效果,即背景地图为百度地图. 标签: ECharts3Echarts2模拟迁徙百度地图引入 2016-10-24 16:21  10065人阅 ...

  9. echarts地图上的标签为图片_百度地图标记点中添加Echarts图表

    html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #container { height: 100% } v ...

最新文章

  1. DOCKER上运行DOTNET CORE
  2. 【Linux】13_ 文件查找
  3. System BIOS设置
  4. 执行全文索引时出现权限不足的解决方法
  5. 为什么你闻不到自己胳肢窝的味道?
  6. 学习总结之数据挖掘三大类六分项
  7. Spring Cloud Zuul –编写过滤器
  8. windows 安装tensorflow
  9. 计算机办公软件应用二级 考试题库,计算机二级办公软件高级应用技术考试真题题库...
  10. 去除ios手机端input输入框上方有阴影
  11. ios开发环境搭建教程
  12. 新手零基础一小时学会小程序开发制作教程
  13. 分手纪念网页-分手了就用这个看看吧(移动端)
  14. 在线免费服务器,免费web服务器Tomcat
  15. 两大Mac内存清理方法,嫌麻烦的就直接使用第二种
  16. SQL语句中不完整数据的补足处理技巧
  17. 几个Android云测试
  18. 黑客都用Python做什么?我们能学会这些技术吗?
  19. Bootstrap学习笔记04
  20. 数据库学习笔记四收缩数据库

热门文章

  1. 微信登录并拿手机号码(实战)目前仅公众号及小程序登录
  2. Python 下载文件获取文件名request.get(...,stream=True)
  3. 【数电课程设计】---出租车计价器
  4. oracle 云计算业务,拉里.埃里森:Oracle云计算服务进入超速增长阶段
  5. powerbi日期转化error
  6. 云通信的变迁史:从飞鸽传书到即时可达
  7. codeforces 891E Lust 题解
  8. 微信公众号实现模板消息推送
  9. google搜索技巧——程序员推荐
  10. 数据库MySQL的性能基线收集及压力测试