एचटीएमएल 5 कैनवास: माउस और बहुभुज टकराव का पता लगाने

Question

तो मैं एचटीएमएल 5 और जावास्क्रिप्ट के साथ एक टावर रक्षा खेल बना रहा हूं। मेरी एकमात्र समस्या यह पता लगा रही है कि माउस हमलावर के मार्ग के संपर्क में आता है, जो खिलाड़ी को रास्ते पर टावरों के निर्माण से रोकने के लिए आवश्यक है। हमलावरों का मार्ग MAP.js फ़ाइल (नीचे दिए गए लिंक को देखें) में निर्धारित किया गया है, दो आयामी सरणी (एक्स और वाई जोड़े वाले सरणी) द्वारा, इसलिए मुझे जो काम करना है वह बिंदुओं की एक श्रृंखला है कनेक्ट होने पर एक रास्ता बनाओ। मैं केवल खिलाड़ी को पथ के 50 पिक्सल के भीतर, टावरों को रखने से रोकना चाहता हूं। ईमानदार होने के लिए मैं टकराव का पता लगाने के साथ बस भयानक हूं, इसलिए कुछ मदद की सराहना की जाएगी। http://shapeshifting.comuv.com/Tower_Defense/td/

जैसा कि आप कल्पना कर सकते हैं, केवल .js फ़ाइलों लागू होते हैं, लेकिन प्रासंगिक कोड के सबसे objects.js फ़ाइल के अंदर है:

यहाँ सब कोड के लिए लिंक है। (PLease खुशियां बहाना)

Answer 1

मैं इसे चरणों में दृष्टिकोण दूंगा। चलो देखते हैं कि आप किसके साथ शुरू करते हैं। आपके पास बिंदुओं द्वारा परिभाषित पथ है - बिंदुओं के जोड़े रेखा रेखा को परिभाषित करते हैं। तो आपके पास वास्तव में लाइन सेगमेंट से बने पथ हैं। जब उपयोगकर्ता माउस को ले जाता है, तो आपको वर्तमान स्थिति के x, y निर्देशांक मिलेंगे। आप जो करना चाहते हैं वह सभी रेखा खंडों के लिए माउस पॉइंट की दूरी पाता है। यदि यह किसी भी लाइन सेगमेंट से 50 पिक्सल से कम है, तो आप उन्हें वहां बनाने की अनुमति नहीं देना चाहते हैं।

एक बिंदु और रेखा खंड के बीच की दूरी को खोजने के लिए, छद्म कोड इस तरह दिखता है। मान लें कि अंक ए और बी एक रेखा खंड के दोनों सिरों का प्रतिनिधित्व करते हैं और बिंदु सी माउस बिंदु है।

float distancePoint2LineSegment(Point a, Point b, Point c) { 
    Vector ab = b - a 
    Vector ac = c - a 
    Vector bc = c - b 

    float e = dotProduct(ac, ab) 
    if (e <= 0.0) 
    return sqrt(dotProduct(ac, ac)) 

    float f = dotProduct(ab, ab) 
    if (e >= f) 
    return sqrt(dotProduct(bc, bc)) 

    return sqrt(dotProduct(ac, ac) - e * e/f) 
} 

यह आपके टक्कर पता लगाने सवाल का जवाब होगा, लेकिन मुझे लगता है कि आप तो प्रदर्शन को देखने के लिए चाहते हैं। आपके पथ में कितने लाइन सेगमेंट होंगे और क्या आप प्रत्येक बार जब भी माउस अपना माउस ले जाएंगे तो प्रत्येक लाइन सेगमेंट की दूरी की गणना करना चाहते हैं? आप लाइन सेगमेंट को क्वाड्री में डाल सकते हैं ताकि आपको केवल लाइन सेगमेंट की छोटी संख्या के खिलाफ माउस पॉइंट टकराव का परीक्षण करना पड़े।

Answer 2

