Eplot: แพ็กเกจใหม่สำหรับสร้างชาร์ตใน Emacs

 (lars.ingebrigtsen.no)
1 คะแนน โดย GN⁺ 2024-06-28 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • eplot เป็นแพ็กเกจสำหรับวาดชาร์ตง่าย ๆ จากข้อมูลตัวเลขภายใน Emacs โดยเริ่มมาจากข้อจำกัดด้านการแสดงแกนและการใช้งานของ chart.el รวมถึงชุด Org/Gnuplot
  • ประเด็นที่คิดหนักที่สุดคือ สเกลแกน Y ซึ่งต้องจัดการตัวเลขที่ดูดีในชุด 1·2·5 รวมถึงสเกลสุดขั้วและช่วงเวลาให้เป็นธรรมชาติ
  • ผู้พัฒนานำประสบการณ์จากไลบรารีชาร์ต PHP เดิมมาย้ายเป็น Emacs Lisp และทำการแสดงผลอย่างกราเดียนต์บนฐาน SVG รวมถึงดาร์กโหมด แต่ตัดเอฟเฟกต์บางส่วนที่ต้องจัดการระดับพิกเซลออกไป
  • เมื่อรัน M-x eplot ในบัฟเฟอร์ที่มีตัวเลขจำนวนมาก จะเปิดบัฟเฟอร์ชาร์ตขึ้นมา และสามารถเปลี่ยนการตั้งค่าด้วย headers กับ C-c C-c เพื่อดูผลลัพธ์ได้อย่างรวดเร็ว
  • โค้ดเผยแพร่บน GitHub แล้ว แต่ยังเป็น โค้ดที่อยู่ระหว่างพัฒนา ซึ่งเขียนอย่างรวดเร็วโดยเน้นเทสต์เคสในช่วงหนึ่งสัปดาห์ จึงยังเหลืองานจัดระเบียบเส้นทางโค้ดและปรับปรุงความอ่านง่าย

เหตุผลที่อยากวาดชาร์ตได้โดยตรงใน Emacs

  • หลังจากมองหาวิธีสร้างพล็อตง่าย ๆ มาเป็นเวลานาน ผู้เขียนได้ลองใช้ chart.el ที่มีใน Emacs ตอนเขียนบทความเกี่ยวกับคะแนนภาพยนตร์
  • แม้ chart.el จะรวมอยู่ใน Emacs แต่เดิมเป็นฟีเจอร์ที่เริ่มจากเครื่องมือทดสอบ eieio จึงมีขอบเขตการใช้งาน ค่อนข้างจำกัด
  • งานที่ต้องการโดยรวมทำได้เป็นส่วนใหญ่ แต่โดยเฉพาะ การแสดงแกน Y ยังไม่น่าพอใจ

สเกลแกนที่กำหนดคุณภาพของชาร์ต

  • การแสดงแกนที่แย่จะสังเกตเห็นได้ง่าย แต่การทำให้ดูเป็นธรรมชาติจริง ๆ ต้องจัดการกรณีขอบเขตต่าง ๆ อย่างรอบคอบ
  • Google Finance ในอดีตก็เคยใช้ แกนที่ไม่เป็นธรรมชาติ โดยตั้งค่าที่มากที่สุดเป็นสเกลบนสุดของแกน Y แล้วเพิ่มเส้นที่มีระยะห่างเท่ากันลงไปทางจุดกำเนิด
    • จำได้ว่าชาร์ตลักษณะนี้มีอยู่จนถึงราวปี 2021
    • หลังจากนั้นเมื่อทำเว็บไซต์ใหม่ทั้งระบบ จึงได้แกนที่ดีกว่าเดิม
  • ผู้เขียนมีประสบการณ์สร้าง chart library ขณะทำงานที่บริษัทนายหน้าซื้อขายหุ้นราวปี 1997
  • ปัญหาเรื่องสเกลแกนไม่ใช่โจทย์คณิตศาสตร์ที่ยากเท่าไร แต่ใกล้เคียงกับการเลือกตัวเลขที่ดูดีและช่วงข้อยกเว้นอย่างละเอียดรอบคอบมากกว่า
    • ตัวเลขที่ดูดีโดยทั่วไปคือหลายสเกลของ 1, 2, 5
    • ในชาร์ตหุ้นอาจมีช่วงอย่าง $0.00001~$0.00002 หรือ 1e9~1e10 ได้
    • แกนเวลาต้องพิจารณาตั้งแต่ปี ครึ่งปี ไตรมาส เดือน สัปดาห์ ไปจนถึงกรณีแบ่งเดือนเป็นหน่วยสัปดาห์

