Bar rating Custom Widget

Source code: Survey setup
Survey.defaultBootstrapCss.navigationButton = "btn btn-primary";
Survey.Survey.cssType = "bootstrap";
Survey.JsonObject.metaData.addProperty("dropdown", {name: "renderAs", default: "standard", choices: ["standard", "barrating"]});
Survey.JsonObject.metaData.addProperty("dropdown", {name: "ratingTheme", default: "fontawesome-stars", choices: ["fontawesome-stars", "css-stars", "bars-pill", "bars-1to10", "bars-movie", "bars-square", "bars-reversed", "bars-horizontal", "bootstrap-stars", "fontawesome-stars-o"]});
Survey.JsonObject.metaData.addProperty("dropdown", {name: "showValues", default: false});
var survey = new Survey.Model({ questions: [
 { type: "dropdown", name: "barrating1", renderAs: "barrating", "ratingTheme": "fontawesome-stars", title: "Please rate the moive you've just watched", 
     choices: ["1", "2", "3", "4", "5"] }
]});


var widget = {
    name: "antennaio-jquery-bar-rating",
    isFit : function(question) { return question["renderAs"] === 'barrating'; }
}

Vue.component(widget.name, {
    props: ['question', 'css', 'isEditMode'],
    template: `
      <select :id="question.inputId" v-model="question.value">
          <option v-for="(item, index) in question.visibleChoices" :value="item.value">{{ item.text}}</option>
      </select>
    `,
    mounted: function () {

        var vm = this;
        $(vm.$el).barrating('show', {
            theme: vm.question.ratingTheme,
            initialRating: vm.question.value,
            showValues: vm.question.showValues,
            showSelectedRating: false,
            onSelect: function(value, text) {
                vm.question.value = value;
            }
        });

        vm.question.valueChangedCallback = function() {
            $(vm.$el).barrating('set', vm.question.value);
        }
    }
})
Survey.CustomWidgetCollection.Instance.addCustomWidget(widget);

survey.data = { barrating1: "3" };
var vueApp = new Vue({ el: '#surveyElement', data: { survey: survey } });


Bar rating theme: (default is 'fontawesome-stars')

var q = survey.getQuestionByName('barrating1');
q.ratingTheme = yourvalue; 
survey.render();

var q = survey.getQuestionByName('barrating1');
q.showValues = yourvalue; 
survey.render();