當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

如何利用echarts图表获取条状图点击名称和值

發布時間：2023/12/9 编程问答 35 豆豆

生活随笔收集整理的這篇文章主要介紹了如何利用echarts图表获取条状图点击名称和值小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

聽語音

分步閱讀

echarts圖表插件工具，包含了各種不同類型的圖形，有圓餅圖、折線圖、圓環圖、柱狀圖等。其中，各種圖形帶有事件，觸發事件可以獲取到名稱和值，下面利用一個實例說明點擊條狀圖獲取名稱和值，操作如下：

https://jingyan.baidu.com/article/a3aad71ae1f3a7b1fb009689.html

第一步，新建靜態頁面bar.html，修改title并引入echarts js文件，如下圖所示：

第二步，添加條狀圖容器，在<body></body>插入一個div，并給出id屬性和寬度高度，如下圖所示：

第三步，編寫生成條狀圖的js代碼，添加數據和樣式，如下圖所示：

第四步，預覽該圖形界面，可以看到效果圖，如下圖所示：

第五步，編寫點擊條狀圖的柱子，然后獲取它們的name和value，如下圖所示：

第六步，再次預覽該界面，打開瀏覽器的控制臺，查看打印結果，如下圖所示：

END

以上是生活随笔為你收集整理的如何利用echarts图表获取条状图点击名称和值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。