เครื่องมือจัดการเมตริก

Metrics Manager จะรวบรวมและรายงานเมตริกทั้งหมดที่เกี่ยวข้องกับพื้นที่ทำงาน Blockly คู่มือนี้อธิบายความหมายของชุดเมตริกแต่ละชุด ที่ส่งคืนจากตัวจัดการเมตริก ดูข้อมูลเพิ่มเติมเกี่ยวกับตัวจัดการเมตริกได้ที่เจาะลึกเมตริกปี 2021

เมตริก

เมตริกกล่องเครื่องมือ

workspace.getMetricsManager().getToolboxMetrics();

เมตริกกล่องเครื่องมือประกอบด้วย height width และ position ของกล่องเครื่องมือหมวดหมู่ ซึ่งไม่รวมข้อมูลในแถบเลื่อนที่ ติดอยู่กับกล่องเครื่องมือ

พื้นที่ทำงาน Blockly ที่มีลูกศรแสดงความกว้างและความสูงของ
กล่องเครื่องมือ

positionของกล่องเครื่องมือเป็นประเภท Blockly.utils.toolbox.Position

เมตริกเมนูแบบเลื่อนออก

workspace.getMetricsManager().getFlyoutMetrics();

เมตริกเมนูแบบเลื่อนลงประกอบด้วย height, width และ position ของ กล่องเครื่องมือเมนูแบบเลื่อนลง โปรดทราบว่านี่ไม่ใช่เมนูแบบเลื่อนลงที่ แนบมากับกล่องเครื่องมือหมวดหมู่ ซึ่งเกี่ยวข้องกับกล่องเครื่องมือแบบเมนูย่อยเท่านั้น ดังที่แสดงในรูปภาพด้านล่าง

พื้นที่ทํางาน Blockly ที่มีลูกศรแสดงความกว้างและความสูงของ
เมนูย่อย

positionของฟลายเอาต์เป็นประเภท Blockly.utils.toolbox.Position

เมตริก SVG

workspace.getMetricsManager().getSvgMetrics();

เมตริก SVG ประกอบด้วย width และ height ของ SVG หลักของพื้นที่ทำงาน สำหรับพื้นที่ทำงานหลัก นี่คือ SVG ที่มีคลาส blocklySvg SVG นี้ประกอบด้วยพื้นที่ทํางานที่มองเห็นได้และกล่องเครื่องมือ

พื้นที่ทำงาน Blockly ที่มีสี่เหลี่ยมผืนผ้าสีน้ำเงินล้อมรอบ

ดูเมตริก

workspace.getMetricsManager().getViewMetrics(opt_getWorkspaceCoordinates);

เมตริกการดูประกอบด้วย height, width, top และ left ของ วิวพอร์ต วิวพอร์ตคือส่วนของพื้นที่ทำงานที่มองเห็นได้ ซึ่งไม่รวมกล่องเครื่องมือทั้ง 2 ประเภท

พื้นที่ทํางาน Blockly ที่มีสี่เหลี่ยมผืนผ้าสีน้ำเงินล้อมรอบพื้นที่ที่ไม่รวม
กล่องเครื่องมือ

โดยด้านซ้ายบนจะสัมพันธ์กับจุดเริ่มต้นของพื้นที่ทำงาน ขณะที่เราลากไปรอบๆ พื้นที่ทํางาน ระบบจะอัปเดตตําแหน่งด้านบนและด้านซ้ายของวิวพอร์ต

พื้นที่ทํางาน Blockly ที่มีสี่เหลี่ยมผืนผ้าสีน้ำเงินล้อมรอบพื้นที่ที่ไม่รวมกล่องเครื่องมือ และต้นทางที่แสดงออฟเซ็ตจากมุมซ้ายบน

เมตริกสัมบูรณ์

workspace.getMetricsManager().getAbsoluteMetrics();

เมตริกสัมบูรณ์ประกอบด้วยออฟเซ็ต top และ left ของวิวพอร์ต จาก SVG หลัก โดยปกติแล้วค่านี้จะเป็นความกว้างหรือความสูงของกล่องเครื่องมือ ทั้งนี้ขึ้นอยู่กับตำแหน่งของกล่องเครื่องมือใน พื้นที่ทํางาน

พื้นที่ทํางาน Blockly ที่มีเส้นสีน้ำเงินทางด้านขวาของกล่องเครื่องมือและด้านบน
ของ
พื้นที่ทํางาน พื้นที่ทำงาน Blockly ที่มีกล่องเครื่องมือแนวนอน มีเส้นสีน้ำเงินทางด้าน
ซ้ายของพื้นที่ทำงานและด้านล่าง
กล่องเครื่องมือ

ตัวชี้วัดเนื้อหา

workspace.getMetricsManager().getContentMetrics(opt_getWorkspaceCoordinates);

เมตริกเนื้อหาประกอบด้วย height, width, top และ left ของ กรอบล้อมรอบความคิดเห็นในบล็อกหรือพื้นที่ทำงาน

พื้นที่ทำงาน Blockly ที่มีกล่องสีน้ำเงินล้อมรอบเนื้อหาของพื้นที่ทำงาน

เมตริกการเลื่อน

workspace.getMetricsManager().getScrollMetrics(opt_getWorkspaceCoordinates);

เมตริกการเลื่อนประกอบด้วย height, width, top และ left ของ พื้นที่ที่เลื่อนได้ สำหรับพื้นที่ทำงานที่เลื่อนได้ พื้นที่ที่เลื่อนได้คือพื้นที่เนื้อหา บวกระยะห่างบางส่วน

พื้นที่ทํางาน Blockly ที่มีกล่องสีน้ำเงินขนาดใหญ่ล้อมรอบ

ระบบพิกัด

โดยค่าเริ่มต้น ระบบจะแสดงเมตริกทั้งหมดที่คำนวณโดยตัวจัดการเมตริกเป็นพิกเซล พิกัด ในกรณีที่เกี่ยวข้อง คุณจะมีตัวเลือกในการรับเมตริกบางอย่างใน พิกัดพื้นที่ทํางานโดยส่ง true ไปยังเมธอดเมตริก เช่น metricsManager.getViewMetrics(true)

workspaceCoordinate = pixelCoordinates / workspace.scale

โดยทั่วไปแล้ว ระบบจะใช้พิกัดพื้นที่ทำงานกับรายการที่อยู่ในพื้นที่ทำงาน เช่น บล็อกและความคิดเห็นในพื้นที่ทำงาน พิกัด Workspace จะไม่เปลี่ยนแปลงเมื่อ ผู้ใช้ซูมเข้าและออก

การลบล้างเมตริก

นักพัฒนาซอฟต์แวร์ที่ต้องการระบุเมตริกของตนเองสำหรับพื้นที่ทํางานสามารถลงทะเบียน ออบเจ็กต์เครื่องมือจัดการเมตริกทดแทนที่ใช้IMetricsManager อินเทอร์เฟซหรือขยาย Blockly.MetricsManager ได้

ตัวอย่างของฟีเจอร์นี้ดูได้ในปลั๊กอิน Continuous Toolbox หรือในปลั๊กอิน Fixed Edges