1
我正在使用滑块在d3图表上工作。我想增加滑块的长度。如何增加d3.js中的滑块长度
<div id="content">
<br>
<!--<label class ="left" id="lblValue" text-align="left"> Values: </label>-->
<br>
<label for="RAG" text-align="center"> January - December </label>
<br>
<input type="range" name="dataset" value="RAG" in="1" max="12" step="1" onchange="getData" style="margin=0" width="100px"/>
<br>
<span class="tick" style="display:inline-block;width: 4px;text-align:left;margin-right:3px; margin-top=3px;">|<br/>1</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px;">|<br/>2</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px;">|<br />3</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px;">|<br />4</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px;">|<br />5</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px">|<br />6</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;margin-top=3px">|<br />7</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;">|<br />8</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;">|<br />9</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;">|<br />10</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;">|<br />11</span>
<span class="tick" style="display:inline-block;width: 4px;text-align:center;margin-right: 3px;">|<br />12</span>
</div>
我创建了一个捣鼓这个: http://jsfiddle.net/ThomsonKrish/KZGd5/1/
而且这将是巨大的,如果我可以对齐蜱点点,使其顶部立即显示在滑块下方的蜱。
我试过了,它似乎不起作用。我已经更新了小提琴,并尝试在那里运行。 –
重试并更新小提琴,我的回答在发布后不久编辑 - 复制并粘贴不正确的答案。该示例应该工作:)。 – JoshMc
完美!谢谢 –