Giter Club home page Giter Club logo

graphing-library-docs's Introduction

Contributing to Plotly's Graphing Libraries Documentation

Repo Overview

Plotly welcomes contributions to its open-source graphing libraries documentation from its community of users.

This repository mainly serves:

Contribute Quickly to Plotly's JavaScript Graphing Library Documentation

To quickly make a contribution to Plotly's JavaScript graphing libraries documentation, simply submit a pull request with the change you would like to suggest.

The easiest way to do this is to follow the Edit this page on GitHub link at the top right of the page you are interested in contributing to:

Screen Shot 2020-01-07 at 12 45 39 PM

Note: You don't have to worry about breaking the site when you submit a pull request!** This is because your change will not be merged to production immediately. A Plotly team member will first perform a code review on your pull request.

How To Get The Application Working Locally

For more extensive changes to Ploty's JavaScript documentation, we suggest getting the Jekyll application which builds the site to run locally so that you can test your changes as you develop them.

This involves cloning the repository and installing its dependencies: Git, [Ruby]((https://www.ruby-lang.org/en/), Jekyll, and the Python requests package.

  1. Use git to clone the public plotly/graphing-library-docs repository.

To do so, run the following commands in your terminal:

git clone [email protected]:plotly/graphing-library-docs.git
cd graphing-library-docs

Running git status in your terminal should then output the following:

On branch master
Your branch is up to date with 'origin/master'.

nothing to commit, working tree clean
  1. Download Ruby and check your Ruby version by running the ruby --version command in your terminal.

Note: We recommend using version 2.7.4, the same ruby version as gh-pages. Note RVM is helpful for installing and managing ruby versions.

  1. Download Jekyll and check your Jekyll version by running the jekyll -v command in your terminal. We recommend using the same ruby version as gh-pages.

  2. Install bundler and dependencies from the Jekyll applicaton's Gemfile by running the following commands in your terminal:

gem install bundler
bundle install

Note: These dependencies should be the same version that gh-pages is using.

  1. Serve the Jekyll application: bundle exec jekyll serve --config _config_dev.yml.

  2. Visit the pages at: http://localhost:4000/

Note The default Jekyll configuration file only builds the JavaScript posts by excluding folders. If you want to override this behavior, serve the application with a custom Jekyll configuration file in the root of the repository. Do this by copying _config_dev.yml, renaming it _config_personal.yml, and modifying the exclude statement.

  • If you name the Jekyll configuration file _config_personal.yml, it will be caught by the .gitignore file and not committed to version control.

  • Run bundle exec jekyll serve --config _config_personal.yml to use the custom configuration file

  • Example configuration:

# ---
# Excludes every directory except JavaScript
# ---
exclude: ['_posts/reference_pages', _posts/ggplot2','_posts/julia','_posts/matlab','_posts/node_js','_posts/r','_posts/python','_posts/python-v3','_posts/misc','_posts/dashboards',_posts/scala', '_posts/nodejs', 'node_modules']

and you'll only load the files in _posts/plotly_js directory because that is the only directory that is not excluded.

Change it to this:

# ---
# Excludes no directory
# ---
staticurl: http://localhost:4000/all_static
exclude: []

and you'll load every file because no directories are excluded.

Continuous Integration

Whenever a pull request is made, a continuous integration workflow is initiated. This includes of: - running the check-or-enforce-order.py and front-matter-ci.py scripts inside of a Docker container to validate YAML front-matter - Percy screenshot testing

Making sure that a pull request passes every continuous integration test is a part of the code review process.

For more information about the build process, inspect the CircleCI configuration file in this repository at https://github.com/plotly/graphing-library-docs/blob/master/.circleci/config.yml.

Other Documentation

This repository also contains: - Plotly's Node.js, Matlab, Scala, Julia, and Python V3 graphing libraries documentation - the reference pages for Plotly's JavaScript, Python, R, and Matlab graphing libraries.

graphing-library-docs's People

Contributors

alexcjohnson avatar benaliabderrahmane avatar congnd91 avatar danton267 avatar dependabot[bot] avatar gvwilson avatar haffla avatar hammadtheone avatar jackparmer avatar jingningzhang1 avatar jolinos avatar jostmigenda avatar jsw avatar kmutagene avatar liamconnors avatar mungojam avatar nicolaskruchten avatar nouman-tariq avatar olayway avatar paulovieira avatar plotlydocbot avatar ramonware avatar red-patience avatar selion05 avatar sglyon avatar steroidfella avatar tony avatar x3rus avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

graphing-library-docs's Issues

Are the [Julia] docs up to date?

i cannot get the examples to run in julia 1.1 , I get type errors, plot wont accept the arrays of string => values any more, it needs an array of abstracttypes....
i.e. not trace2 = [
"x" => [1, 2, 3, 4],
"y" => [16, 5, 11, 9],
"type" => "scatter"]
but
trace1 = scatter(
x= [1, 2, 3, 4],
y= [10, 15, 13, 17],
mode="lines")
response = Plotly.plot(trace1).
Where can i find the version of Julia de the examples are based on, and where can i find docs to use plotly in Julia 1.1 and later?
Sorry, I am new in Julia, probably the questions are easily solvable.

Expanded animation examples: Scatter3d

I may be going down a path of unsupported features here, but I have been trying for several days to find/come up with a working example of a Plotly.js animation of a 3D scatterplot. If animations are still unsupported for 3D scatter plots, it might be worth it to mention that somewhere; if they are supported but without tweening, etc, that's also fine, but a clear explanation of what does and doesn't work would be of great benefit to me and at least a few other commenters in the Plotly community forums.

Use let and const for docs?

Does plotly assume ES6 support? Should let and const be used in the docs for modern practice because var has some tricky pitfalls?

Better document plotlyjs.jl

In order to further adoption of the Dash For Julia project, it would be a good idea to document the functionality of the plotlyjs.jl package which users can interact with to create figures.

Work plan:

  • port current examples to plotlyjs.ls from plotly.jl
    • rather than creating figures using the chart studio cloud API, figures should be rendered in place with plotlyjs
  • figure out how to convert markdown documents which contain julia code to self-contained html
  • set up a plotlyjs.jl-docs github repository
  • set up a CI pipeline to build the julia docs
  • update this repo to pull in julia examples from the new repo.

improve search

There are several things we can do to improve users' search experience:

  • upgrade front end search input box to instantsearch.js
  • enable multi-index search queries
  • improve no results page
    • add link to google search for query on across plotly.com domains
    • add link to Community Forum search
  • improve search UX/UI - (use https://stripe.com/docs as inspiration)
    • move search input to header
    • use modal to display results
    • break down results by index
  • customize relevance scores
  • implement typo tolerance

Improve 3D scatter plot example visualization

The example from https://plotly.com/javascript/3d-scatter-plots/ is not a good visualization just because there is so much being plotted and the points are so large, which makes it even more difficult to estimate density. Setting lower opacity and smaller circles makes it much easier to see the structure of the data, which is already challenging for any kind of 3D plot. This can be tweaked depending on what we aim to showcase in the data.

New traces

var trace1 = {
	x:unpack(rows, 'x1'), y: unpack(rows, 'y1'), z: unpack(rows, 'z1'),
	mode: 'markers',
	marker: {
		size: 2,
		opacity: 0.5},
	type: 'scatter3d'
};

var trace2 = {
	x:unpack(rows, 'x2'), y: unpack(rows, 'y2'), z: unpack(rows, 'z2'),
	mode: 'markers',
	marker: {
		color: 'rgb(127, 127, 127)',
		size: 4,
		symbol: 'circle',
		line: {
		color: 'rgb(204, 204, 204)',
		width: 1},
		opacity: 0.8},
	type: 'scatter3d'};

New scatter plot

Screenshot from 2021-06-08 05-09-33

Remove chart studio from main graphing docs page

Can we remove the chart studio section from the graphing library docs, while keeping the chart studio links alive? Ideally if people enter those links through a backdoor, they will not get a broken page.
Chris and Alex agree that this would be a good idea.


Thanks for your interest in Plotly.py!

Before opening an issue, please search for existing and closed issues :)

Please accompany bug reports with a reproducible example. Please use the latest version of plotly.py in your report unless not applicable.

Note that GitHub Issues are meant to be used for bug reports and feature requests only. Implementation or usage questions should be asked on community.plotly.com or on Stack Overflow (tagged plotly).

Out of date

The npm package mentioned is still in 1.0.6 and has stopped being supported since late 2015. I am writing a node application (no HTML used) and some of the features I ideally wanted to use are available in this version (seems like changing background colors doesn't work), any help?

plotlyProxy 404 error

There seems to be an error with the plotlyProxy example plot. This is what I see when I load the page:
Screenshot 2020-05-03 at 20 42 40

Remove Intercom JS code from docs

I see this stuff at the bottom of pages... let's drop it please:


<script>
--
ย  | window.intercomSettings = { app_id: "anwi88es" };
ย  | </script>
ย  | <script>(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',intercomSettings);}else{var d=document;var i=function(){i.c(arguments)};i.q=[];i.c=function(args){i.q.push(args)};w.Intercom=i;function l(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/anwi88es';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);}if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})()</script>


Use official Redshift driver in docs

Hi there, I maintain redshift_connector.

I noticed https://github.com/plotly/graphing-library-docs/blob/master/_posts/python-v3/databases/redshift.ipynb uses psycopg2. redshift_connector is mentioned here on the plotly website, but this example uses psycopg2. Could you folks consider updating this to use redshift_connector?

redshift_connector supports integration with SQLAlchemy via the Redshift specific SQLAlchemy dialect (sqlalchemy-redshift) as well as a bunch of Redshift specific features such as IAM and Identity provider based authentication as well as support for Redshift native datatypes.

Bad CSS on /python/renderers

The CSS for the #notebook selector has two bad rules which are causing two visual display bugs:

(1) the min-height 100%; rule which causes the element to be extremely tall, squishing the layout of elements below it

(2) the font-size: 14px rule causes the heading text to be smaller than other headings at the same document level.

Screen Shot 2020-08-09 at 10 18 10 PM

Wrong colorscales YIOrRd and YIGnBu

We have an uppercase I in "YIOrRd" and "YIGnBu" - should be a lowercase L for yellow: "YlOrRd" or "YlGnBu".

At some point plotly.js had these typos in its built-in colorscales. We fixed that, and included a backward-compatibility fix that converts from I to l when used with Plotly.newPlot or Plotly.react, but it doesn't work with Plotly.restyle or Plotly.relayout (which I believe still get some use from plotly.py when editing an existing figure)

