製作一個X和Y的圖表

Question

我在x和y中有一些點。我試圖按照我的圖片製作圖表。我想要創建的圖形的點可以加入。在c3.js中，我不知道如何繪製X和Y.我如何實現像我的照片？

https://jsfiddle.net/8tqguqww/

var pointsx=[1,2,3,4,5,4,3,2,1] 
var pointsy=[2,3,4,7,8,9,8,7,3] 

var chart = c3.generate({ 
    data: { 
     columns: [ 
      ['data1', 30, 200, 100, 400, 150, 250], 
      ['data2', 50, 20, 10, 40, 15, 25] 
     ] 
    }, 
    point: { 
     show: true 
    } 
}); 

Answer 1

這種圖表的名稱是散點圖。

因此，你必須指定類型：

type: 'scatter' 

並告訴C3哪些數據陣列偶：

xs: { 
    data1: "data2" 
}, 
columns: [ 
    ['data1', 30, 200, 100, 400, 150, 250], 
    ['data2', 50, 20, 10, 40, 15, 25] 
], 

這裏是更新的小提琴：https://jsfiddle.net/qrqquhvd/

編輯：因爲在你的問題comment我只是意識到，你有這個要求：「我想要的創意點特德圖可以加入「。答案很簡單：僅僅使用C3是不可能的。你必須用D3代碼來做到這點......一個更好的主意就是放棄C3並用D3做所有事情。