What is the best way to set two rating value in a web based application?

The problem with Type 1 and Type 3 is that they necessitate default values. The problem with that is:

• Default values might bias the user into selecting them ("3 is good enough, I'll leave it there")
• Default values provide a value, and you might want to let your user skip the question without setting a value

Type 2 does allow you to show a scale without setting a value. There are a couple of ways to design for larger scales; one that's commonly used on small viewports is to make it stack vertically, like this example from SurveySparrow:

Adding some buttons for fine control so larger values can be handled efficiently.

If the scale is going to vary then you are right to be concerned about screen space. The slider (type 3) just won't be good enough if you change it to a higher number (i.e. 1-10). Even in your screenshots, 5 values on the slider is already starting to look busy. So discard that completely.

Type 2 could work, but do not adjust the size of the buttons. Instead you could design it to wrap onto multiple lines as required. Thus keeping the button sizes large enough to be accurately clicked with ease.

Personally I prefer Type 1 though because it's nice and simple and doesn't overload the screen with lots of buttons. Type 1 also handles a large amount of options much better, the other 2 options are going to quickly cause problems if you start having options more than 10.

If your only concern with Type 1 is that the user cannot immediately see the range, then you can just add this to the labels. Either add "(1 - 10)" next to both baseline and goal.

It might be sufficient to just have it written once though, if you have a description label above the settings. For example, "On a scale of 1-10, set your baseline and goal" (or whatever text suits your application function).

Note, everything I have said is based on the mobile layout. In the user has a large screen then you can make all 3 designs work equally well. So perhaps you might consider only using Type 1 for mobile devices and something else for desktop.