echarts
漏刻有时
数据可视化和地图可视化技术研究
展开
-
layui框架实战案例(26):layui-carousel轮播组件添加多个Echarts图标的效果
在Layui中,使用layui-carousel轮播组件嵌套Echarts图表来实现多个图表的展示。原创 2024-04-04 15:36:26 · 632 阅读 · 1 评论 -
漏刻有时数据可视化Echarts组件开发(46)散点图颜色判断
【代码】漏刻有时数据可视化Echarts组件开发(46)散点图颜色判断。原创 2023-12-25 20:19:47 · 670 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(45)机场流程导航线和指示点的开发记录
在ECharts中,路径图主要用于带有起点和终点信息的线数据的绘制,如地图上的航班、路线等。路径线可以用于展示数据点之间的连接关系,以及数据点之间的相对位置。原创 2023-12-16 14:37:35 · 633 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(44)提示框组件与返回多边形
用于计算坐标、获取尺寸和样式等。通过这些 API 方法,我们可以计算出每个数据项的位置和样式,并返回一个渲染的 DOM 节点。是 ECharts 中的一个函数,它主要用于自定义渲染每个数据项。这个函数会在每个数据项绘制前被调用,传入参数为。函数来自定义每个数据项的渲染方式,例如可以修改数据项的颜色、形状、大小等。在这个例子中,我们自定义了柱状图的渲染方式。在 ECharts 中,我们可以通过。对象包含了当前数据项的所有信息,如。对象则是一组 API 方法,如。,返回值为渲染的 DOM 节点。原创 2023-12-16 14:30:09 · 638 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(43)纹理填充和HTMLImageElement知识说明
在 ECharts 中,纹理填充可以通过自定义系列(series)的itemStyle属性来实现。itemStyle属性用于设置系列中每个数据项的样式,包括填充颜色、边框颜色、边框线宽等。原创 2023-12-16 14:23:15 · 645 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(42)动态创建DIV容器
假设API返回了一个数组apiData,包含了要显示的数据。然后,我们使用for循环动态创建多个div元素作为ECharts图表的容器,并设置样式和ID。接下来,我们再次使用for循环根据API返回的数据渲染每个图表。在每个循环中,我们使用echarts.init方法初始化ECharts实例,并使用setOption方法设置图表的配置项和数据。原创 2023-12-16 13:29:23 · 1126 阅读 · 0 评论 -
漏刻有时百度地图API实战开发(9)Echarts使用bmap.js实现轨迹动画效果
Bmap.js是Echarts和百度地图相结合开发的一款JavaScript API,它可以帮助用户在web应用中获取包括地图中心点、地图缩放级别、地图当前视野范围、地图上标注点等在内的地图信息,并且支持在地图上添加控件,提供包括智能路线规划、智能导航(驾车、步行、骑行)、实时路况等出行相关服务。但,Bmap.js本身并不提供离线功能,因为离线会导致“搜索周边”“搜索路线”“交通状况”等实时性数据要求的功能缺失。原创 2023-12-11 01:40:27 · 849 阅读 · 1 评论 -
漏刻有时数据可视化大屏(16)数据指标KPI和柱图折线图混排
【代码】漏刻有时数据可视化大屏(16)数据指标KPI和柱图折线图混排。原创 2023-10-08 23:21:55 · 210 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(43)水球图svg温度计动画
SVG是一种用XML定义的语言,用来描述二维矢量及矢量/栅格图形。具体来说,SVG图形是可伸缩的矢量图形,其图像质量不会因放大或改变尺寸而损失。在SVG中,可以创建和修改图像、对图像进行搜索和索引、对其进行脚本化或压缩。此外,SVG图形是可交互的和动态的,可以在SVG文件中嵌入动画元素或通过脚本来定义动画。在创建SVG图形的过程中,可以使用各种方法来绘制路径、框、圆、文本和图形图像。例如,通过使用。原创 2023-10-08 23:16:05 · 362 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(42)渐变色的应用
参见:makeAPie。原创 2023-10-08 13:55:19 · 243 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(42)炫酷的pictorialBar象形柱图代码分析
参见:makeAPie。原创 2023-10-08 13:49:11 · 769 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(41)svg格式地图应用
echarts.registerMap(mapName, geoJson) 参数mapName是地图的名称,geoJson是地图的数据。注册后可以使用这个地图名称在Echarts中使用这个地图。如有需要,建议咨询Echarts官方网站或者查询专业书籍。Echarts.registerMap是Echarts图表库中用于注册地图的函数。它可以将第三方地图或自定义地图数据与Echarts进行集成,使用Echarts的API进行绘制。原创 2023-10-08 13:44:28 · 728 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(40)pictorialBar象形柱图
【代码】漏刻有时数据可视化Echarts组件开发(40)pictorialBar象形柱图。原创 2023-10-08 13:29:25 · 564 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(39)splitLine网格线效果
【代码】漏刻有时数据可视化Echarts组件开发(39)splitLine网格线效果。原创 2023-10-08 13:24:01 · 1204 阅读 · 0 评论 -
漏刻有时物联网刷脸支付可视化大屏(柱图、支付统计、数字滚动插件numberAnimate.js、jquery.liMarquee.js插件、横向滚动字幕代码)
是一个用于在网页上创建动画数字效果的 JavaScript 插件。它可以帮助开发者轻松实现数字的渐变、过渡、闪烁等动画效果。以下是下面是原创 2023-10-08 12:59:56 · 273 阅读 · 0 评论 -
漏刻有时物联网环境态势感知大数据(设备列表、动态折线图)
物联网环境下的态势感知是指对物联网环境中的各种要素进行全面、实时、准确的监测、分析和预测,以实现网络态势的全面掌握和安全威胁的及时响应和处理。具体而言,态势感知以物联网环境为基础,利用各类传感器、数据采集设备和其他相关工具,对物联网设备、资产、数据流等进行监测,并通过数据分析和挖掘技术,结合历史数据和实时数据,对物联网环境的整体态势进行全面、准确的分析和预测,以发现潜在的安全威胁和风险,提供安全决策和行动的依据。物联网环境的态势感知具有动态性、全局性和实时性的特点。态势感知可以对物联网环境中的各种要素进行全原创 2023-10-08 12:06:08 · 937 阅读 · 0 评论 -
Echarts高级进阶教程(6)心电图
Echarts 是一个强大的图表和可视化库,它可以帮助你创建各种类型的图表,包括心电图效果。要使用 Echarts 来创建心电图效果。原创 2023-10-08 11:48:58 · 927 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(36):实现数据(tooltip)自动轮播插件echarts-auto-tooltip.js
在 echarts-auto-tooltip.js 的官方页面下载最新版本的插件文件,并将其引入到你的 HTML 页面中。初始化一个 ECharts 实例,可以使用 ECharts 的官方 API 进行初始化,也可以通过引入 echarts.js 进行初始化。echarts-auto-tooltip.js 是一个 ECharts 的插件,用于自动显示图表的 tooltip(提示框)。属性来开启自动提示框功能,同时可以设置提示框的样式、位置等。在 ECharts 的配置项中,使用。原创 2020-07-01 10:08:24 · 225 阅读 · 1 评论 -
漏刻有时数据可视化Echarts组件开发(32):温度计2
【代码】漏刻有时数据可视化Echarts组件开发(32):温度计2。原创 2023-09-23 09:21:23 · 200 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(31):geomap伪3D配置示例
【代码】漏刻有时数据可视化Echarts组件开发(31):geomap伪3D配置示例。原创 2023-09-23 09:10:29 · 219 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(30):自定义方向的数据流向动画
【代码】漏刻有时数据可视化Echarts组件开发(30):自定义方向的数据流向动画。原创 2023-09-23 09:06:50 · 128 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(29):工业图形动画
【代码】漏刻有时数据可视化Echarts组件开发(29):工业图形动画。原创 2023-09-23 09:03:54 · 1395 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(28):异形柱图、pictorialBar和dataZoom组件的使用
在ECharts中,pictorialBar组件是一种特殊的条形图,它使用图形和图片来表现数据。具体来说,pictorialBar组件可以使用不同的图形,如圆形、方形等,来表示数据。在使用pictorialBar组件时,需要对不同的属性进行设置,如symbol表示要使用的图形类型;data表示要展示的数据等。这些图形可以按照不同的方式来表现数据,例如,可以使用图形的长度和宽度变形来表现数据的大小。总之,pictorialBar组件是一种非常灵活和强大的数据可视化工具,可以帮助用户更好地理解和分析数据。原创 2023-09-21 15:38:19 · 385 阅读 · 2 评论 -
漏刻有时数据可视化Echarts组件开发(27):端午地图粽情之你的家乡吃甜还是吃咸?
中国各地对粽子的口味偏好存在一定的差异,一般可以从以下几个方面来概括:甜咸口味的区别1:北方地区一般偏向于咸口味,如北京、天津、山西等地的粽子多为五香肉、咸蛋黄等咸味,而南方地区则更加喜欢甜味,如浙江、江苏、上海等地的粽子多为红枣、豆沙、花生等甜味。粽子材料的不同:由于地区气候和人们口味偏好的差异,在制作粽子时材料也存在差异。如北方的肉粽主要使用猪肉配以五香料等炖制,而南方的粽子则多使用糯米和糖果作为主要材料。形状和包法:不同地区的粽子形状和包法也存在差异。原创 2023-06-22 02:30:00 · 1755 阅读 · 4 评论 -
ChatGPT工作提效之数据可视化大屏组件Echarts的实战方案(大数据量加载、伪3D饼图、地图各省cp中心坐标属性、map3D材质)
加载大量的折线图,可以采用 Echarts 提供的大数据量加载方案,即数据分块加载(dataset)和视图区域范围(dataZoom)限制,以避免过多数据的同时提高渲染性能。ECharts:ECharts 是百度开源的数据可视化库,提供了各种各样的图表类型和丰富的功能,包括折线图、柱状图、散点图、饼图、雷达图、热力图等。AntV:AntV 是阿里云的前端可视化解决方案,提供了各种各样的图表类型,包括折线图、柱状图、饼图、散点图等。上面的代码中,通过 ajax 获取数据,更新数据并动态更新大量的折线图。原创 2023-06-12 00:30:00 · 1346 阅读 · 0 评论 -
数据可视化大屏电商数据展示平台开发实录(Echarts柱图曲线图、mysql筛选统计语句、时间计算、大数据量统计)
作为地区销售部门,有很多指标需要跟踪。从收入或订单数量等高级指标,到客户反馈等更详细的信息,作为部门的领导,可能需要花费大量的时间从数据堆中找出每次需要的不同数据。客户的销售基本上都是通过线上或者手机端完成的,统一存储在Mysql数据库中。作为数据可视化开发,客户的基本面已经完成了在数据收集、数据清洗和数据过滤。接下来的主要工作是数据筛选和统计、数据格式化输入即可。项目是某奶品在华东区线下销售的数据统计平台,主要呈现每日奶品销售的信息数据。原创 2023-04-25 20:27:39 · 1887 阅读 · 2 评论 -
Echarts数据分析系统Data Analysis Platform使用说明文档
Data Analysis Platform数据分析系统,是基于echarts5.0版本开发的一个后台数据分析平台,采用php+mysql底层开发。程序主要涉及数据的导入导出,以及Echarts中的折线图、堆叠柱图、箱体图等,难点在于对统计学中最大值、最小值、平均数和中位数概念的使用。原创 2022-10-21 21:50:27 · 912 阅读 · 2 评论 -
漏刻有时数据可视化Echarts组件开发(27):盒须图(箱线图)前后端php交互的实战案例
Boxplot 中文可以称为『箱形图』、『盒须图』、『盒式图』、『盒状图』、『箱线图』,是一种用作显示一组数据分散情况资料的统计图。它能显示出一组数据的最大值、最小值、中位数、下四分位数及上四分位数。原创 2022-10-21 21:25:39 · 915 阅读 · 1 评论 -
layui框架实战案例(14):tabs选项卡切换时echarts拉伸变形无法正常显示的解决方案
layui切换tabs选项卡时,echarts由于无法获取对应容器高度宽度,导致echarts在渲染的过程中,出现拉伸变形无法正常显示的情况。原创 2022-09-12 20:08:32 · 1165 阅读 · 1 评论 -
漏刻有时数据可视化Echarts组件开发(26):全国地图三级热力图下钻和对接api自动调用数据开发实录
对应省市区,分别做隐藏式的面包屑按钮,跟随鼠标互动显示或隐藏区域名称。只有山东省数据时,其他省的鼠标高亮效果会出现undefined异常。4. 北京、天津、上海、重庆四个直辖市只有二级下钻;5. 海南省下钻市,海域面积过大,需要进行特殊处理;6. 省市json地理数据与对应区域的映射编码;原创 2022-09-12 18:51:45 · 962 阅读 · 2 评论 -
漏刻有时Echarts地图三级下钻和散点图使用说明
漏刻有时Echarts地图三级下钻和散点图使用说明原创 2022-08-06 11:51:45 · 629 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(26):雷达散点图
雷达图是通过ECharts的雷达图坐标系组件实现的,其坐标系与极坐标系不同的是它的每一个轴(indicator 指示器)都是一个单独的维度,可以通过 name、axisLine、axisTick、axisLabel、splitLine、 splitArea 几个配置项配置指示器坐标轴线的样式。...原创 2022-07-07 10:33:32 · 627 阅读 · 1 评论 -
漏刻有时数据可视化Echarts组件开发(25):引导线labelLine和散点图scatter的开发
地图上的地区文字或其他标示类的图层,区块面积相对太小,想放在地图之外,部分地区通过labelLine连接到对应的区块上。Echarts核心代码封装函数@lockdata.cn原创 2022-06-13 18:34:36 · 768 阅读 · 0 评论 -
数据可视化中javascript二维数组使用arr.slice实现换行换列排名的解决方案
数据可视化大屏中,常常使用到区域排名的情况,通常的多行同列名的容易排序输出;但是多行多同名列排名怎么解决呢?本案例就是javascript二维数组使用arr.slice实现换行换列排名的解决方案。原创 2022-06-04 08:33:34 · 497 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(24):本地离线的地图下钻与散点图
项目需求1.基于Echarts地图geomap组件做全国地图的二级下钻;2.实现不同区域的散点图,并根据行业分类;3.单击散点图跳转链接;4.本地离线版;项目演示图项目分析本地版需要将geojson转为js脚本,实现离线端的访问,中国地图+34省区,合计35本地js;按行业分类,通过颜色区分;散点图数据结构格式的确定;项目代码返回按钮//返回按钮 oBack.onclick = function () { $('#back').addClass('hi原创 2022-05-02 10:02:12 · 771 阅读 · 1 评论 -
漏刻有时数据可视化Echarts组件开发(23):世界地图动态时间轴的散点气泡图
项目基于百度开源框架ECharts予以开发。ECharts,一个使用 JavaScript 实现的开源可视化库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE9/10/11,Chrome,Firefox,Safari等),底层依赖矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。原创 2022-04-06 14:00:25 · 2041 阅读 · 2 评论 -
漏刻有时数据可视化Echarts组件开发(30):纵向事件线
纵向事件线(vertical event line)是一个术语,用于描述在历史时间轴上某一特定事件或一系列相关事件的发展过程。例如,我们可以将欧洲的工业革命作为一个纵向事件线。这个事件线开始于18世纪的英国,然后传播到欧洲大陆和其他地区。在这个过程中,我们可以研究各种技术的发展,如蒸汽机、纺织机械、铁路和电力等,以及这些技术的发展如何改变了社会和经济结构。同样地,我们也可以将20世纪的历史作为一个纵向事件线。这个时间线可以包括两次世界大战、冷战、全球化、信息技术的兴起、气候变化等许多重要的事件。原创 2022-01-26 09:07:53 · 83 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(33):科技感炫酷的环图
var labelData = [];var labelData1 = [];for (var i = 0; i < 150; ++i) { labelData.push({ value: 1, name: i, itemStyle: { normal: { color: 'rgba(0,209,228,0)', } } });}fo.原创 2022-01-26 09:06:20 · 145 阅读 · 0 评论 -
漏刻有时数据可视化Echarts组件开发(32):饼图纹理填充
【代码】漏刻有时数据可视化Echarts组件开发(32):饼图纹理填充。原创 2022-01-26 09:04:42 · 74 阅读 · 0 评论 -
Echarts主题构建工具的使用
Echarts自带丰富的主题配色,对于有独立的UI设计,主题的应用范围不是很广泛,但是官方的配色还是具有很大的参考价值的。传送门:https://echarts.apache.org/zh/theme-builder.html下载或复制以下的主题保存至 *.js 文件;将该文件在 HTML 中引用;使用 echarts.init(dom,‘westeros’) 创建图表,第二个参数即为 *.js 文件中注册的主题名字。代码展示:引入macarons.js主题文件 <scri.原创 2022-01-18 10:43:53 · 728 阅读 · 3 评论