Comments (8)
demo 打不开
from s2.
demo 打不开
import { PivotSheet, BaseEvent, S2Event } from "@antv/s2";
class ContextMenu extends BaseEvent {
bindEvents() {
this.spreadsheet.on(S2Event.DATA_CELL_CONTEXT_MENU, (event) => {
{
console.log("右键点击了单元格", event);
const cell = this.spreadsheet.getCell(event.target);
const meta = cell.getMeta();
console.log("===debug=== meta: ", meta);
console.log("cell", cell);
}
{
// 首先拿到单元格当前信息
const cell = this.spreadsheet.getCell(event.target);
const meta = cell.getMeta();
// 获取当前行数据
const rowData = this.spreadsheet.dataSet.getCellData({
query: meta.query,
});
// 获取当前行头单元格数据:
const rowCellData = this.spreadsheet.dataSet.getCellData({
query: meta.query,
});
// 获取当前行头维值
const dimensionValues = this.spreadsheet.dataSet.getDimensionValues(
meta.field
);
console.log("当前行数据:", rowData);
console.log("当前行头单元格数据:", rowCellData);
console.log("当前行头维值:", dimensionValues);
}
});
this.spreadsheet
.getCanvasElement()
.addEventListener("contextmenu", (event) => {
// 禁止弹出右键菜单
event.preventDefault();
});
}
}
fetch(
"https://gw.alipayobjects.com/os/bmw-prod/2a5dbbc8-d0a7-4d02-b7c9-34f6ca63cff6.json"
)
.then((res) => res.json())
.then((dataCfg) => {
const container = document.getElementById("container");
const s2Options = {
width: 600,
height: 480,
style: {
// 了解更多: https://s2.antv.antgroup.com/api/general/s2-options#style
layoutWidthType: "adaptive",
},
interaction: {
customInteractions: [
{
key: "ContextMenu",
interaction: ContextMenu,
},
],
},
};
const s2 = new PivotSheet(container, dataCfg, s2Options);
s2.render();
});
示例代码如上
from s2.
用的什么版本, issue 请按照模版填写, 下次直接关闭了
from s2.
用的什么版本, issue 请按照模版填写, 下次直接关闭了
👌
看了下使用的是1.55.7版本
from s2.
1.x 的文档不太全.
- 你监听的是 dataCell 的右键, 你想获取对应的当前行, 本质上就是获取当前行头的数据, 所以是获取一组数据 (getMultiData) 而不是单个数据 (getCellData), 用
meta.rowQuery
查询就好了. 同理, 当前列就用 colQuery
class ContextMenu extends BaseEvent {
bindEvents() {
this.spreadsheet.on(S2Event.DATA_CELL_CONTEXT_MENU, (event) => {
{
const cell = this.spreadsheet.getCell(event.target);
const meta = cell?.getMeta();
// 获取当前行数据
const rowData = this.spreadsheet.dataSet.getMultiData(meta?.rowQuery);
}
});
}
}
- 粘贴代码请遵循基本的 markdown 格式.
- 使用问题请直接在讨论区 https://github.com/antvis/S2/discussions/categories/q-a 提问
from s2.
你好 @voidman2017, Issue 板块是用于 bug 反馈与需求讨论的地方。你可以试着在 antv s2 discussions 新开一个 discussion, 选择 🙏Q&A
类别进行提问, 我们会及时进行解答, 感谢你的理解。
Hello, @voidman2017. The Issue section is used for bug feedback and requirement discussion. You could open a new discussion in antv s2 discussions, choose the 🙏Q&A
category to ask questions. We will answer in time. Thanks so much for your understanding.
from s2.
1.x 的文档不太全.
- 你监听的是 dataCell 的右键, 你想获取对应的当前行, 本质上就是获取当前行头的数据, 所以是获取一组数据 (getMultiData) 而不是单个数据 (getCellData), 用
meta.rowQuery
查询就好了. 同理, 当前列就用 colQueryclass ContextMenu extends BaseEvent { bindEvents() { this.spreadsheet.on(S2Event.DATA_CELL_CONTEXT_MENU, (event) => { { const cell = this.spreadsheet.getCell(event.target); const meta = cell?.getMeta(); // 获取当前行数据 const rowData = this.spreadsheet.dataSet.getMultiData(meta?.rowQuery); } }); } }
- 粘贴代码请遵循基本的 markdown 格式.
- 使用问题请直接在讨论区 https://github.com/antvis/S2/discussions/categories/q-a 提问
那如果是TableSheet是否无法实现该功能
from s2.
文档有写, 请认真阅读, 明细表一行就是一条数据, 根据 rowIndex 去查, 两者等价:
from s2.
Related Issues (20)
- 🤔S2明细表在使用tooltip 对dataCell自定义时 抛出异常! HOT 1
- 🤔S2明细表修改单元格的样式 HOT 1
- 🐛Meta formatter data 参数在导出和复制中未传入 HOT 4
- 🤔透视表树模式只有叶子节点才展示数据 HOT 2
- 🤔 qiankun框架中应用@antv/s2-react ,发布打包会报错 HOT 2
- 🤔 antv/s2-react 1.6版本的数据格式是什么样的? HOT 2
- 🐛asyncGetAllPlainData 自定义导出类型 customTransformer 配置 text/html 无效 HOT 1
- 🤔列头能换行吗?不要省略号 HOT 4
- 1.x版本升级到2版本,数值类型的数据必须都转成字符串,不然totals汇总不出来 HOT 2
- 1.x升级到2.x版本,数值类型必须都要转成字符串类型,不然后totals汇总不出来 HOT 2
- 🐛动态设置RowCell字体大小时,行高错位 HOT 3
- 🐛透视表开启序号列后,行冻结失效
- 🐛S2父级及以上的节点,添加了transform: scale(1.1)后,透视表分组排序按钮失效;(设置supportCSSTransform后依然无效) HOT 3
- 🐛下载格式化数据内容有,逗号的会在Excel中按逗号拆分成多个单元格,但是复制格式化数据就不会出现这种情况 HOT 1
- 🤔getContentHeight可以获取实际内容高度,那如何获取实际内容的宽度呀 HOT 1
- 🐛onContextMenu 回调参数与文档不符
- 🐛浏览器缩放导致表格模糊问题 HOT 1
- 🐛 导出方法 copyData 在有手动隐藏列的情况下,导出的数据中,对应隐藏列的数据依然被导出,导致与表头错位 HOT 1
- 🤔 HOT 2
- 🤔透视表:自定义列头;合并列头排序没有效果 HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from s2.