Paperscope และ Paperjs

ดังนั้นฉันจึงพยายามสร้างโปรเจ็กต์ที่มีองค์ประกอบแคนวาสสององค์ประกอบ โดยแต่ละองค์ประกอบมีเอกสารของตัวเอง และมีปุ่มด้านนอกของแต่ละองค์ประกอบที่ควบคุมฟังก์ชันบางอย่างภายในทั้งสององค์ประกอบ

ภายใต้เอกสารประกอบภายใต้ Paperscript ระบุว่า:

โปรดทราบ: เมื่อรวม PaperScript มากกว่าหนึ่งรายการในหน้าเดียว แต่ละสคริปต์จะทำงาน >ในขอบเขตของตัวเอง และจะไม่เห็นออบเจ็กต์และฟังก์ชันที่ประกาศใน >อื่นๆ เพื่อให้ PaperScript สื่อสารกับ PaperScript อื่นๆ หรือโค้ด >JavaScript โปรดดูบทช่วยสอนเกี่ยวกับการทำงานร่วมกันของ PaperScript

... ซึ่งน่าเสียดายเพราะบทช่วยสอนดังกล่าวมีดังต่อไปนี้:

มาเร็ว ๆ นี้!

ฉันติดขัดอย่างรวดเร็วในกระบวนการนี้ ฉันได้ลองวางฟังก์ชันในขอบเขตสากล เรียกฟังก์ชันเหล่านี้จากนอกแคนวาส และเห็นฟังก์ชันเหล่านี้พิมพ์บนผืนผ้าใบผิด ฉันได้ลองส่งออกฟังก์ชันผ่านโมดูลแล้วและดูเหมือนว่าจะเรียกใช้ฟังก์ชันนี้ (?!?!) และที่แย่ที่สุดคืออ็อบเจ็กต์ 'paper.projects' นั้นเป็นอาร์เรย์ที่มีโปรเจ็กต์หนึ่ง (!) อยู่ในนั้น ซึ่งเป็นผืนผ้าใบแรก

ฉันจึงนิ่งงัน

ใครรู้วิธีการทำเช่นนี้?

แก้ไข: เห็นได้ชัดว่ามีคำตอบนี้ แต่ฉันไม่เห็นว่าจะทำให้ฉันสามารถโทรได้อย่างไร ฟังก์ชั่นในขอบเขต PaperScript จากสคริปต์ขอบเขตส่วนกลาง

นั่นดูเหมือนเป็นสคริปต์สำหรับเรียกใช้ฟังก์ชันส่วนกลางใน PaperScope ซึ่งใช้ไม่ได้สำหรับฉันหากฉันพยายามให้ปุ่มภายนอกทำสิ่งต่างๆ

เห็นได้ชัดว่าฉันขาดอะไรบางอย่างไป

แก้ไขครั้งที่สอง: ฉันได้เล่นกับฟังก์ชั่นระดับโลกต่างๆ ทั้งใน window.global หรือเพียงแค่นั่งอยู่คนเดียวโดยไม่มีการประกาศ var ... แต่สิ่งที่ดูเหมือนจะเกิดขึ้นคือเมื่อฉันพยายามเรียกใช้ฟังก์ชันที่ฉันกำหนดไว้ ให้พูดเป็น : :

globals.makecircle = function () {
    var o = new Path.Circle({
        radius: 50,
        center: new Point (200,200)
    })
}

ในขอบเขตหลัก มันจะทำงานในหน้าต่างที่ไม่ถูกต้องเหมือนกับหน้าต่างที่ถูกต้องทันที นอกจากนี้ยังมีความล่าช้าอย่างไม่น่าเชื่อก่อนที่มันจะทำงานซึ่งฉันคิดไม่ออก

แก้ไขครั้งที่สาม: เพื่อความชัดเจน

ฉันได้แนบ firstcanvas.js กับ canvas1 ใน HTML ของฉัน ฉันมี secondcanvas.js แนบไปกับ canvas2 ทั้งสองถูกอ้างอิงเป็นประเภทเอกสารเป็น:

