javascript - using scalajs and d3 to create a histogram -

-

i'm trying use scala-js facade on d3 create histogram 1000 integers have. i've used 1 of examples create kinda working model, there style aspects can't work out. enter image description here

ideally i'd justify entire histogram left against y-axis or @ least center entire thing , move y-axis on it's close. i'd have histogram more of density plot percentages on y-axis, haven't found anyway yet. 

val margin = js.dictionary("top" -> 30, "right" -> 30, "bottom" -> 30, "left" -> 30) val width = 2500 - margin("left") - margin("right") val height = 500 - margin("top") - margin("bottom")  val x = d3.scale.identity().range(js.array(values.min, values.max))  val data = d3.layout.histogram().bins(x.ticks(100))(values)  val mm: js.function2[bin[double], double, double] = { (x: bin[double], y: double) => x.y }  val m = d3.max(data, mm)  val y = d3.scale.linear().domain(js.array(0, m)).range(js.array(height, 0))  val xaxis = d3.svg.axis().scale(x).orient("bottom") val yaxis = d3.svg.axis().scale(y).tickvalues(js.array(20, 40, 60, 80)).orient("right")  dom.document.getelementbyid("scalajsshoutout").textcontent = data.join(", ")  val svg = d3.select("body").append("svg")   .attr("width", width + margin("left") + margin("right"))   .attr("height", height + margin("top") + margin("bottom"))   .append("g")   .attr("transform", "translate(" + margin("left") + "," + margin("top") + ")")  val ff = (d: bin[double]) => "translate(" + x(d.x) + "," + y(d.y) + ")"  val bar = svg.selectall(".bar")   .data(data)   .enter().append("g")   .attr("class", "bar")   .attr("transform", ff)  val rect = (d: bin[double]) => height - y(d.y)  bar.append("rect")   .attr("x", 1)   .attr("width", x(data(0).dx) - 1)   .attr("height", rect)  bar.append("text")   .attr("dy", ".75em")   .attr("y", 6)   .attr("x", x(data(0).dx) / 2)   .attr("text-anchor", "middle")   .text((d: bin[double]) => formatpercent(d.y))  svg.append("g")   .attr("class", "x axis")   .attr("transform", "translate(0," + height + ")")   .call(xaxis)  svg.append("g")   .attr("class", "y axis")   .attr("transform", "translate(" + 0 + ", 0)")   .call(yaxis)

does have insight how can achieve effect? help, sorry code hacky right now.


Comments

Post a Comment

Popular posts from this blog

java - Run spring boot application error: Cannot instantiate interface org.springframework.context.ApplicationListener -

-
i have spring project , try make use spring boot , run @ embadded tomcat following : https://spring.io/guides/gs/rest-service/ this application //@configuration //@enableaspectjautoproxy @springbootapplication @componentscan(basepackages = "gux.prome") public class application { public static void main(string[] args) { springapplication.run(application.class, args); } } if use maven command: mvn spring-boot:run , project starts fine, need debug , run main method @ intelij, exception occurs: exception in thread "main" java.lang.illegalargumentexception: cannot instantiate interface org.springframework.context.applicationlistener : org.springframework.boot.logging.classpathloggingapplicationlistener @ org.springframework.boot.springapplication.createspringfactoriesinstances(springapplication.java:414) @ org.springframework.boot.springapplication.getspringfactoriesinstances(springapplication.java:394) @ org.springframework.bo...
Read more

reactjs - React router and this.props.children - how to pass state to this.props.children -

-
i'm using react-router first time , don't know how think in yet. here's how i'm loading components in nested routes. entry point .js reactdom.render( <router history={hashhistory} > <route path="/" component={app}> <route path="models" component={content}> </route> </router>, document.getelementbyid('app') ); app.js render: function() { return ( <div> <header /> {this.props.children} </div> ); } so child of app content component sent in. i'm using flux , app.js has state , listens changes, don't know how pass state down this.props.children. before using react-router app.js defines children explicitly, passing state natural don't see how now. using couple of react helper methods can add state, props , whatever else this.props.children render: function() { var children = react.ch...
Read more

Excel VBA "Microsoft Windows Common Controls 6.0 (SP6)" Location Changes -

-
i have excel workbook used generate quotations customers. there main page user inputs data, , there buttons generate various pdfs , send them customer. however, 1 user consistently getting error preventing generating , sending pdfs. i beleive "microsoft windows common controls 6.0 (sp6)". it's installed on users' computers. on mine, location "c:\windows\syswow64\mscomctl.ocx" on others "c:\windows\system32\mscomctl.ocx" the user experiencing issues on 32-bit machine, "mscomctl.ocx" file should in system32. have manually put in there, , pointed common controls reference in vba it. issue seems keep reverting looking in syswow64. since folder doesn't exist, can't find it, , can't produce pdfs. i thought perhaps issue user running older version of office (2007) there users on 2013 , 2016. thought perhaps mixture of 64-bit , 32-bit users. user gets sent workbook other users (as quotation process goes further, gets passed ...
Read more