E-COM-NET
首页
在线工具
Layui镜像站
SUI文档
联系我们
推荐频道
Java
PHP
C++
C
C#
Python
Ruby
go语言
Scala
Servlet
Vue
MySQL
NoSQL
Redis
CSS
Oracle
SQL Server
DB2
HBase
Http
HTML5
Spring
Ajax
Jquery
JavaScript
Json
XML
NodeJs
mybatis
Hibernate
算法
设计模式
shell
数据结构
大数据
JS
消息中间件
正则表达式
Tomcat
SQL
Nginx
Shiro
Maven
Linux
antV
antv
/g2图表tooltip展示坐标之外的数据
项目上遇到这个问题,文档上没有找到案例,这里记录一下:this.chart.tooltip({position:'top',//固定位置展示tooltipcrosshairs:{type:'rect',},//tooltip辅助线配置offset:10,//tooltip距离鼠标的偏移量containerTpl:``,//tooltip容器模板itemTpl:`人数:{value}占比:{perc
halowyn
·
2023-08-17 22:21
AntV
G6新版源码浅析
前言
AntV
是蚂蚁金服全新一代数据可视化解决方案,其中G6主要用于解决图可视领域相关的前端可视化问题,其是一个简单、易用、完备的图可视化引擎。
·
2023-08-15 18:50
可视化大屏的组件库
常见数据可视化库Echartshttps://echarts.apache.org/zh/index.htmlHighchartshttps://www.highcharts.com.cn/AntVhttp://
antv
.alipay.com
小阳生煎
·
2023-08-15 00:16
大屏可视化
echarts
前端
javascript
vue3+
antv
x6自定义节点样式
先大致定下节点样式,需要展示标题,输入/输出连接桩,参考样子大概是https://x6.
antv
.antgroup.com/examples/showcase/practices#class这是根据antvx6
原莱_
·
2023-08-12 02:37
vue.js
前端
javascript
vue3+ts使用
antv
/x6
使用2.x版本x6.
antv
新官网:安装npminstall@
antv
/x6//"@
antv
/x6":"^2.1.6",项目结构1、初始化画布index.vueimport{onMounted}from"vue
原莱_
·
2023-08-12 02:36
vue.js
javascript
图形渲染
antv
l7每次刷新无法加载iconFont
如图,只渲染出了文本,未渲染出iconFont但是如果我跳转到其他页面再跳转回来(未经过刷新时),可以展示出iconFont解决:查看官方源码后找到了iconfont.tsx文件可以看到多了一步fontloaded,放到项目中后再次测试,果然成功了
tsuyoii
·
2023-08-11 21:19
前端
umijs
antv
L7
iconfont
Antv
-G6入门
//节点,边线的配置。constgraph=newG6.Graph({container:‘mountNode’,//挂在标签的idwidth:800,//cavas的宽height:600,//cavas的高fitView:true,//画布适配fitViewPadding:[20,20,20,20],//画布上的四周留白宽度//节点的默认样式节点又被称作元素defaultNode:{id:‘n
长影缚苍龙
·
2023-08-10 08:01
antv-g6
通过anvt X6和vue3实现图编辑
通过anvtX6X6地址:https://x6.
antv
.antgroup.com/tutorial/about;由于节点比较复杂,使用vue实现的节点;x6提供了一个独立的包@
antv
/x6-vue-shape
长影缚苍龙
·
2023-08-10 08:33
vue
anvtX6
javascript
antv
G6在vue项目中的实践总结
在项目中使用Step1:使用命令行在项目目录下执行以下命令:npminstall--save@
antv
/g6Step2:在需要用的G6的JS文件中导入:importG6from'@
antv
/g6';Step3
北巷`
·
2023-08-08 03:55
vue
vue.js
javascript
前端
antv
/l7地图,鼠标滚动,页面正常滑动-- 我们忽略的deltaY
背景在官网项目中,需要使用一个地图,展示产品的分布区域及数量。希望的交互是,鼠标放上标点,tooltip展示地点和数量等信息。鼠标滚动,则页面随着滚动。但是鼠标事件是被地图代理了的,鼠标滚动意味着地图的缩放。问题解决我们首先想到的就是关闭地图的缩放constscene=newScene({id:'map',map:newGaodeMap({zIndex:0,pitch:0,style:'light
DiuDiu_yang
·
2023-08-07 07:41
项目问题集
计算机外设
前端
html
javascript
【VUE3+
AntV
X6】 引入
ANTV
X6 的流程图编辑器应用(一)
ANTVX6流程图编辑器应用唠唠叨叨事发背景实现效果实现思路总结参考资料唠唠叨叨唉!最近感觉非常忙,要学的东西太多,要实现的方法变幻莫测,层出不穷,越学越觉得自己不会的实在太多。项目本来中标了,后来又不知道发生了什么,临到签合同又黄了,整的我们开发的瑟瑟发抖,产品整个大改,恐怕要……只能说还是抓紧时间好好学习,知识和技术是永远不会背叛自己的。事发背景俺滴组长(后端大佬)要我配合开发数据平台的任务流
腌肉要轻轻拍打
·
2023-08-05 17:54
ANTV
前端
信息可视化
vue.js
流程图
javascript
vue3.2+ts使用
antv
/x6流程图
vue3.2+ts使用
antv
/x6流程图我们的需求是这样的20221201实现的效果图是这样的。基本满足要求,后期对完接口数据再更新一下。
qrn10240
·
2023-08-05 17:23
vue
流程图
vue
使用
AntV
X6 + vue 实现单线流程图
使用AntVX6+vue实现单线流程图X6是
AntV
旗下的图编辑引擎,提供了一系列开箱即用的交互组件和简单易用的节点定制能力,方便我们快速搭建DAG图、ER图、流程图等应用。
易风有点疯
·
2023-08-05 17:22
vue.js
流程图
前端
antv
-g6初试身手demo
下拉框选择,动态切换关系图状态,模拟动态流程切换下面是demo代码。免费下载https://download.csdn.net/download/qq_44441669/87636472
想要成仙的菜鸟前端
·
2023-08-05 10:51
g6
可视化
前端
antv
【
AntV
G6】页面节点错乱
问题描述懒加载子节点过多时,页面节点出现错乱,如下图解决办法布局的计算时间和动画产生了冲突,动画开始的时候实际上大数据量的布局还没有计算完成。在展开大量节点的时候,需要把动画关掉graph.set('animate',false)展开完成后再开启graph.set('animate',true)
门前大桥下www
·
2023-08-05 09:45
VUE
插件使用
AntV
前端
【
Antv
G6】导出图片
需求将AntvG6生成的树形图导出成图片代码varthat=thisthis.treeGraph.toFullDataURL(res=>{//为了防止下载的图片影响到G6显示,这里作一个深度拷贝varcanvas=document.getElementById('containerG6').childNodes[0].cloneNode(true)varimg=newImage()img.onlo
门前大桥下www
·
2023-08-05 09:14
前端
javascript
canvas
AntV
CustomeG6-canvas
目录简介scss快速上手·语雀简介
antv
/g6是一款基于JavaScript的图形可视化引擎,由阿里巴巴的
AntV
团队开发。创建各种类型的图形,如流程图、关系图、树形图等。
参宿7
·
2023-08-02 20:48
前端
数据库
网络
Vue2.0+AntvX6—边 Edge
import{Shape}from'@
antv
/x6'//创建边constedge=newShape.Edge({source:rect1,target:rect2,})//添加到画布graph.addEdge
molly cheung
·
2023-07-30 11:25
antv-x6
vue
edge
图论
前端
Vue2.0+AntvX6基础用法
什么是
antv
-x6?
molly cheung
·
2023-07-30 11:54
vue
antv-x6
javascript
前端
开发语言
antvg2 环图轮播_
Antv
_G2笔记
概念基本元素数据->Data:可视化数据来源图形属性->Attribute:数据中变量映射到图形几何标记->Geometry:点,线,多边形等几何标记度量->Scale:数据空间到图形空间的转换接口坐标系->Coordinate:笛卡尔,极坐标,螺旋坐标可视化组件->Component:Legent,Tooltip,Annotation,Slider分面->Facet:数据分面,一图拆多图视觉通道
weixin_39585463
·
2023-07-29 06:08
antvg2
环图轮播
AntV
G2
安装通过npm安装npminstall@
antv
/g2--save成功安装完成之后,即可使用import或require进行引用。import{Chart}from'@
官方认证新生代农民工_平安喜乐
·
2023-07-29 02:27
笔记
前端
javascript
vue.js
antv
系列图引擎X6、G6比对选择,并实现vue实例ER图
一、概述X6是基于svg,G6是基于canvas1、svg支持事件处理器,而canvas不支持事件处理器。(使用canvas实现事件操作较麻烦一些)2、canvas适合图像密集型的游戏,频繁地重绘图像,svg绘制的复杂度高时减慢渲染的速度。(大数据量渲染时选择canvas)总之:主要是这两点的,虽然本身做ER图,应该选择X6的,但是由于大数据渲染的,只能两者均衡使用G6二、ER图实例官方ER图实例
Program W
·
2023-07-28 12:33
Vue
js
大前端
vue.js
javascript
前端
antv
/G6使用记录,调用save方法,对数据model进行改造,并重新渲染
antv
/G6使用记录,调用save方法,对数据model进行改造,并重新渲染 主要说明在使用
antv
/g6时,对于画布中的节点,做某种操作(例如改变节点的颜色等),保存数据,以供一个新的画布渲染的方法
lookingForw_4585
·
2023-07-27 15:26
antv/G6
Vue
G6
vue
可视化
es6
企业开发中,如何在Vue中实现流程图
企业开发中,如何在Vue中实现流程图这是我在工作中,vue项目中,实现画出业务流程图,使用方法如以下:1、安装依赖这里使用第三方插件:@
antv
/g6详见官网@
antv
/g6$npminstall--save
原谅我很悲
·
2023-07-24 19:59
web前端
实际开发总结-前端
knowledge
graph
Antv
G6 force分布式布局 icon“+“ “-“收缩自定义,关系图子节点
子节点收缩constcollapseIcon=(x,y,r)=>{//折叠return[['M',x-r,y],['a',r,r,0,1,0,r*2,0],['a',r,r,0,1,0,-r*2,0],['M',x-r+4,y],['L',x-r+2*r-4,y]]}constexpandIcon=(x,y,r)=>{//拓展return[['M',x-r,y],['a',r,r,0,1,0,r*
唐月123456
·
2023-07-24 15:30
分布式
Antv
G6
关系图
子节点收缩
非树图
算法
前端
数据结构
antV
使用教程入门
在移动端使用antVF2图表入门介绍1.通过npm安装npminstall@
antv
/f2--save成功安装完成之后,即可使用import或require进行引用。
不靠谱的作曲家
·
2023-07-23 12:42
js
vue2
antV
可视化图表
标准合法的世界地图矢量数据(免费下载)
分享一个标准世界地图矢量数据免费下载的网站:https://l7.
antv
.antgroup.com/custom/tools/worldmap该网站支持多种数据格式下载、GeoJSON/KML/JSON
BetterQ.
·
2023-07-20 21:39
小结
矢量边界
地图数据
数据下载
Antv
L7 + mapbox 实现简单地图场景
实现场景1.创建地图场景2.自定义marker样式3.mapbox实现3D地图代码实现1.创建地图场景创建地图场景html,body{overflow:hidden;margin:0;}#map{position:absolute;top:0;bottom:0;width:100%;}varscene=newL7.Scene({id:'map',mapStyle:'light',//样式URLce
zlzhaoe
·
2023-07-19 03:32
webgis
webGis
Antv
L7
mapbox
「
AntV
」X6图编辑器的应用——流程图实现
效果展示在线预览源码SVG介绍阮一峰:SVG图像入门SVGtutorial因为
antv
/x6是基于SVG的图编辑器,所以SVG的知识有必要了解下的简介可缩放矢量图形【基于图形】全称:ScalableVectorGraphics
forguo
·
2023-07-17 22:43
JavaScript
可视化
工具
编辑器
流程图
前端
Vue3 项目中使用
AntV
X6 绘制流程图
X6是
AntV
旗下的图编辑引擎,提供了一系列开箱即用的交互组件和简单易用的节点定制能力,方便我们快速搭建流程图、DAG图、ER图等图应用.参考一些网站的写法,然后自己加上了撤销操作。
大阳plus
·
2023-07-16 04:18
流程图
vue antvG6产品流程图
地址:[vue-antvg6地址](https://gitee.com/shuaizi010/vue-antvg6.git)1安装vue-admin-template2进入目录安装所需包3安装必备库,
antv
、刷刷
·
2023-07-16 04:44
vue
js
vue.js
前端
javascript
ui
vue3+vite+Ts 基于
Antv
/x6 绘制流程图
需求效果:需求:实现一个流程图,双击可对相应的组件进行一些功能操作;工具栈:这里使用@
antv
/x6,基于vue3+vite+ts进行开发官网地址:https://x6.
antv
.antgroup.com
GUOZHUOYUE.
·
2023-07-16 04:10
流程图
vue.js
前端
了解
AntV
/x6
官网:https://x6.
antv
.antgroup.com/介绍:X6是基于HTML和SVG的图编辑引擎,提供低成本的定制能力和开箱即用的内置扩展,方便我们快速搭建DAG图、ER图、流程图、血缘图等应用
隔窗看世界
·
2023-07-15 22:40
前端
前端
“Error: Ensure the container of the graph is specified and valid“:
antv
-x6报错
antv
-X6快速上手报错:发现原因是因为:正确的代码如下:import{Graph}from'@
antv
/x6';constdata={//节点nodes:[{id:'node1',//String,
<每天一点>
·
2023-07-15 22:09
antV-X6
vue
记录--VUE使用
antv
X6实现流程图
安装npminstall@
antv
/x6--save引入import{Graph,Addon}from"@
antv
/x6";说明:如果没有自定义拖拽到画布的需求引入Graph就行了。
会自己走的CV码农
·
2023-07-15 22:39
记录
vue.js
前端
javascript
antv
X6
AntV
开发 —— x6 图编辑引擎 v2
前文再续前序:v1笔记碎碎念:此文个人笔记,官网文档搬运x6版本:2.9.7x6-vue-shape版本:2.0.11x6-plugin-selection版本:2.1.7vue版本:2.6.11vue-template-compiler版本:2.6.11Element-UI版本:2.15.13示例只展示单个节点的,多节点请下载demo自行查看源码demo均在易水GIT一:步骤:1——创建vue2
潇潇剑-易水阁
·
2023-07-15 22:03
vue.js
前端
javascript
ecmascript
前端框架
「
AntV
」使用
AntV
X6实现流程编排设计器
通过对BPMN的深入学习,以及对业界成熟的流程编排设计器的调研,了解到要研发一个流程编排设计器,需要实现如下几个主要的功能:支持创建各种流程图元素,包括任务(活动)、网关、事件等。支持绘制各种连接线,包括普通连接线、条件连接线、消息连接线等。支持流程图的编辑,包括元素的选择、移动、删除、复制、粘贴等。支持流程图的保存,包括保存流程图数据、导入/导出流程图数据等。具备良好的可扩展性,可以通过插件等方
青菜小王子
·
2023-07-15 22:30
React
流程图
react.js
BPMN
AntV
X6
流程编排设计器
创建可交互的图表:
AntV
X6实现预留空白位置、拖拽吸附与信息修改弹框
使用AntVX6首先用AntVX6官网的一句简介了解一下什么是X6X6是基于HTML和SVG的图编辑引擎,提供低成本的定制能力和开箱即用的内置扩展,方便我们快速搭建DAG图、ER图、流程图、血缘图等应用。知道了X6是什么,那么我们就要开始使用了首先得确定框架,其次就要安装X6由于项目是vue2的,所以选择的框架为vue2,当然自己也在vue3中写了一版,如有需要vue3的请私信1.首先在项目中新建
木得是
·
2023-07-15 22:30
交互
前端
X6 基于VUE流程编辑器开发
先看效果图主要插件X6x6-vue-shape@
antv
/x6-plugin-dnd代码太多没有整理出来
zhangwenwu的前端小站
·
2023-07-13 23:10
vue.js
编辑器
前端
模板学堂|数据关系和
AntV
、ECharts图表解析
DataEase开源数据可视化分析平台于2022年6月正式发布模板市场(https://dataease.io/templates/)。模板市场旨在为DataEase用户提供专业、美观、拿来即用的仪表板模板,方便用户根据自身的业务需求和使用场景选择对应的仪表板模板,并在优质模板的基础上轻松制作自己的仪表板。目前,模板市场的模板数量已经达到了100个。2023年6月上新模板DataEase模板市场定
FIT2CLOUD飞致云
·
2023-07-13 20:29
数据分析
开源
数据可视化
仪表板
DataEase
AntV
开发 —— x6 图编辑引擎
其实,只是想找个轮子前序:
AntV
-官网x6-官网x6-人工智能建模DAG图x6-v2笔记碎碎念:此文个人笔记,官网文档搬运因为官网对于vue结合Element-UI的示例就几个,本意只是看中了人工智能建模
潇潇剑_易水阁
·
2023-07-05 09:16
Antv
使用
Antv
使用在线文档https://
antv
.gitee.io/zh安装执行命令npminstall@
antv
/x6--save在文件中引入x6import{Graph}from'@
antv
/x6';初始化步骤
i小杨
·
2023-06-24 02:09
组件库使用技巧
前端
javascript
开发语言
基于
AntV
G2实现一个通用可视化Vue插件
前言AntVG2坚持自然、确定性、意义感、生长性的设计价值观。与其他可视化插件不同的是,G2是以数据驱动的高交互可视化图形语法,具有高度的易用性和可扩展性。随着业务可视化不断发展,数据复杂度越来越高。实现一个通用的可视化插件越来越迫切。本文基于G2实现了一个可视化Vue插件——p-charts。提示:p-charts是基于AnVG2v3.x最新版本,因为v3.x版本文档比较成熟。后续会紧跟v4.x
·
2023-06-22 12:15
「
AntV
」和ChatGPT一起:基于L7、Turf.js与kriging.js实现Kriging插值并绘制
1.概述(笔者,下同):ChatGPT,请帮我写一份简短的概述,主题为:基于AntVL7、Turf和kriging.js实现空气质量指数kriging插值并绘制(ChatGPT,下同):基于AntVL7、Turf和kriging.js实现空气质量指数kriging插值并绘制是一种利用前端技术库来分析和可视化空气质量数据的方法。首先,通过AntVL7库加载地理空间数据和地图图层,并提供交互和可视化功
·
2023-06-22 12:45
前端antv
当我用AI为开发
AntV
图表插上想象的翅膀后
前言做前端图表时,最耗时的就是找配置参数,比如你在使用AntVG2时,为了更加美观,拉大数据之间的差距,需要将y轴设置一个最小值,由于每个图表的参数少说十几个,多达二十多个,一个一个找,势必会浪费很多时间,更何况有时你找的参数并不在某一具体的图表模块,而是在公共的图表组件配置模块中。这个时候我就思考,这些寻找配置参数,毫无技术性的,耗时的工作能不能交个AI来做?所以在日常的开发图表的过程中,遇到问
拿我格子衫来
·
2023-06-21 23:48
前端技术
前端开发
人工智能
python
数学建模
Vue.js 项目查看 vue版本号
如果想要查看vue的版本,直接去项目中,在根目录下,找到package.json文件夹找"dependencies",然后就可以看到你装的vue的版本了"dependencies":{"@
antv
/data-set
Lan.W
·
2023-06-17 15:54
vue.js
javascript
前端
任务进度bpmn绘制选型
antv
/x6与g6
一、起源因为想要记录业务【在整个流程开始与结束之外的操作】与流程【图中红色标码的节点为审批节点】结合的全流程进度,因为时间与一些其他原因想采用前端制作二、G6尝试2.1官方示例g6的官方流程图示例2.2参照实现layout:{type:'grid',begin:[200,200],preventOverlap:true,//防止重叠cols:5}通过设置layout控制行有5个节点,但是效果并不怎
Program W
·
2023-06-14 14:58
Vue
js
工作流
vue.js
javascript
前端
@
antv
/g6在ie11报语法错误,兼容处理
错误分析:上图清晰明了指出@
antv
/g6在es6转es5的时候没全部转换完,ie不识别es6代码,所以要添加一个babel-profill。
前端小白
·
2023-06-14 13:01
webpack
前端
vue.js
前端
@
antv
/g2plot 特殊 散点图 x轴为category 调整了legend 的marker
下面代码演示了如何使用
antv
/g2plot创建一个散点图,并对其进行基本的样式和布局配置。具体来说,代码中的data数组定义了散点图的数据系列,每个数据对象包含了分类、值和y轴字段三个属性。
拿我格子衫来
·
2023-06-13 16:36
前端技术
前端开发
数学建模
可视化—
AntV
G6实现节点连线及展开收缩分组
AntV
是蚂蚁金服全新一代数据可视化解决方案,主要包含数据驱动的高交互可视化图形语法G2,专注解决流程与关系分析的图表库G6、适于对性能、体积、扩展性要求严苛的场景。
Echoyya、
·
2023-06-11 15:41
Vue2
JS
可视化
vue.js
信息可视化
javascript
ecmascript
前端
上一页
1
2
3
4
5
6
7
8
下一页
按字母分类:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
其他