2015-01-16 5 views
0

Так что у меня есть несколько разных графиков, работающих на Dashing, используя единственный 'Rickshaw' виджет. Я хотел бы использовать селектор CSS для определения вида оси х. В настоящее время я его настроить, как это ...Селекторы CSS с лихой и рикшей

Это dashboard.erb:

<li data-row="1" data-col="1" data-sizex="6" data-sizey="6"> 
    <div id="weekly" data-id="etvvrb" data-view="Rickshawgraph" data-title="Weekly ETV reach" data-moreinfo="Week commencing" data-color-scheme="rainbow" data-renderer="line" data-x-axis="weekly"></div> 
</li> 

Это определяет DIV ID для имени селектора в CSS, в CSS мы имеем ...

.x_tick { 
    position: absolute; 
    bottom: 0; 
    fill: $tick-color; 

    .title { 
     font-size: 20px; 
     color: $tick-color; 
     opacity: 0.5; 
     padding-bottom: 3px; 
    } 
    } 

    #weekly.x_tick { 
    position: absolute; 
    bottom: 0; 
    fill: $tick-color; 

     .title { 
     font-size: 9px; 
     color: $tick-color; 
     opacity: 0.5; 
     padding-bottom: 3px; 
     writing-mode:tb-rl; 
     -webkit-transform:rotate(90deg); 
     -moz-transform:rotate(90deg); 
     -o-transform: rotate(90deg); 
     -ms-transform:rotate(90deg); 
     white-space:nowrap; 
     display:block; 
     bottom:0; 
     width:0.5px; 
     height:20px; 
    } 
    } 

По сути, я бы предположил, что он будет читать идентификатор и использовать для этого идентификатора разные CSS, но, похоже, полностью игнорирует его. У меня такое чувство, что идентификатор просто не передается, как я ожидал, и я не совсем уверен, почему.

Если у кого-нибудь есть какие-либо предпосылки для этого, особенно при использовании Dashing, любые советы будут очень признательны.

+0

Если Sass не проблема, то предоставите только скомпилированный CSS. – cimmanon

ответ

2

Я понял это.

Dashing будет генерировать объект класса, который основан на тегах идентификатора данных и данных (возможно, через JS, но, возможно, я ошибаюсь).

Это будет выглядеть как-то вроде widget-data-view.data-id.

Это означает, что вы можете создать новый класс в своем документе CSS, используя элемент, сгенерированный JS. В моем случае это будет выглядеть примерно так:

Надеюсь, что имеет смысл. Спасибо :)