<script type="text/paperscript" src="scripts/firstcanvas.js" canvas="canvas1"></script>
        <script type="text/paperscript" src="scripts/secondcanvas.js" canvas="canvas2"></script>

ฉันสร้างวัตถุ window.globals ตามที่ Jurg แนะนำ ฉันเรียกมันจาก main.js ด้วยปุ่มเช่น:

window.globals = {}
`$('document').ready($('#dfs').on('click', window.globals.makecircle))`

ฉันเพิ่มฟังก์ชันนี้ใน globals ใน firstcanvas.js ดังข้างต้น

หากฉันคลิกบน Canvas2 ครั้งล่าสุด การคลิกปุ่มที่มี id='DFS' จะทำให้ฟังก์ชันทำงานล่าช้ามากบน Canvas2

และ paper.projects ไม่ได้แสดงรายการทั้งสองโครงการ ดังนั้นฉันจึงใช้ฟังก์ชัน activate() ไม่ได้


person Joshua Penman    schedule 20.01.2015    source แหล่งที่มา
comment
ให้ตัวอย่างสิ่งที่คุณกำลังประสบปัญหาจริงๆ   -  person Etheryte    schedule 20.01.2015
comment
นั่นยังไม่ชัดเจนพอเหรอ?   -  person Joshua Penman    schedule 20.01.2015
comment
คุณไม่ได้แสดงรหัสที่แสดงถึงปัญหาของคุณ   -  person Etheryte    schedule 20.01.2015
comment
เย้ downvote ครั้งแรกของฉัน! ตอนนี้ฉันเป็นสมาชิกที่แท้จริงของ SO แล้ว คิดว่าฉันถามอะไรชัดเจนเป็นพิเศษ แต่อาจจะเฉพาะกับฉันเท่านั้น จะดีกว่ามั้ย?   -  person Joshua Penman    schedule 20.01.2015


คำตอบ (1)


ตกลง! แก้ไขแล้ว!!!

ต่อไปนี้เป็นวิธีอ้างอิง/เปิดใช้งานขอบเขตที่สร้างโดย PaperScript จากขอบเขตส่วนกลาง แม้ว่าจะไม่มีอาร์เรย์ขอบเขตที่ผู้ใช้สามารถเข้าถึงได้ (ที่ฉันรู้) แต่ PaperScope.get(id) จะดึงข้อมูลเหล่านั้น ด้วยเหตุผลบางอย่าง ฉันพบว่า PaperScope.get(0) มีข้อมูลอยู่แล้ว และองค์ประกอบ canvas/PaperScript ทั้งสองของฉันอ้างอิงถึงขอบเขตที่มีรหัส 1 และ 2

ดังนั้น:

pscope1 = PaperScope.get(1)
pscope2 = PaperScope.get(2)

จากนั้นในฟังก์ชันใดๆ ที่ฉันต้องการทำอะไรบางอย่างบนผืนผ้าใบแรกของฉัน:

pscope1.activate()

// cool paper.js graphics stuff

pscope1.view.update()

บรรทัดสุดท้ายเป็นเพราะ paper.js จะไม่อัปเดตมุมมองที่ผู้ใช้ไม่ได้โต้ตอบด้วยโดยอัตโนมัติ

ขอขอบคุณ Jurg Lehni สำหรับคำแนะนำในการใช้ .activate()

ป.ล. ตรวจสอบให้แน่ใจว่าวัตถุที่เป็นกระดาษของคุณถูกสร้างขึ้นก่อนที่จะใช้ PaperScope.get ฉันใช้ 'ol JQuery $('document').ready() ที่ดีสำหรับสิ่งนี้...

PPS อีกหนึ่งประเด็นฮิตจาก Jurg Lehni: ภายใน PaperScript this จะชี้ไปที่ขอบเขตปัจจุบัน คุณสามารถใช้สิ่งนั้นและเก็บไว้ในวัตถุโกลบอล

person Joshua Penman    schedule 20.01.2015
comment
คุณคือผู้ชาย!! :D ขอบคุณ!! - person Edmond Tamas; 12.10.2015