จุดที่ใช้เครื่องมือเดิมตรง ๆ ได้ยาก

  • ไลบรารีชาร์ต PHP ที่เคยทำไว้นั้นสะดวกสำหรับสร้างผลลัพธ์บนเว็บเซิร์ฟเวอร์ แต่ไม่เหมาะกับการลองปรับตัวเลขและทดลองภายใน Emacs
  • เช่นเดียวกับเหตุผลที่ Excel และ Jupyter Notebook ได้รับความนิยม กระบวนการ ปรับข้อมูลแบบอินเทอร์แอกทีฟ เพื่อเข้าใกล้ชาร์ตที่ต้องการนั้นสำคัญมาก
  • Org ก็มีฟีเจอร์พล็อตเช่นกัน แต่ Org plot ใช้ Gnuplot เป็นแบ็กเอนด์
  • แม้โดยรวม Gnuplot จะใช้งานได้ดี แต่เมื่อต้องเปลี่ยนค่าปริยาย เช่น รูปแบบตัวเลขบนแกน Y ในตัวอย่าง ภาระอาจเพิ่มขึ้นมาก

การพัฒนา eplot และฟีเจอร์ด้านการแสดงผล

  • ชื่อ chart ถูกใช้อยู่แล้ว จึงตั้งชื่อแพ็กเกจใหม่ว่า eplot
  • เดิมไม่ได้ตั้งใจจะย้ายฟีเจอร์ทั้งหมดของไลบรารี PHP เดิมมา แต่เมื่อเริ่มพัฒนาแล้วก็ลงเอยด้วยการสร้างส่วนใหญ่ขึ้นมาใหม่
  • เวอร์ชันใหม่นี้มีฟีเจอร์อย่าง ดาร์กโหมด ด้วย
  • กราเดียนต์ในไลบรารี PHP เป็นวิธีที่เขียนด้วยมือ และเท่าที่จำได้ยังมีสิ่งอย่างทรัพยากรคัลเลอร์แมปของ GIF รวมอยู่ด้วย
  • เวอร์ชัน Emacs Lisp ใช้ SVG
    • เนื่องจาก SVG รองรับกราเดียนต์ จึงผสานโพลีกอนกับกราเดียนต์เพื่อสร้างเอฟเฟกต์คล้ายกัน
    • สามารถได้ผลลัพธ์ใกล้เคียงกับต้นฉบับ PHP
  • กราเดียนต์แปลก ๆ อีกแบบหนึ่งไม่ได้ถูกพัฒนา
    • เพราะต้องทำในระดับพิกเซล หรืออย่างน้อยก็ระดับเส้น จึงทำได้ยาก
    • อาจต้องใช้การคำนวณทางคณิตศาสตร์ จึงตัดออกไป

ขั้นตอนการใช้งานและวิธีตั้งค่า

  • เมื่อรัน M-x eplot ในบัฟเฟอร์ที่มีตัวเลขจำนวนมาก ชาร์ตจะแสดงในบัฟเฟอร์แยกต่างหาก
  • เพื่อปรับชาร์ตให้เป็นรูปแบบที่ต้องการ จึงนำแนวคิด headers มาใช้
  • ตัวเลือกที่มีประโยชน์ส่วนใหญ่ควบคุมได้ด้วย headers
    • หลังเพิ่ม headers แล้วกด C-c C-c ก็ตรวจดูผลลัพธ์ได้ทันที
    • ยังมี eplot mode เพื่อให้ทำสิ่งนี้ได้ง่ายขึ้นด้วย
  • ตัวอย่างง่าย ๆ แสดงในรูปแบบชาร์ตขนาดเล็ก และรูปแบบต่าง ๆ หลายแบบในภาพแรกของบทความก็ทำด้วย headers เป็นส่วนใหญ่

