在R中手动更改Plotly Bubble Map的Bubbles大小

时间:2016-09-11 01:20:16

标签: r ggplot2 formatting plotly bubble-chart

我目前正在尝试手动更改Plotly气泡贴图的气泡大小。我成功地使用提供的数据更改了地图的颜色,但我无法使用相同的逻辑来更改大小。要更改颜色,我只需调用colors_wanted <- c("red", "blue", "black", "pink")并将此命令传递给colors内的plot_ly。您是否认为可以更改尺寸而不是使用此情况下的公式sqrt来声明尺寸?

library(plotly)
df <- read.csv('https://raw.githubusercontent.com/plotly/datasets/master/2014_us_cities.csv')
df$hover <- paste(df$name, "Population", df$pop/1e6, " million")

df$q <- with(df, cut(pop, quantile(pop), include.lowest = T))
levels(df$q) <- paste(c("1st", "2nd", "3rd", "4th"), "Quantile")
df$q <- as.ordered(df$q)

g <- list(scope = 'usa',projection = list(type = 'albers usa'),showland = TRUE,landcolor = toRGB("gray85"),
subunitwidth = 1, countrywidth = 1, subunitcolor = toRGB("white"),countrycolor = toRGB("white"))

plot_ly(df, lon = lon, lat = lat, text = hover,
  marker = list(size = sqrt(pop/10000) + 1, line = list(width = 0)),
  color = q, colors= colors_wanted, type = 'scattergeo', locationmode = 'USA-states') %>%
  layout(title = '2014 US city populations<br>(Click legend to toggle)', geo= g)

1 个答案:

答案 0 :(得分:2)

如果你希望尺寸与四分位数相对应,那么这是有效的(并且你可以采用任意数量的变体来使尺寸更具分析意义):

import React from 'react';
import { Field, reduxForm } from 'redux-form';
import * as Redux from 'react-redux';

import Input from './../../helpers/Input';
import Button from './../../helpers/Button';

export const Signup = React.createClass({

    renderInput({ label, type, input: { value }, meta: { touched, error }}){
        return (
            <Input label={ label }
                   type={ type }
                   filled={ value ? true : false }
                   touched={ touched }
                   error={ error } />
        );
    },

    render(){

        const { handleSubmit } = this.props;

        return(
            <div>
                <form onSubmit={ handleSubmit }>
                    <Field name="email" label="Email" component={ this.renderInput } />
                    <Field name="username" label="Username" component={ this.renderInput } />
                    <Field name="password" label="Password" type="password" component={ this.renderInput } />
                    <Field name="confirmPassword" label="Confirm Password" type="password" component={ this.renderInput } />
                    <Button type="submit" btnType="main" btnIcon="" btnText="Create Account" />
                </form>
            </div>
        );
    }
});

export const validate = values => {
    const errors = {};
      if (!values.username) {
          errors.username = 'Required';
      } else if (values.username.length > 15) {
          errors.username = 'Must be 15 characters or less';
      }

      if (!values.email) {
          errors.email = 'Required';
      } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
          errors.email = 'Invalid email address';
      }
      console.log(errors);
      return errors;
};

export default reduxForm({
  form: 'signup',
  validate
})(Signup);

enter image description here

这是一个有趣的变化:

plot_ly(df, lon = lon, lat = lat, text = hover, size = as.numeric(df$q), 
        #marker = list(size = sqrt(pop/10000) + 1, line = list(width = 0)),
        color = q, colors= colors_wanted, type = 'scattergeo', locationmode = 'USA-states') %>%
  layout(title = '2014 US city populations<br>(Click legend to toggle)', geo= g)

enter image description here