reduce size of bar to fit in CA desktop
This commit is contained in:
parent
d92aa3ee99
commit
9c9a2c630b
@ -7,6 +7,7 @@ const props = defineProps({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const id = "csrScoreBar";
|
const id = "csrScoreBar";
|
||||||
|
const width = 300;
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
drawScale(id, d3.interpolateRdYlGn);
|
drawScale(id, d3.interpolateRdYlGn);
|
||||||
@ -17,7 +18,7 @@ function drawScale(id, interpolator) {
|
|||||||
|
|
||||||
var cScale = d3.scaleSequential().interpolator(interpolator).domain([0, 99]);
|
var cScale = d3.scaleSequential().interpolator(interpolator).domain([0, 99]);
|
||||||
|
|
||||||
var xScale = d3.scaleLinear().domain([0, 99]).range([0, 360]);
|
var xScale = d3.scaleLinear().domain([0, 99]).range([0, width]);
|
||||||
|
|
||||||
d3.select("#" + id)
|
d3.select("#" + id)
|
||||||
.selectAll("rect")
|
.selectAll("rect")
|
||||||
@ -53,21 +54,20 @@ function drawScale(id, interpolator) {
|
|||||||
/>
|
/>
|
||||||
Call Risk Score is {{ score }}
|
Call Risk Score is {{ score }}
|
||||||
<div class="img-overlay-wrap">
|
<div class="img-overlay-wrap">
|
||||||
<svg :id="id" width="360" height="40"></svg>
|
<svg :id="id" width="{{ width }}" height="40"></svg>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<style>
|
<style>
|
||||||
.crsContainer {
|
.crsContainer {
|
||||||
margin: 8px;
|
|
||||||
border-radius: 5px;
|
|
||||||
padding: 11px 16px 11px 12px;
|
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
gap: 8px;
|
border: 2px solid #45b408;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
font-family: OpenSans, Ariel, sans-serif;
|
font-family: OpenSans, Ariel, sans-serif;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
border: 2px solid #45b408;
|
gap: 8px;
|
||||||
|
margin: 8px;
|
||||||
|
padding: 11px 16px 11px 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.img-overlay-wrap svg {
|
.img-overlay-wrap svg {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user