สถานะการเผยแพร่และงานที่เหลือ

  • มีการเขียน README.md เพื่อบันทึกความเป็นไปได้ต่าง ๆ ไว้
  • โค้ดเผยแพร่ที่ Microsoft Github
  • สถานะปัจจุบันยังคงเป็น work in progress
  • โดยพื้นฐานมองว่าน่าจะมีประโยชน์ได้ในระดับหนึ่ง แต่เนื่องจากเป็นสภาพที่เขียนและแก้ต่อเนื่องตลอดหนึ่งสัปดาห์ จึงยังฟันธงเรื่องเสถียรภาพได้ยาก
  • โค้ดถูกเขียนแบบไม่มีประสิทธิภาพตามเทสต์เคสต่าง ๆ จึงอยู่ในสภาพที่ ต้องจัดระเบียบ
    • ต้องรวมเส้นทางโค้ดหลายส่วนเข้าด้วยกัน
    • ต้องเพิ่มความอ่านง่ายของโค้ด
  • ตอนนี้ผู้เขียนพุชสถานะปัจจุบันเพื่อพักก่อน และผู้ใช้จริงยังต้องระมัดระวัง

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2024-06-28
ความคิดเห็นจาก Hacker News
  • เรียบดี! วิธีใส่ gradient นั้นทั้งเรียบง่ายและฉลาดมาก
    ในฐานะคนที่ชอบงานด้านนี้ ขอเสริมคำแนะนำทั่วไปหน่อย ตอนก่อนหน้านี้เคยทำงานเป็นวิศวกรกับ Max Roser และ Hannah Ritchie ที่ Our World in Data บนไลบรารี Grapher (https://github.com/owid/owid-grapher) และได้เรียนรู้เยอะมากเกี่ยวกับการทำกราฟที่ดี
    จากตัวอย่าง อยากแนะนำว่าอย่ามองข้าม ชื่อเรื่อง·ชื่อรอง·คำบรรยาย เลย คุณทำ “หัวข้อแบบเรียบง่าย” ไว้แล้ว ดังนั้นคงใส่ได้ไม่ยาก และข้อความสั้น ๆ ไม่กี่คำก็สร้างความต่างได้มาก ขอแนะนำ “Storytelling with Data” ของ Cole Nussbaumer Knaflic ด้วย
    ถ้าพัฒนาต่อไปเรื่อย ๆ สักวันหนึ่งคงอยากใส่ ไลบรารี data flow และ DSL ด้วย dplyr ของ Hadley Wickham ใน R นั้นยอดเยี่ยมมาก และผมก็อ้างอิงแนวทางนั้นในเครื่องมือ Ohayo ของตัวเองกับไลบรารี CoreTable ของ OWID Grapher (https://github.com/owid/owid-grapher/tree/master/packages/%4...) เช่นกัน ไลบรารี Arquero ของ Jeffrey Heer ที่ค่อนข้างใหม่ (https://idl.uw.edu/arquero/) ก็อยู่ในสายคล้ายกัน
    ช่วงนี้กำลังดูเครื่องมือใหม่ Plot ของ Mike Bostock (https://observablehq.com/plot/) อยู่ แม้จะเพิ่งลองได้แค่วันสองวันแต่ก็น่าคาดหวัง ตอนนี้ผมไม่ได้ใช้ Emacs แล้ว แต่หวังว่าสิ่งที่พูดมาจะเป็นประโยชน์
  • อ้อ ถึงว่าทำไมช่วงนี้ถึงหาโพสต์ “แก้บั๊ก Emacs 10%” ไม่เจอ ที่แท้กำลังทำสิ่งนี้อยู่นี่เอง เจ๋งมาก เป็นเซียน Emacs ของจริง
  • ดูดีมาก! ถ้าใช้ความสามารถ file-local และ directory-local variables ของ Emacs กับการตั้งค่ากราฟ ก็น่าจะทำให้ประสบการณ์ใช้งานยืดหยุ่นขึ้นอีก
    เช่น เวลากำลังสร้างไฟล์ข้อมูลอยู่ อาจไม่อยากมาแก้ด้วยมือก่อนวาดกราฟ หรือถ้ามีไดเรกทอรีที่เต็มไปด้วยไฟล์ข้อมูลขนาดใหญ่ ก็อาจอยากลองวาดตามต้องการโดยไม่ต้องใส่ header ให้แต่ละไฟล์ด้วยมือ
  • เวลาเขียนกราฟใน org mode ก็ใช้ Python และ matplotlib ได้เหมือนกัน ไม่ได้มีแค่ Gnuplot
    • API ของ Matplotlib เองก็ใช้งานไม่ค่อยสะดวกอยู่แล้ว และถ้าจะเอา wrapper elisp มาครอบอีกชั้น ก็ดูไม่น่าจะกลายเป็นเครื่องมือที่ใช้ง่ายนัก
      อย่างที่ต้นฉบับบอกไว้ มีโอกาสสูงว่าจะกลายเป็นกรณีที่ปริมาณโค้ดที่ต้องใช้มากกว่าการทำเองเสียอีก
    • สิ่งที่รบกวนใจผมเสมอใน matplotlib กับ gnuplot คือมันดูเหมือนมีคำสั่งหรือฟังก์ชันแยกต่างหากสำหรับแทบทุกอย่างตามตัวอักษร
      ถ้าจะเปลี่ยนขนาด tick ขั้นที่สามของแกน Y ก็เหมือนต้องเรียกอะไรแบบ set_third_level_y_ticks() ไม่ได้บอกว่ามันแย่เสมอไป หรือบางทีมันอาจต้องเป็นแบบนั้น แต่ความรู้สึกคือทุกอย่างดูเป็นกรณีพิเศษไปหมด ทำให้รู้สึกว่าขาด orthogonality
    • มี ESS (Emacs Speaks Statistics) ด้วย มันผูก R/Julia เข้ากับ org-mode ได้แน่นมาก เลยใช้พวก ggplot2 หรือ makie ได้
      ถึงอย่างนั้นก็ยังนับถือความพยายามที่จะสร้างอะไรสักอย่างด้วย elisp ล้วน
    • ใช้ R และ ไลบรารีกราฟ ของมันได้เหมือนกัน
  • แฮ็กได้ถึงแก่นจริง ๆ โดยเฉพาะส่วน gradient นั้นชอบมาก
    ที่สำคัญกราฟพวกนี้เป็น SVG จึงเอาไปใช้กับ LaTeX หรือเว็บเบราว์เซอร์ได้ด้วย อันแรกนี่เป็นตัวเลือกที่น่าสนใจมากเวลาต้องทำกราฟเพื่อแทรกในงานวิจัย ผลลัพธ์ดีมาก
  • นี่เป็นครั้งแรกที่ผมเห็นคำสองคำ “Microsoft Github” วางติดกันแบบโจ่งแจ้ง และไม่ว่าความจริงนี้จะเกิดขึ้นมาหลายปีแล้วก็ยังรู้สึกไม่สบายใจอยู่ดี
    • ผมยังไม่เข้าใจว่าทำไมหลายโปรเจกต์เสรีและโอเพนซอร์สยังใช้แพลตฟอร์มนั้นอยู่ GitHub ประสบความสำเร็จมากในการทำให้คนไม่เห็นคำนำหน้า Microsoft
      ถึงอย่างนั้นตอนนี้ก็ดูเหมือน Codeberg กำลังเริ่มมีแรงส่งในหมู่โปรเจกต์เสรีและโอเพนซอร์สบ้างแล้วในที่สุด
    • เพราะงั้น GitHub เลยยังดูเหมือนพยายามทำตัวให้เหมือนสตาร์ตอัปอิสระแบบเดิมอยู่ นักพัฒนาอิสระจำนวนมากก็น่าจะรู้สึกคล้ายกัน และเอนเอียงไปทางคุณค่าเรื่อง เสรีภาพของซอฟต์แวร์ มากกว่าคุณค่าผู้ถือหุ้นหรือทุนนิยมบิ๊กเทค
      เมื่อกี้ผมลองเปิดหน้าแรกของ github.com แล้วกด Ctrl-F หา “Microsoft” ผลคือ 0 รายการ
    • ผมก็มีปฏิกิริยาเหมือนกันเป๊ะ หวังว่าสักวันจะไม่รีแบรนด์เป็น MS GitHub