Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.1k views
in Technique[技术] by (71.8m points)

Echarts 如何实现右键菜单?

请教关于右键菜单的建立
希望能在echarts中能右键,弹出菜单界面进行操作
百度和github的issue搜索,没能找到有效的用例.根据几个零散帖子的内容没能成功复现,可能是版本原因都是echarts2/3的,现在都5了.

<div id="menu" style="display:none;">
    <ul>
        <!--右键弹出菜单-->
        <li id="menu_1" onClick="alert('功能1');"> 
            <font>功能1</font>
        </li>
        <li id="menu_1" onClick="alert('功能2');"> 
            <font>功能2</font>
        </li>
    </ul>
</div>`
div_node[0].oncontextmenu = () => false;
zr.on('contextmenu', function(params) {
            // console.log(params);
            var oEvent = params.event;
            var menu = document.getElementById("menu"); 
            menu.style.display = "block";
            // //让自定义菜单随鼠标的箭头位置移动
            menu.style.left = oEvent.offsetX + "px"; 
            menu.style.top = oEvent.offsetY+20 + "px";
        }
    );

未能实现效果,请问哪里出错了?或者给出一个简短的例子


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

https://www.makeapie.com/edit...
找到了一位大佬几年前的用例,经过测试确实是可以使用


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...