We should update the docs to only use the correct spelling.
Originally reported in plotly/plotly.js#4613

replace link to Dash in sidebar

hi @LiamConnors
@jingningzhang1 and I were talking last week about the side bar in the plotly GO docs. The Dash link under the quick reference section leads to Dash Enterprise. We believe it would be better that the link lead to the new Dash in 20 tutorial given its open source nature and the fact that it's a page that will help people learn Dash (which is probably why most people click that link).

image

simple fit trace / linear regression example provided

I just want to provide my simple code for plotting a linear fit into a scatter.
A feature that was requested for some time in plotly JS (plotly/plotly.js#4921), maybe you can just add this code into your example collection, so people will be able to find this solution and modified it to their needs:

function linearRegression(x,y){
        var lr = {};
        var n = y.length;
        var sum_x = 0;
        var sum_y = 0;
        var sum_xy = 0;
        var sum_xx = 0;
        var sum_yy = 0;

        for (var i = 0; i < y.length; i++) {

            sum_x += x[i];
            sum_y += y[i];
            sum_xy += (x[i]*y[i]);
            sum_xx += (x[i]*x[i]);
            sum_yy += (y[i]*y[i]);
        } 

        lr['sl'] = (n * sum_xy - sum_x * sum_y) / (n*sum_xx - sum_x * sum_x);
        lr['off'] = (sum_y - lr.sl * sum_x)/n;
        lr['r2'] = Math.pow((n*sum_xy - sum_x*sum_y)/Math.sqrt((n*sum_xx-sum_x*sum_x)*(n*sum_yy-sum_y*sum_y)),2);

        return lr;
}

var trace = {
      x: [9.87, 9.69, 9.14, 9.71, 9.19, 9.5, 9.85, 9.52, 9.34, 9.42, 9.71, 9.53, 9.13, 9.05, 9.3, 9.81, 9.32, 9.8, 9.5, 10, 9.47, 9.19, 9, 9.94, 9.4, 9.18, 9.06, 9.39, 9.59, 9.26, 9.15],
      y: [9.93, 9.85, 9.34, 9.69, 9.13, 9.4, 9.75, 9.5, 9.23, 9.45, 9.95, 9.68, 9.17, 9.2, 9.1, 10.01, 9.17, 9.99, 9.29, 10.04, 9.56, 9.2, 9.06, 9.77, 9.61, 9.09, 9.2, 9.18, 9.72, 9.1, 9.27],
      name: "Scatter",
      "marker": {"size": 5},
      "mode": "markers",
    "type": "scatter" };  
var lr = linearRegression(trace.x, trace.y);
var fit_from = Math.min(...trace.x)
var fit_to = Math.max(...trace.x)
var fit = {
  x: [fit_from, fit_to],
  y: [fit_from*lr.sl+lr.off, fit_to*lr.sl+lr.off],
  mode: 'lines',
  type: 'scatter',
  name: "R2=".concat((Math.round(lr.r2 * 10000) / 10000).toString())
};

var data = [ trace, fit ];
Plotly.newPlot('myDiv', data);

image

"r" property of Margins doesn't appear in Plotly Figure Reference Documentation

Reviewing a PR on a code base that is working to implement Plotly, it was discovered that the "r" property of layout>margins appears in the search function of Plotly's documentation/figure reference but not in the documentation or figure references themselves. Is this an update to Plotly code?

To recreate this issue:

  • Browser: Google Chrome
  • View a Plotly documentation site (this issue appears to happen on both the Plotly's Python and JavaScript graphing documentation)
  • Using search feature, enter "margin>r" or "layout>margin>r"
    - Notice that the matching property appears in the "Figure Reference Results"
    - Clicking on the link brings you to the generic Figure Reference Page
  • Clicking through the right hand contents list:
    - Scrolled to section titled "Layout"
    - Selected "Margins" link to view Margins Figure Reference
    - No property labelled as "r" appears here

JS Supported?

Is JS still being supported by Plotly? The reason I'm asking is because any user who navigates to the site via the main home screen cannot find any links to the JS library, but searching through the search engines yields pages that are still up. (And there's no button to edit the home page too)

image

Basic, Line-Charts xaxis zeroline issue

On Angular 8 with the latest Plotly min.js:

On a simple Line-Chart, the xaxis: {zeroline: false} doesn't remove the zeroline.

Is there any changes to be made to the doc?

Deprecated import in logarithmic axis doc

The doc here imports the following:

import plotly.plotly as py

But when running this example you get the following:

ImportError: 
The plotly.plotly module is deprecated,
please install the chart-studio package and use the
chart_studio.plotly module instead.

Instead, you should use this:

import plotly.express as px
#code here
fig.show() #instead of py.iplot(fig)

Relayouting event of plotly.js is not documented

some python example figures not rendering

Issue: Some example Python figures are not being rendered inline.

Steps to reproduce: visit https://plot.ly/python/pie-charts/:
Screen Shot 2020-03-17 at 11 12 03 AM

Cause:n On pages with figures that do not render, the following error is thrown in the JavaScript console: Uncaught Error: Mismatched anonymous define() module: in require.js

Background: require.js is a script that is inlined into the HTML output of every Python figure during the conversion from markdown to html. There is documentation on the error: https://requirejs.org/docs/errors.html#mismatch.

Thoughts: At first, I thought that this error was due to namespace conflict between the polyfill I had added in order to get the algolia JS for the new search UX to work in IE11 and require.js. However, the error persists even after a hotfix to prod which ensures that they polyfill is only loaded in IE11 (see #23).

Building the site from dc53fdf locally does not introduce this error, which makes me think that the aloglia code is related.

Plotly.js - Ternary contour plot

Hello!

While browsing the plotly.js documentation to understand how to make ternary contour plots, I noticed an inconsistency.
Indeed, what is presented as an example for ternary contour plots seems to be a classical ternary plot with blocks colored.

ternarycontourplot1

Screenshot 1 : When on the page, it states ternary contour plots as the title, but the subtitle already indicates that it is probably not.

ternarycontourplot2 expectation
Screenshots 2 and 3 : what is shown as example (2) and what is shown as an ternary contour plot in the menu of Plotly.js scientific charts (3)

I think it's only an inconsistency, as plotly python allows to do that sort of graps, and - if I'm not mistaken - Plotly Python is powered by the same JS core. :)

Fix SEO Title and Meta Tag

Can we fix the SEO title and meta content tag?
I couldn't find this code, so I'm not sure if it's in this repo.
image

image

Simplify docs build and deploy workflow

Currently the Python graphing library docs use the following repos as part of the docs build and deploy process:

  • graphing-library-docs
  • plotly.py
  • plotly.py-docs (two different branches)
  • documentation

Additionally, the docs for the other languages (R, Julia, Matlab, .net) mean there are about eight repos involved in the build and deploy process.

This issue is to track simplifying this process

example code doesn't work

Hi,

The example code in matplotlib_to_plotly() (https://plotly.com/python/v3/matplotlib-colorscales/) doesn't work due to a TypeError.

Anyway, I am sure that the argument meant to be passed to this function is the [colorscale]_rgb list ... which again throws a TypeError, but this can be fixed by editing one line:

C = list(map(np.uint8, np.array(cmap_rgb[k])*255))

Then it works.

uirevision equal to 0 does not preserve ui state in dcc.Graph

Not sure if this belongs here or in plotly, so let me know if this should be moved.

I was trying to add uirevision to preserve legend selections on a barchart, so I set uirevision=0 and left it unchanged. The chart continued to reset the selections back to the default when the chart was updated.

However, if the value of uirevision is changed to 1, and left unchanged, then it works as expected.

According to this post, uirevision can be set to any value, and the chart should only reset the ui state when the value is changed.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.