थ्री.जेएस

Question

में 2 अंकों के बीच एक स्पलीन वक्र बनाना, मैं विज़ुअलाइज़ेशन के लिए थ्री.जेएस का उपयोग करके एक स्पलाइन के साथ अंक जोड़ने की कोशिश कर रहा हूं।

जहां तक ​​मैं कह सकता हूं, मैं एक सरणी में अंक जोड़ता हूं, इसे तीन .plineCurve3 पर पास करता हूं, भूगर्भांक प्राप्त करने और प्रस्तुत करने के लिए स्पलीन बिंदुओं के माध्यम से कदम उठाता हूं। यह काम करता है अगर मैं केवल सरणी के लिए प्रारंभ/समाप्ति बिंदु जोड़ता हूं लेकिन यदि मैं मध्य-बिंदु जोड़ने का प्रयास करता हूं, तो मुझे एक त्रुटि मिलती है।

उदाहरण यहाँ है:

http://jsfiddle.net/sLQK9/4/

मुझे यकीन है कि यह कुछ आसान है कर रहा हूँ लेकिन मैं यह स्थान नहीं कर सकते हैं - किसी को भी मेरी मदद कर सकते?

आखिरकार, अंक एक क्षेत्र की सतह पर होंगे और 2 बिंदुओं के बीच की splines एक विमान ले जाएगा मार्ग - आईई। महान सर्कल की तरह, लेकिन स्पलीन के मध्य बिंदु पर क्षेत्र के केंद्र से आगे दूर।

अग्रिम में बहुत धन्यवाद।

Answer 1

getPoint के पैरामीटर रेंज [0..1] में होना चाहिए:,

// Virtual base class method to overwrite and implement in subclasses 
// - t [0 .. 1] 

THREE.Curve.prototype.getPoint = function (t) { 
... 

Answer 2

मुझे लगता है कि आप कितने अंक आप पट्टी के साथ वक्र को जोड़ करना चाहते हैं निर्दिष्ट करने की आवश्यकता है, हालांकि आप control निर्दिष्ट करते हैं अंक, वक्र यह नहीं जानता कि आप इसे कितना चिकना चाहते हैं।

कुछ इस तरह का प्रयास करें:

// smooth my curve over this many points 
var numPoints = 100; 

spline = new THREE.SplineCurve3([ 
    new THREE.Vector3(0, 0, 0), 
    new THREE.Vector3(0, 200, 0), 
    new THREE.Vector3(150, 150, 0), 
    new THREE.Vector3(150, 50, 0), 
    new THREE.Vector3(250, 100, 0), 
    new THREE.Vector3(250, 300, 0) 
]); 

var material = new THREE.LineBasicMaterial({ 
    color: 0xff00f0, 
}); 

var geometry = new THREE.Geometry(); 
var splinePoints = spline.getPoints(numPoints); 

for(var i = 0; i < splinePoints.length; i++){ 
    geometry.vertices.push(splinePoints[i]); 
} 

var line = new THREE.Line(geometry, material); 
scene.add(line); 

फिर, जैसा कि @juan Mellado जवाब में बताया, तो आप spline.getPoint(t) का उपयोग कर लाइन पर एक स्थिति प्राप्त कर सकते हैं जहां टी 0-1 के बीच मूल्य है, शुरू करने और के अंत अंक पट्टी।

एक तरफ के रूप में, हाल ही में Question देखें जो मेरे लिए उत्तर दिया गया था, जिसमें ऊपर उदाहरण शामिल है।

Answer 3

3 डी दृश्य में दो बिंदु के बीच घटता बनाने, विशेष रूप से दुनिया पर के लिए मेरे समाधान:

var createCurvePath = function(start, end, elevation) { 
     var start3 = globe.translateCordsToPoint(start.latitude,start.longitude); 
     var end3 = globe.translateCordsToPoint(end.latitude, end.longitude); 
     var mid = (new LatLon(start.latitude,start.longitude)).midpointTo(new LatLon(end.latitude, end.longitude)); 
     var middle3 = globe.translateCordsToPoint(mid.lat(), mid.lon(), elevation); 

     var curveQuad = new THREE.QuadraticBezierCurve3(start3, middle3, end3); 
    // var curveCubic = new THREE.CubicBezierCurve3(start3, start3_control, end3_control, end3); 

     var cp = new THREE.CurvePath(); 
     cp.add(curveQuad); 
    // cp.add(curveCubic); 
     return cp; 
    } 

तो यह कहते हैं: वक्र सृष्टि के

var cp = globe.createCurvePath(item1, item2, 200); 
var curvedLineMaterial = new THREE.LineBasicMaterial({color: 0xFFFFAA, linewidth: 3}); 
var curvedLine = new THREE.Line(cp.createPointsGeometry(20), curvedLineMaterial); 
globe.scene.add(curvedLine); 

टिप्पणी द्विघात या घन विधि