![](https://img-blog.csdnimg.cn/079bb5e67cfb4f24aa67fb2c98b0e616.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端可视化
文章平均质量分 58
datav
gxhlh
智慧的获取,能力的提升,创造力的领悟,是基于长期的投资回报周期。
展开
-
echarts图表 Y 轴刻度值过长时显示不全解决办法
1、配置 grid 属性grid 组件离容器左侧的距离。left 的值可以是像 20 这样的具体像素值,可以是像 ‘20%’ 这样相对于容器高宽的百分比,也可以是 ‘left’, ‘center’, ‘right’。如果 left 的值为’left’, ‘center’, ‘right’,组件会根据相应的位置自动对齐。option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sa原创 2022-05-20 19:54:46 · 7540 阅读 · 0 评论 -
处理 echarts 数据过多时的展示问题
问题:处理 echarts 数据过多时的展示问题解决方案:解决方案是,配置dataZoom属性。dataZoom用于区域缩放,从而能自由关注数据细节,或者概览数据整体。官网示例:example/scatter-dataZoom-all配置项说明:dataZoom=[ //区域缩放 { id: 'dataZoomX', show:true,原创 2022-03-31 07:51:10 · 3673 阅读 · 0 评论 -
在 Vue3 中使用 AntV X6
在 Vue3 中使用 AntV X6<script setup lang="ts">import { onMounted, ref } from 'vue'import { Graph } from '@antv/x6';import { GridLayout, DagreLayout } from '@antv/layout' // 布局算法import { data } from '../mock/data'let container: HTMLElement | und原创 2022-02-21 21:45:45 · 8823 阅读 · 5 评论 -
安装x6-vue-shape后会报错
vite项目下,安装引入@antv/x6-vue-shape会报错只安装@antv/x6正常,安装x6-vue-shape后会报错1、安装@antv/x6-vue-shape2、import { Graph } from “@antv/x6”;3、报错button.ts:10Uncaught TypeError: Cannot read properties of undefined (reading 'ToolItem');版本"@antv/x6": "^1.30.0","@antv/x6原创 2022-02-15 09:44:59 · 5135 阅读 · 4 评论 -
使用类 JSX 语法自定义 G6 节点
参考资料:https://g6.antv.vision/zh/docs/manual/middle/elements/nodes/jsx-node原创 2022-01-03 18:05:32 · 2447 阅读 · 2 评论 -
AntV G6 自定义节点图形
接上一篇 在 Vue3 中优雅使用 antV G6 的流程总结1、本篇只使用了 G6 自定义节点中的一个 API draw,完整API 点击这里/** 绘制节点,包含文本* @param {Object} cfg 节点的配置项* @param {G.Group} group 图形分组,节点中图形对象的容器* @return {G.Shape} 返回一个绘制的图形作为 keyShape,通过 node.get(‘keyShape’) 可以获取。* 关于 keyShape 可参考文档 核心概原创 2022-01-03 14:37:47 · 7721 阅读 · 2 评论 -
在 Vue3 中优雅使用 antV G6 的流程总结
在vue3 中使用 antV G6 的流程原创 2022-01-03 11:54:46 · 10298 阅读 · 4 评论 -
在vue3使用AntV G6 (图可视化引擎)
官网地址:G6 是一个图可视化引擎一、在项目中使用 NPM 包引入Step 1: 使用命令行在项目目录下执行以下命令: npm install --save @antv/g6Step 2: 在需要用的 G6 的 vue 文件中导入:import G6 from '@antv/g6';二、绘制案例Step 1 创建容器需要在 HTML 中创建一个用于容纳 G6 绘制的图的容器,通常为 div 标签。G6 在绘制时会在该容器下追加 canvas 标签,然后将图绘制在其中。// 挂载节点原创 2021-12-18 19:11:33 · 8378 阅读 · 3 评论