You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by "Manahil-Afzal (via GitHub)" <gi...@apache.org> on 2026/01/15 18:20:17 UTC

[PR] Enhance Basic and Smoothed Line Charts with Interactive Tooltips [echarts-examples]

Manahil-Afzal opened a new pull request, #133:
URL: https://github.com/apache/echarts-examples/pull/133

   ## Description
   This PR enhances the Basic Line Chart and Smoothed Line Chart examples in the `echarts-examples` repository by adding interactive tooltips. 
   
   Currently, the examples display static data but do not allow users to easily see the corresponding X-axis category and Y-axis value for each point.
   
   ---
   
   ## Before
   - **Basic Line Chart:** [150, 230, 224, 218, 135, 147, 260]  
     (Static, no tooltip interactivity)  
   ![Uploading Basic Line Chart.gif…]()
   
   - **Smoothed Line Chart:** [820, 932, 901, 934, 1290, 1330, 1320]  
     (Static, no tooltip interactivity)  
   ![Smooth Line Chart](https://github.com/user-attachments/assets/1bf89382-9799-462e-ad19-215ba002ab41)
   
   ---
   ## Added/Changes
   - Implemented a **tooltip formatter** to show the category (X-axis) and value (Y-axis) when hovering or clicking on a point.
   - Applied this functionality to **both Basic and Smoothed Line Chart examples**.
   - Enhanced charts for better **developer learning experience**, making them more interactive.
   - Updated `line-simple.ts` and `line-smooth.ts` files with the tooltip logic.
   - Added `symbolSize` and `emphasis` options to highlight points on hover.
   
   ---
   
   ## After
   - Users can now hover over any data point on the chart and see its category and value instantly.
   - Both line charts are interactive, making them more informative for developers.  
   
   > ![After Basic Line](https://github.com/user-attachments/assets/790a84c7-2b35-477e-bf7e-c34a3cf74dab)
   
   ![After Basic Line](https://github.com/user-attachments/assets/0c92853f-4571-4c44-acd9-d8107156c053)
   
   ---
   
   ## More Clarification
   - This PR **does not modify any unrelated files**; only the two line chart examples were updated.
   - The tooltip enhancement is consistent with ECharts’ best practices for chart interactivity.
   - These updates help developers quickly understand data points without inspecting code manually.
   
   


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org

Re: [PR] Enhance Basic and Smoothed Line Charts with Interactive Tooltips [echarts-examples]

Posted by "Manahil-Afzal (via GitHub)" <gi...@apache.org>.
Manahil-Afzal closed pull request #133: Enhance Basic and Smoothed Line Charts with Interactive Tooltips
URL: https://github.com/apache/echarts-examples/pull/133


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org

For queries about this service, please contact Infrastructure at:
users@infra.apache.org


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org