亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

D3js 增加 X 軸之間的空間

D3js 增加 X 軸之間的空間

慕容708150 2022-08-04 09:40:19
我正在嘗試增加X軸中的標簽與X子組之間的空間,我在這里使用D3文檔提供的示例我一直在嘗試編輯這部分代碼而不看。唯一讓酒吧更苗條.padding([])  // Add X axis  var x = d3.scaleBand()      .domain(groups)      .range([0, width])      .padding([0.2])  svg.append("g")    .attr("transform", "translate(0," + height + ")")    .call(d3.axisBottom(x).tickSize(0));  //subgroups  var xSubgroup = d3.scaleBand()    .domain(subgroups)    .range([0, x.bandwidth()])    .padding([0.05])這個想法是要有這樣的東西(這是用excel)圖像
查看完整描述

1 回答

?
皈依舞

TA貢獻1851條經驗 獲得超3個贊

如果增加圖形的寬度,您將能夠增加條形之間的空間而不會縮小它們。沒有它,就沒有額外的空間來移動它們,因此默認情況下,條形會變薄。

在頂部提到的示例中,您有寬度和高度選項,增加寬度,然后填充。例如-

  width = 800 - margin.left - margin.right,

  height = 300 - margin.top - margin.bottom;



  ....


  // Add X axis

  var x = d3.scaleBand()

  .domain(groups)

  .range([0, width])

  .padding([0.2])

svg.append("g")

  .attr("transform", "translate(0," + height + ")")

  .call(d3.axisBottom(x).tickSize(0));


  //subgroups

  var xSubgroup = d3.scaleBand()

    .domain(subgroups)

    .range([0, x.bandwidth()])

    .padding([0.2])

工作示例 - https://codepen.io/puneet2412/pen/GRpQKzQ

然后,您可以嘗試根據需要更改填充。


查看完整回答
反對 回復 2022-08-04
  • 1 回答
  • 0 關注
  • 110 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號