यह संभवतः सरल और तेज़ क्षेत्रों को परिभाषित करने के लिए है जो उपयोगकर्ता मानचित्र फ़ाइल में स्पष्ट रूप से टावर रख सकते हैं ... प्रत्येक क्षेत्र को उत्तल बहुभुज के रूप में परिभाषित करें (जाहिर है नक्शा किनारों सहित, विभाजित अवतल बहुभुज, क्षैतिज या लंबवत पसंद करते हैं लाइनों, तो माउस की कसौटी पर बहुभुज में से एक में है, एक implementatio

How to test if a point is inside of a convex polygon in 2D integer coordinates?

त्रिकोण के सड़ते हुए परीक्षण भी सरल

Answer 3

टकराव का पता लगाने पुराने उन में से एक है बनाता है के लिए इस उत्तर को देखने छिपा हुआ एक गेम कोडिंग की समस्याएं। आम तौर पर लोग अंधेरे पेंगुइन लेते हैं कुछ फैशन में सटीक होने का दृष्टिकोण जहां आपका स्थिर मानचित्र है और जगह योग्य नहीं है। अगला कदम सबसे कुशल टकराव मानचित्र निर्दिष्ट करने के लिए एक तरीका के साथ आना है।

आप नहीं चाहते हैं कि आपका माउस अपने माउस को ले जाने वाले उपयोगकर्ता के जवाब में गणित का एक टन करे - इसे छोटा और तेज़ होना चाहिए - इसलिए कुछ जल्दी से सटीक होना महत्वपूर्ण है।

यदि आपका नक्शा ग्रिड है, तो आपके पास आपका जवाब सही है - टक्कर नक्शा एक सटीक 2 डी सरणी है - मूल रूप से ग्रिड पर प्रत्येक स्थान के लिए पिक्सेल के साथ एक बहुत ही छोटी और सफेद छवि। सफेद पिक्सेल (1) प्ले करने योग्य और काले पिक्सेल (0) नहीं हैं। आप सिर्फ एक लुकअप के रूप में सच/गलत के इस 2 डी सरणी का उपयोग करते हैं। अगर आप स्मृति को सहेजना चाहते हैं तो आप ग्रिड पर 32 रिक्त स्थान की प्रत्येक स्ट्रिप को एक बिट फ्लैग में बंडल कर सकते हैं।

यदि आपका नक्शा ग्रिड नहीं है, तो आप अभी भी चीजों को पूर्वनिर्धारित करना चाहते हैं, लेकिन रणनीति थोड़ा अधिक जटिल है। पहली संभावना है कि थोड़ा उच्च रिज़ॉल्यूशन टकराव मानचित्र बनाने के लिए हितेश की तरह गणित करना है, और फिर शेष ग्रिड रणनीति के समान है - उदाहरण के लिए यदि प्रत्येक 4x4 पिक्सल ब्लॉक एक टक्कर प्रविष्टि था, तो क्या एक टावर हो सकता है यह एक परीक्षण है कि इसके निर्देशांक पर्याप्त 1 के शीर्ष पर होने का परीक्षण करते हैं - आपको 100% परीक्षणों की आवश्यकता हो सकती है, या आप उन्हें थोड़ी सी पहुंचने दे सकते हैं और कह सकते हैं कि 75% परीक्षण 1 है।

यदि यह अभी भी पर्याप्त जानकारी नहीं है, तो आप इन अधिक जटिल बहुभुज परीक्षण कर सकते हैं, लेकिन आप उन्हें जितना संभव हो सके उतना आसान बनाना चाहते हैं। एक सटीक ग्रिड का उपयोग नहीं करते समय, सबसे सरल 2 डी टकराव परीक्षण 2 मंडल होता है - आप बस अपने केंद्रों के बीच की दूरी की गणना करते हैं और जांचते हैं कि यह उनके त्रिज्या के योग से अधिक या कम है या नहीं। यदि आप अपने राक्षस पथ को मंडलियों के निशान में पूर्ववत करते हैं, तो अगला चरण उन मंडलियों को विभाजित करना है ... अनुमान लगाएं कि ... एक ग्रिड। यह प्रत्येक चेक को नक्शे पर हर एक सर्कल का परीक्षण करने से रोकता है। यह टकराव मानचित्र में इन सर्किलों की एक बड़ी संख्या रखने की अनुमति देता है, क्योंकि टकराव परीक्षण सबसे पहले टॉवर प्रविष्टियों में एक गलती प्रविष्टियों में एक लुकअप है, इसके बाद यह जांच कर रहा है कि क्या यह केवल उन मंडलियों के साथ टकरा रहा है, जो इसके निकट हैं पूरा नक्शा यह ध्यान रखना महत्वपूर्ण है कि सर्कल सूचियों के इस पूर्ववर्ती ग्रिड में अक्सर कई पड़ोसी ग्रिड प्रविष्टियों में एक ही सर्कल होता है, क्योंकि प्रत्येक ग्रिड एंट्री जिसमें किसी दिए गए सर्कल के किसी भी हिस्से में उसके कोलाइड चेकलिस्ट में उस सर्कल का होना चाहिए।

पहले 2 ग्रिड दृष्टिकोणों के बारे में अच्छी चीजों में से एक यह है कि यह स्वयं को क्यूए के लिए बहुत आसान है - सचमुच टकराव मानचित्र को एक छवि के रूप में संग्रहीत करें और यह सुनिश्चित करने के लिए दृष्टि से निरीक्षण करें कि यह उस मानचित्र के लिए सही दिखता है। यदि आप उन्हें उत्पन्न करने के लिए कोड लिखना नहीं चाहते हैं तो आप इसे हाथ से भी खींच सकते हैं।

सर्कल दृष्टिकोण आपको वैध वक्र देता है और बेहतर टकराए किनारे के विस्तार का कारण बन सकता है, लेकिन यह जांचना मुश्किल है कि किसी भी मानचित्र में खराब टकराव मानचित्र नहीं हैं। नक्शा पीढ़ी के उपकरण को लिखने के लिए यह और भी काम है।

शुभकामनाएं!