echarts地图
echarts5.0 去掉 hover 折线变粗方法
## 问题 今天 echarts 版本更新至5.1.2，发现鼠标悬停在折线图上，折线变粗，这个效果和我的需求相悖，所以想办法去掉此效果 ## 解决 **emphasis** ：折线图的高亮状态。 **设置emphasis.lineStyle和折线图本身lineStyle相同即可** ``` let ......
vue3封装echarts组件数据更新不同步问题
# vue3封装echarts组件数据更新不同步问题 > 背景： 记录一下项目中遇到的bug，在vue3+echarts环境下，为了方便使用，我将echarts封装成组件使用，使用的时候只需要把对应的值传入给chart组件就行，但是在传入真实数据的时候遇到了问题，就是传入value值与图表组件显 ......
浏览器全屏时 echarts.resize() 无效/滞后解决办法
前言 echarts 在 dom 上初始化时使用 echarts. init ，这个 dom 是实例容器，一般是一个具有高宽的 DIV 元素。 不能在单个容器上初始化多个 ECharts 实例。 echartsInstance.resize 改变图表尺寸，在容器大小发生改变时需要手动调用。 echa ......
Cesium学习笔记3——加载地图服务
申请成为天地图开发者，创建应用 编写代码： <!DOCTYPE html> <html lang="en"> <head> <!-- Use correct character set. --> <meta charset="utf-8" /> <!-- Tell IE to use the lat ......
记录--在高德地图实现卷帘效果
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 介绍 今天介绍一个非常简单的入门级小案例，就是地图的卷帘效果实现，各大地图引擎供应商都有相关示例，很奇怪高德居然没有，我看了下文档发现其实也是可以简单实现的，演示代码放到文末。本文用到了图层掩模，即图层遮罩，让图层只在指定范围内显示。 实 ......
uniapp引入高德地图或腾讯地图以及map在真机中常见问题汇总
以下是必须肯定会用到的官方地址 腾讯地图API开发文档：微信小程序JavaScript SDK | 腾讯位置服务 (qq.com) 高德地图API开发文档：开发 | 高德地图API (amap.com) 高德地图小程序配置指南：入门指南-微信小程序插件|高德地图API (amap.com) 小程序后 ......
微信小程序taro-react-echarts使用dataZoom问题
taro微信小程序中使用 taro-react-echarts 展示图表数据，因为数据量大，需要使用dataZoom来左右滑动图表。 ## 实现效果 ## 解决 首先在echarts的options中添加 ``` xAxis:... yAxis:... dataZoom: [ { type: 'in ......
echarts 散点图分段式渐变色（分段型视觉映射组件）
echarts 分段型视觉映射组件，有三种模式： 连续型数据平均分段: 依据 visualMap-piecewise.splitNumber 来自动平均分割成若干块。 连续型数据自定义分段: 依据 visualMap-piecewise.pieces 来定义每块范围。 离散数据根据类别分段: 类别定 ......
ECharts
ECharts是一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。ECharts最初由百度团队开源，并于2018年初捐赠给Apache基金会，成为ASF孵化级项目。 ECharts 提供了常规的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图 ......
Uview引入Echart(uni-ec-canvas)方法
1.下载引入uni-ec-canvas文件 2.代码引入 View Code 例子图片 睡眠图 睡眠周（柱状图） 心脏健康心率图 心脏健康静息心率图 静心心率月图 体重折线图 距离图 ......
获取乡镇、街道级别地图边界数据 （Kml、GeoJson）
## 获取乡镇、街道级别地图边界数据 （Kml、GeoJson） ### 安装Bigemap工具 > http://www.bigemap.com/reader/download/ 下载`Bigemap GIS Office 全能版`，安装到`windows`电脑 ### 下载乡镇数据（获取kml） ......
关于echarts自定义地图知识点
<div id="dt" style="width: 1200px;height:800px;text-align: center;margin: 0 auto;"></div> <script>var chart = echarts.init(document.getElementById('dt ......
1.echarts下载及安装
1. 安装echarts 步骤一：git bash here中输入: npm install cnpm -g 步骤二：git bash here中输入: cnpm install echarts --save 步骤三：在 main.js 中写入以下内容： import * as echarts fr ......
echart 柱状图加短线
 ``` let data=[51, 58, 63, 57, 63, 40, 124,108, 63, 63] l ......
计算地图上两点距离
/** * 获取地图上两点间距离。单位：米 * @param {lat1} 第一个点的纬度 * @param {lon1} 第一个点的经度 * @param {lat2} 第二个点的纬度 * @param {lon2} 第二个点的经度 * @author 人参 */ export function ......
2023年7月最新全国省市区县和乡镇街道行政区划矢量边界坐标经纬度地图数据 shp geojson json
发现个可以免费下载全国 geojson 数据的网站，推荐一下。支持全国、省级、市级、区/县级、街道/乡镇级以及各级的联动数据，支持导入矢量地图渲染框架中使用，例如：D3、Echarts等 geojson 数据下载地址：https://geojson.hxkj.vip 该项目 github 地址：ht ......
JavaScript校验地图经纬度是否符合规范
function verifylonglat(longitude, latitude) { var longreg = /^(\-|\+)?(((\d|[1-9]\d|1[0-7]\d|0{1,3})\.\d{0,6})|(\d|[1-9]\d|1[0-7]\d|0{1,3})|180\.0{0,6 ......
echarts 在使用dataZoom时报错，Cannot read properties of undefined (reading 'type')
今天我再vue中使用柱状图拖动时，一直报错Cannot read properties of undefined (reading 'type')。 原因如下，我使用了myChart 来接收数据，当myChart使用的是vue的ref或者reactive来命名的变量，如果这样子命名就会报上述错误。 ......
小程序使用echarts（二）
一、在根据（一）进行使用时出现得问题 1、按照教程图表依旧不显示 2、图表不跟随页面滑动 二、解决办法 （1）不显示 1、应当引入插件 2、查看父元素是否存在display: flex;属性；以及height: 100%类似属性；也不能使用float （2）滑动 1、不能存在（1）2中的displa ......
解决vue中mapbox地图显示一半的问题
### 解决vue中mapbox地图显示一半的问题 问题描述： 在vue中创建mapbox地图，地图只显示一般，查看浏览器开发者工具。发现将`canvas.mapboxgl-canvas` 的`position:absolute`去掉就解决了 。 代码修改：获取到`canvas.mapboxgl-c ......
Echart 图表
option = { grid: { // height: "80%", // 高度 // left: '5%', // right: '5%', // bottom: '28', // top: '10%', // containLabel: true, // z: 1, height: '72% ......
C#百度地图开放平台211sn校验失败解决方法
个人认为百度地图开放平台确实很好用但就是C#的SN校验会出现以下几个问题 一、官方的示例代码说的不清不楚 获取SN函数的Uri应该使用不带域名的Uri 比如：最终请求地址为https://api.map.baidu.com/location/ip?ip=119.126.10.15&coor=gcj0 ......
C#百度地图开放平台211sn校验失败解决方法
个人认为百度地图开放平台确实很好用但就是C#的SN校验会出现以下几个问题 一、官方的示例代码说的不清不楚 获取SN函数的Uri应该使用不带域名的Uri 比如：最终请求地址为https://api.map.baidu.com/location/ip?ip=119.126.10.15&coor=gcj0 ......
echarts，时间轴折线图，tooltip相关
其中，data数组是通过echarts工具由表格直接转换得到：https://echarts.apache.org/zh/spreadsheet.html 第一部分：data data中的长串是由表格得到，由日期转为的时间戳形式，比如‘1636905600000’，是excel中的【2021/11/ ......
自己封装可复用的echarts通用组件
分为两部分 组件chatModule.vue <template> <div ref="mybar" :style="{ width: width, height: height }"></div> </template> <script> export default { props: { //图 ......
【JAVA】JAVA后台调用百度地图API进行坐标转换
```java import com.alibaba.fastjson.* import …… // coords: '114.21892734521,29.575429778924' // return: ['114.2307519546763', '29.57908428837437'] // ......
卫星影像地图在工程建设中的应用，附高清影像数据获取方法
1.引言 在工程建设过程中，了解项目区域范围内的现状至关重要。卫星地图具有较高的图像分辨率和详细、准确的地理信息的特点，被广泛应用于工程建设的前期规划设计、施工现场。那么卫星地图在工程建设中都有哪些应用呢？ 2.卫星地图在工程建设中的作用 2.1地籍调查 在前期的拆迁等调查工作具有工作难度高、工作量 ......
OpenLayers 4326地图 根据距离设置地图分辨率
### 问题：给一个距离，如何确定4326地图缩放等级或者分辨率使地图视口范围为这个距离 1. 我本来打算计算从地图视口左上角到右下角的距离来计算地图缩放的，然后发现不好算，我也不会算，于是就计算水平方向距离的缩放。 2. 然后我发现了地图分辨率的定义使是 ： **分辨率——屏幕上一个像素代表多少地 ......
前端Vue腾讯地图SDK Api经纬度解析为地址信息Geocoding 可用于定位经纬度信息解析为地址
#### 前端Vue腾讯地图SDK Api经纬度解析为地址信息Geocoding 可用于定位经纬度信息解析为地址， 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id=13311 #### 效果图如下： ![](https://p3- ......