Power BI Blank Chart in Custom Visual

I am following this tutorial to create a Custom Visual for PowerBI: http://radacad.com/create-custom-visual-with-r-and-json-part3

Let's say I am using default data: mtcars inside my custom visuals for Power BI. I am trying to Create 2 fields let's say "Mileage Per Gallon" and "Cylinder Size" as below:

Here is my Script.R

source('./r_files/flatten_HTML.r')

############### Library Declarations ###############
libraryRequireInstall("ggplot2");
libraryRequireInstall("plotly")
####################################################

################### Actual code ####################

ValuesWithChangedName <- data.frame(mpgWithChangedName, cylWithChangedName)

p <- plot_ly(ValuesWithChangedName,
  type = 'scatterpolar',
  r = ValuesWithChangedName$mpgWithChangedName,
  theta = ValuesWithChangedName$cylWithChangedName,
  mode = 'markers'
)

####################################################

############# Create and save widget ###############
#p = ggplotly(p);
internalSaveWidget(p, 'out.html');
####################################################

And capabilities.json:

{
  "dataRoles": [
    {
      "displayName": "Mileage Per Gallon",
      "kind": "GroupingOrMeasure",
      "name": "mpgWithChangedName"
    },
    {
      "displayName": "Cylinder Volume",
      "kind": "GroupingOrMeasure",
      "name": "cylWithChangedName"
    }
  ],
  "dataViewMappings": [
    {
      "scriptResult": {
        "dataInput": {
          "table": {
            "rows": {
              "select": [
                {
                  "for": {
                    "in": "mpgWithChangedName"
                  }
                },
                {
                  "for": {
                    "in": "cylWithChangedName"
                  }
                }
              ],
              "dataReductionAlgorithm": {
                "top": {}
              }
            }
          }
        },
        "script": {
          "scriptProviderDefault": "R",
          "scriptOutputType": "html",
          "source": {
            "objectName": "rcv_script",
            "propertyName": "source"
          },
          "provider": {
            "objectName": "rcv_script",
            "propertyName": "provider"
          }
        }
      }
    }
  ],
  "objects": {
    "rcv_script": {
      "properties": {
        "provider": {
          "type": {
            "text": true
          }
        },
        "source": {
          "type": {
            "scripting": {
              "source": true
            }
          }
        }
      }
    }
  },
  "suppressDefaultTitle": true
}

With this simple case, I am not getting a chart plotted, instead I am getting a blank chart. Can someone please point the mistake I am doing ?