d3.js - change axis color dimple -


i have simple line chart in dimple. want change x , y axis colour white.

var svg = dimple.newsvg(".line_chart_container", 400, 300),dataset; var chart = new dimple.chart(svg, dataset); var x = chart.addcategoryaxis("x", "attempts"); //x.style ("fill","red") var y = chart.addmeasureaxis("y", "value"); y.showgridlines = true; x.showgridlines = true; var s = chart.addseries(["metric", "value"], dimple.plot.bubble); var lines = chart.addseries("metric", dimple.plot.line);  lines.lineweight = 2; lines.linemarkers = true; chart.assigncolor("metric", "#30d630"); chart.draw(); s.shapes.style("opacity", function (d) { return (d.yvalue === 0 ? 0 : 0.8); }); 

i've checked dimple.axis documentation in github couldn't find thing. there dimple.axis.colors attribute, changes color of data , not axis. dimple support this?

i've tried add style attribute(like in d3):

x.style ("fill","red") 

but caught error: uncaught typeerror: x.style not function

any idea?

x not d3 selection, dimple.axis. can access inner d3 selection shapes property (which standard dimple object). there example of here.

depending on if want change line color, text color, or everything, do

x.shapes.selectall("*").style("fill", "white") 

where * "text" or "line". 1 note : individual tick marks <line> nodes, , change color need use 'stroke', not 'fill'. also, actual axis line not <line> element, it's <path> element. change color :

x.shapes.select("path.dimple-custom-axis-line").style("stroke", "white"); 

you can manually write css rule override style chart :

g.dimple-axis > g.tick > line, g.dimple-axis path.dimple-custom-axis-line {   stroke:white; } 

Comments

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

twig - Using Twigbridge in a Laravel 5.1 Package -

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -