d3.svg.line() त्रुटि: Uncaught TypeError: अपरिभाषित

Question

की संपत्ति 'रेखा' नहीं पढ़ सकता है I d3.js का उपयोग करके पथ खींचने का प्रयास करने के लिए निम्न कोड का उपयोग कर रहा हूं मैंने वेब पर विभिन्न कोड उदाहरणों का प्रयास किया है वही है और हर जगह एक ही त्रुटि हो रही है।

<script type="text/javascript"> 
    var svg; 
    //The data for our line 
lineData = [ { "x": 1, "y": 5}, { "x": 20, "y": 20}, 
       { "x": 40, "y": 10}, { "x": 60, "y": 40}, 
       { "x": 80, "y": 5}, { "x": 100, "y": 60}]; 

//This is the accessor function we talked about above 
var lineFunction = d3.svg.line() 
         .x(function(d) { return d.x; }) 
         .y(function(d) { return d.y; }) 
         .interpolate("linear"); 

//The SVG Container 
var svgContainer = d3.select("body").append("svg:svg") 
            .attr("width", 200) 
            .attr("height", 200); 

//The line SVG Path we draw 
var lineGraph = svgContainer.append("path") 
          .attr("d", lineFunction(lineData)) 
          .attr("stroke", "blue") 
          .attr("stroke-width", 2) 
          .attr("fill", "none"); 
    </script> 

त्रुटि है:

के बाद जे एस है Uncaught TypeError: गुण अपरिभाषित

की 'लाइन' पढ़ा नहीं जा सकता यह निम्न पंक्ति पर आता है: var lineFunction = d3.svg.line()

मैं मुझे यकीन नहीं है कि 'अपरिभाषित' का अर्थ यहां क्या है। कोई लीड?

Answer 1

अपने comment पढ़ना मुझे लगता है कि आप डी 3 v4 का उपयोग कर रहे हैं। version 4 के अनुसार d3.svg नहीं है, इसलिए त्रुटि संदेश है। जिस लाइन जनरेटर को आप ढूंढ रहे हैं उसे अब d3.line() के रूप में परिभाषित किया गया है।

यदि आप अभी भी संस्करण 3 का उपयोग कर रहे थे, तो यह d3.svg.line() होगा।

---

इसके अलावा, के रूप में अन्य answerers उल्लेख किया है, यह एक अनुवर्ती त्रुटि के लिए जब बयान d3.line एक विधि .interpolate() की सुविधा नहीं है के रूप में अछूता के बाकी छोड़ने का नेतृत्व करेंगे। इस उद्देश्य के लिए डी 3 वी 4 में curve factories है, जिसका उपयोग इंटरपोलेशन के लिए किया जाता है। इन कारखानों को line.curve() का उपयोग करके लाइन जनरेटर को आपूर्ति की जाती है। डी 3 v3 का .interpolate("linear") अब .curve(d3.curveLinear) बन जाता है। हालांकि, line.curve() से d3.curveLinear पर डिफ़ॉल्ट रूप से यह आपके मामले में सुरक्षित रूप से छोड़ा जा सकता है।

बयान इस प्रकार हो जाता है:

var lineFunction = d3.line() 
    .x(function(d) { return d.x; }) 
    .y(function(d) { return d.y; }) 
    .curve(d3.curveLinear);   // Use for clarity, omit for brevity. 

Answer 2

के बाद से वहाँ कोई d3.svg है संस्करण में 4.

var lineFunction = d3.line() 
        .x(function(d) { return d.x; }) 
        .y(function(d) { return d.y; }); 

Answer 3

[अपडेट सुनिश्चित करें कि आपके कोड के नीचे वाक्य रचना में संशोधन किया है सुनिश्चित करें ]

इसके अलावा, यदि आप D3js v4 का उपयोग कर रहे हैं, तो इस कथन के साथ एक समस्या .interpolate("linear"); इस चेतावनी के साथ होगा:

d3.line(...).x(...).y(...).interpolate is not a function। curveLinear के विवरण में के रूप में

curve(d3.curveLinear);

:

इस नए संस्करण में, .interpolate("linear"); को बदला जाना चाहिए।