Documentation for versions prior to m-2016-12-01 can be found here.


Notices

  • (7/1/17) - Version 4.0 is now available! Get your copy by sending an email to your Account Manager at am@chartiq.com.

  • (7/1/17) - new GitHub seed sample projects are now available for iOS and Android!


Release Notes

Version 4.1.2

Version 4.1

  • Breaking change: ChartIQ's Web Component based interface has been revised. If you're using this interface (sample-template-advanced.html) then you will need to make adjustments to your code to be compatible with this release. Please run a diff between the 4.0 and 4.1 versions of the template in order to see these changes. For your convenience, they are also listed here:
    • In function startUI():
      • Remove the first parameter to UILayout, resulting in this: var UILayout=new CIQ.UI.Layout(UIContext);
      • Remove UILayout.aggregationDialog UILayout.aggregationDialog=$("cq-dialog[cq-aggregation]");
      • Remove the last parameter to UIStudyEdit, resulting in this: var UIStudyEdit=new CIQ.UI.StudyEdit(null, UIContext);
      • Update views initialization methods, by replacing UIViewsMenu:
        var UIViewsMenu=new CIQ.UI.ViewsMenu($("cq-views-content"), UIContext, {cb:function(){
          this.renderMenu();
        }});
        with cq-views:
        $("cq-views").each(function(){
          this.initialize();
        });
      • Update overall UI initialization method by replacing :
          UIContext.buildReverseBindings();
        with:
          CIQ.UI.begin();
        at end of startUI().
    • In the HTML portion:
      • Update signature of removeTimezone function call by replacing :
        <div class="ciq-btn" stxtap="Layout.removeTimezone()">Use My Current Location</div>
        with:
        <div class="ciq-btn" stxtap="removeTimezone()">Use My Current Location</div>
      • Update formatting of cq-study-context tag by replacing :
        <cq-dialog cq-study-context>
          <div stxtap="StudyEdit.edit()">Edit Settings...</div>
          <div stxtap="StudyEdit.remove()">Delete Study</div>
        </cq-dialog>
        with :
        <cq-dialog>
          <cq-study-context>
              <div stxtap="StudyEdit.edit()">Edit Settings...</div>
              <div stxtap="StudyEdit.remove()">Delete Study</div>
          </cq-study-context>
        </cq-dialog>
      • Replace cq-aggregation with cq-aggregation-dialog and update tag formatting by replacing :
        <cq-dialog cq-aggregation>
          // more HTML here, excluded for simplicity
          // (See sample-template-advanced.html for proper placement)
        </cq-dialog>
        with :
        <cq-dialog>
          <cq-aggregation-dialog>
              // more HTML here, excluded for simplicity
              // (See sample-template-advanced.html for proper placement)
          </cq-aggregation-dialog>
        </cq-dialog>
  • Addresses requirejs issue with "html2canvas" on share.js
  • CIQ.ChartEngine#xAxisAsFooter now defaults to true
  • CIQ.ChartEngine#xaxisHeight now defaults to 30 px
  • New parameter CIQ.ChartEngine#escapeOnSerialize. When true serialize methods may escape their values with encodeURIComponent
  • New parameter CIQ.ChartEngine.Chart#lineApproximation. When candleWidth<1, setting to true will create approximation of a line chart to improve rendering performance.
  • CIQ.ChartEngine#setChartScale can now also set to "percent".
  • deleteHighlighted now deletes a renderer from the chart if it has no series attached to it.
  • CIQ.ChartEngine#zoomSet will now will keep left edge stable and zoom to the right when white space is present on the left.
  • If using a quoteFeed, when checking for more data to load in the process of displaying a requested span or range, the feed will try to fetch a larger set of bars with every recurring attempt to capture the requested range within the 10 allotted tries.

Version 4.0.3

Version 4.0

  • Breaking change:

  • Breaking change:

  • Breaking change: CIQ.DropDownManager no longer included in the library.

  • Breaking change: share.js no longer provided as a separate add-on and instead, if used, it will be part of the chartiq.js bundle.

  • Breaking change: CIQ.Renderer#removeSeries now completely removes series data from masterData if no longer used by any other renderers.

  • Breaking change: Outputs Up Border and Down Border no longer available for vol undr study library entry. To set border colors use CSS "stx_volume_underlay_up" and "stx_volume_underlay_down" instead.

  • Please Note: CIQ.ChartEngine#reconstructDrawings and CIQ.ChartEngine#serializeDrawings have been deprecated in favor of CIQ.ChartEngine#importDrawings and CIQ.ChartEngine#exportDrawings respectively, but maintained for backward compatibility.

  • Please Note: All CIQ.ChartEngine#callbacks have been deprecated in favor of CIQ.ChartEngine#addEventListener, but maintained for backward compatibility.

  • Please Note: If you have created your own study display functions, we have replaced plotLineChart() with plotDataSegmentAsLine(), which allows for gaps to be plotted with different colors and/or patterns. Will also extend lines off the chart properly when there is a gap on the left or right edge.

  • Please note: changes to periodicity (period/interval) will now also cause quotefeed.subscribe and quotefeed.unsubscribe calls.

  • Please note: CIQ.ChartEngine.YAxis#goldenRatioYAxis now defaults to true

  • Ability to further style line charts. Now color, width and style (dashed, dotted) can be set. See CIQ.ChartEngine#setLineStyle.

  • Ability to preset and allow users to change study output lines styles (width, dashed, dotted). See the 'Set colors and styles' section of the Using and Customizing Studies tutorial.
  • Translations. We have improved word detection as well as totally re-translated Chinese for completeness a better accuracy.
  • A series of optimizations to the rendering algorithm specifically focused on performance improvements for mobile devices. See CIQ.ChartEngine#disableBackingStoreDuringTouch.
  • New CIQ.RangeSlider is now available. See it on `sample-template-advanced.html' under the Display drop down.
  • New drawing tool: Average Line.
  • WebComponents.cq-chart-title now updates the browser tab with stock symbol and latest price using cq-browser-tab attribute.
  • WebComponents.cq-language-dialog is now available. This creates a dialog that can be used to change the language from the UI.
  • New css/img/languages.svg file added and cq-flag style added to css/chartiq.css to support Language Dialog.
  • CIQ.displayableDate is now available and used in CIQ.ChartEngine.AdvancedInjectable#headsUpHR to ensure the date formats are in sync throughout the chart.
  • All templates have been renamed from 'template-xxx.html' to 'sample-template-xxx.html' to better illustrate their purpose.
  • Display time zone and language are now retained by default between sessions when using sample-template-advanced.html, or if a developer implements the preferences callback (which works just like layout callback). WebComponents.cq-language-dialog saves CIQ.ChartEngine#preferences.language and triggers a callback. CIQ.ChartEngine#setTimeZone now saves the user selected timezone (displayZone) in the CIQ.ChartEngine#preferences and triggers a preferences callback. Developers should now look for stxx.preferences.timezone instead of stxx.displayZone. New CIQ.ChartEngine#importPreferences and CIQ.ChartEngine#exportPreferences are available, and used by helper functions savePreferences and restorePreferences on sample-template-advanced.html.
  • Ability to reverse candle colors based on language. This is primarily for Chinese and Japanese languages where Red is used as positive and Green as negative colors. See CIQ.I18N.localize .
  • New HLC box charts.
  • New "hlc" (bar), "colored_hlc" (bar) and "colored_step" (line) chart types. See CIQ.ChartEngine#layout.chartType.
  • Enhancements to CIQ.ChartEngine#@addSeries to better handle adding and removing gaping for series so no unnecessary bars are left once a series is removed.
  • Enhancements to the translation module to improve word recognition and replacement.
  • Highlight detection improved to be more accurate on large candles.
  • Fibonacci settings webComponent added to sample-template-advanced.html. See WebComponents.cq-fib-settings-dialog.
  • Mouse wheel zooming can now be centered by the mouse position by setting CIQ.ChartEngine#preferences.zoomAtCurrentMousePosition to true.
  • You can now color a 'colored bar' or a 'volume' bar based on difference between open and close, rather than difference between previous close and close. See CIQ.ChartEngine#colorByCandleDirection.
  • Gaps on the main chart line can now be styled differently to highlight the absence of data. See CIQ.ChartEngine#setGapLines.
  • doubleTap callback listener has been added. See CIQ.ChartEngine#addEventListener.
  • Preferences can now be imported and exported in addition to the chart layout. See CIQ.ChartEngine#importPreferences CIQ.ChartEngine#export.Preferences.
  • CIQ.ChartEngine.Chart#legendRenderer now works for all Line Renderers not just legacy.
  • Grids lines can now be styled "solid", "dotted" or "dashed" by setting the CSS "border-style"
      ```
      .stx_grid { /* Default Grid */
          color:#efefef;
          opacity:1;
          border-style:dotted;
          }
    ```

Version 3.0.10 (patch release with new functionality)

Version 3.0.9 (patch release with new functionality)

  • Now, backing store can be disabled between 'touchstart' and 'touchend' events (pan, scroll) and swipe. This can improve performance on slow devices. See CIQ.ChartEngine#disableBackingStoreDuringTouch for details.
  • New Fibonacci settings web component is now available with the drawing tool-bar on template-advanced.html

Version 3.0.7 (patch release with modified behavior)

  • Support asynchronous nameValueStore on Views Menu. An additional optional callback has been added to CIQ.UI.ViewsMenu .
  • Optionally make the focus control in study panels expand the panel into the full charting area in the canvas. See CIQ.ChartEngine#soloPanelToFullScreen.
  • Update to translations.js
    • We updated our translations list with 301 additional key words.
    • The library now has the ability to use double quotes in translations.js to handle commas in the phrases to be translated.

Version 3.0.6 (patch release with modified behavior)

  • Enhancement on logic to properly handle adding series that may go beyond the range of the main symbol. The fetch behavior has been changed to set the end date to 'right now' and make an initial fetch request instead of making an update request. This is a modification of the Version m-2016-12-01.4.7 change to remove the requirement of having to use an update fetch call in the quote feed, allowing for better backward compatibility.

Version 3.0.0

  • Breaking change: The following parameters and functions are no longer used in the library. Now, all x axis rendering is done with CIQ.ChartEngine#createTickXAxisWithDates

    • CIQ.ChartEngine.hasNTBAxis
    • CIQ.ChartEngine.XAxis.axisType
    • CIQ.ChartEngine.createNumericXAxis
  • Breaking change: intl.js is no longer included in the chartiq. js build. All major browsers now include Intl by default. The sole exception is Safari 9. Customers wishing to support those users can manually include intl.js from the thirdparty directory.

  • Breaking change: The animation plug-in is now part of addOns.js. Previously, it was provided as a standalone animation.js file.

  • Breaking change: When using a quoteFeed, the initial comparison fetch now only includes the startDate in the fetch params to allow the series to load up to the current date. Essentially making an update call to the quoteFeed, instead of a range call.

  • Breaking change: CIQ.ChartEngine.XAxis#futureTicksInterval now defaults to 1 minute instead of 10 minutes.

  • Breaking change: In CIQ.ChartEngine#addSeries, parameters.forceData is no longer used. Now all initial data sent in will be forced into the chart by forcing a materData element where one was missing. The new bar inserted will only include the Date, DT and the value for the series. No OHLC values will be carried over. This could create gaps in studies. To prevent gaps created by the new series, you must ensure the new data exactly matches the master data dates.

  • Breaking change: CIQ.ExtendedHours has a new function signature to support real-time market session filtering. Setting params.filter to true performs a filter of masterData rather than a reload of the data from the server.

  • Please Note: CIQ.ChartEngine#serializeDrawings has been replaced with CIQ.ChartEngine#exportDrawings but maintained in this version for backward compatibility.

  • Please Note: CIQ.ChartEngine#reconstructDrawings has been replaced with CIQ.ChartEngine#importDrawings but maintained in this version for backward compatibility.

  • Please Note: CIQ.ChartEngine#setPeriodicityV2 has been replaced with CIQ.ChartEngine#setPeriodicity but maintained in this version for backward compatibility.

Enhancements and additions

  • Semantic versioning is now being used. For the details see: http://semver.org/
  • "histogram" and "step" chart types are now supported. See CIQ.ChartEngine#layout.chartType and CIQ.ChartEngine#setChartType for more details.
  • Architecture for real time aggregation and study calculations was enhanced to improve performance; especially on rapidly updating charts using streaming and animation. The new paradigm prevents the complete recalculation of the data set when an item is added to the end of it. This change affects calculateHeikinAshi, calculateKagi, calculateLineBreak, calculateRenkoBars, calculateRangeBars, calculatePointFigure, and all studies and indicators.
  • Refactoring of the canvas manager was implemented to address browser latency on 4k monitors.
  • New parameter CIQ.ChartEngine#maxMasterDataSize was added to prevent the masterData array from growing excessively large. Older data will be sliced off the array, when the max setting is reached, as new bars are added on the right side of the chart. By default masterData is unlimited and will grow forever.
  • quotefeed.fetchInitialData is no longer being called for series pagination requests. Now quotefeed.fetchPaginationData will be called for both the primary instrument and all additional series.
  • New parameter CIQ.ChartEngine#displayGridLinesInStudies is now available to manage the display of horizontal grid lines on studies.
  • New parameter CIQ.ChartEngine.Chart#defaultPlotField is now available for line and mountain type charts to allow a filed other then "Close" to drive the rendering of the chart.
  • Aggregated chart types (renko, kagi, etc.) now have a user interface that allows users to configure aggregation settings (see template-advanced.html).
  • CIQ.ChartEngine#appendMasterData now also takes last sale data to directly allow for streaming capabilities. This can now be used instead of streamTrade.
  • New CIQ.InactivityTimer class was added as an add-On that puts the chart into "sleep mode" after a period of inactivity.
  • CIQ.I18N.setLanguage now also takes a root parameter to limit the translations scope to the desired container.
  • CIQ.ChartEngine.XAxis#formatter now is also available for year and month boundaries.
  • New CIQ.createLabel method is now available to allow developers to control the text inside the y axis floating label. Developers can override as needed to create the desired effects on the text.
  • Function signature changed on CIQ.tickedRect, CIQ.roundRect, CIQ.roundRectArrow, CIQ.semiRoundRect, CIQ.rect and CIQ.noop. These functions now take a single argument object instead of 8 individual parameters.
  • CIQ.addMemberToMasterdata now automatically forces all data into the chart. Dates are no longer required to be exact matches in order to show up in comparisons.
  • CIQ.Renderer#removeSeries was modified to remove the series even if series parameter permanent is set to true. The permanent parameter only prevents right click user interaction and not programatically requested removals.
  • New CIQ.ChartEngine#useBackingStore parameter was added to allow developers to manage the use of the backing store for the canvas. Enabling the backing store results in crisper display but with a noticeable performance penalty in some browsers.
  • New parameters CIQ.ChartEngine#preferences.highlightsRadius and CIQ.ChartEngine#preferences.highlightsTapRadius were added to allow developers to set the radius for the invisible intersection box around the cursor used to determine if it has intersected with an element to be highlighted. Used on items removed with a right click such as series and drawings.
  • New CIQ.ChartEngine.YAxis#drawSeriesPriceLabels parameter was added to allow developers to hide the series price labels in the main panel's y-axis.
  • New CIQ.ChartEngine.XAxis#noDraw parameter was added to allow developers to suppress the x axis from the chart.
  • CIQ.ChartEngine#setLocale was modify to include the additional maxDecimals parameter to allow developers to set the decimal precision when using a particular Locale.
  • CIQ.postAjax was modified to include timeout and ungovernable parameters.
  • All studies now dispatch a symbolChange event type if there are symbols in the study stx.dispatch("symbolChange", {stx:stx, symbol:s, action:action});
  • CIQ.Studies.displayError was added to allow developers to display a watermark on a panel for a study with sd.error set.

Version m-2016-12-01.4.9 (patch release with breaking changes)

  • Breaking change: All legacy CIQ.Comparisons quotefeed operations and CIQ.ChartEngine#addSeries quoteFeed updates and paginations now trust the data being returned for the new series and will add gaps on the masterData to fit the comparison bars. The new bars inserted will only include the Date, DT and the value for the series. No OHLC values will be carried over. This could create gaps in studies. To prevent gaps created by the new series, you must ensure the new data exactly matches the master data dates.

Version m-2016-12-01.4.7 (patch release with breaking changes)

  • Breaking change: To properly handle adding series that may go beyond the range of the main symbol, the fetch behavior has been changed to make an update request instead of an initial fetch request when calling addSeries. This allows the feed to return all available data from that startDate regardless of primary symbol last tick.

Version m-2016-12-01

  • Breaking change: The library files have been reorganized as follows:

    • The names of the HTML template files have changed to be more representative.
    • chartiq.html is renamed to template-advanced.html
    • chartiq-basic.html is renamed to template-basic.html
    • stx-quickstart.html is renamed to helloworld.html
    • The legacy templates (stx-advanced.html, stx-standard.html, stx-basic.html) have moved to the legacyHTML directory along with their required css and img directories.
    • The legacy UI interface and helper functions have been moved to the 'js/legacy` directory.
    • The sample data files have moved to the new example-data directory .
    • As a result of the reorganization, a modified set of external script files now needs to be included as follows:
      • The following is a sample of the external scripts that can be included in the advanced web components template (template-advanced.html):
        <script src="js/chartiq.js"></script>
        <script src="js/animation.js"></script>
        <script src="js/thirdparty/splines.js"></script>
        <script src="js/quoteFeedSamples.js"></script>
        <script src="js/quoteFeedSimulator.js"></script>
        <script src="js/thirdparty/iscroll.js"></script>
        <script src="js/plugin.js"></script>
        <script src="js/translations.js"></script>
        <script src="js/addOns.js"></script>
        <script src="js/thirdparty/object-observe.js"></script>
        <script src="js/thirdparty/webcomponents-lite.min.js"></script>
        <script src="js/componentUI.js"></script>
      • The following is a sample of the external scripts that can be included in the advanced legacy template (stx-advanced.html):
        <script src="js/chartiq.js"></script>
        <script src="js/animation.js"></script>
        <script src="js/quoteFeedSamples.js"></script>
        <script src="js/thirdparty/iscroll.js"></script>
        <script src="js/plugin.js"></script>
        <script src="js/translations.js"></script>
        <script src="js/addOns.js"></script>
        <script src="js/legacy/comparison.js"></script>
        <script src="js/legacy/quotes.js"></script>
        <script src="js/legacy/ui.js"></script>
        <script src="js/legacy/lookupXignite.js"></script>
        <script src="js/plugin.js"></script>
      • The following is a sample of the external scripts that can be included in the basic and standard legacy template (stx-basic.html & stx-standard.html):
        <script src="js/chartiq.js"></script>
        <script src="../js/quoteFeedSamples.js"></script>
        <script src="../js/thirdparty/iscroll.js"></script>
        <script src="../js/legacy/quotes.js"></script>
        <script src="../js/legacy/ui.js"></script>
        <script src="../js/legacy/lookupXignite.js"></script>
      • See the following Core Functionality section as well as the updated sample templates for more details.
  • Breaking change: Functionality previously found in stxShare.js is now included in chartiq.js. Additionally the STXSocial name space is now now CIQ.Share

  • Breaking change: On mobile or desktop webview implementations where you are hosting the stxKernelOs.js file in a web server instead of embedding it in the application bundle, you will now need to embed js/chartiq.js. This new file replaces the legacy stxKernelOs.js

  • Breaking change: Timezone library originally in stxTimeZoneData.js, is now bundled in the chartiq.js library file and has been trimmed using 2016 data and modularization to reduce size. Any data no longer included by default, can be manually added back by extending the timezoneJS object.

  • Please Note: The library base namespace has been changed from STX to CIQ. Legacy name is still being allowed for backward compatibility.

  • Please Note: The new STXChart call used to instantiate a chart engine has been changed to new CIQ.ChartEngine. Legacy name is still being allowed for backward compatibility.

Core Functionality

  • The ChartIQ library has been modularized to provide more packaging flexibility.

    • The "core" library is now in a single file:js/chartiq.js. This new bundle replaces many of the individual legacy files including stxKernelOs.js.

    • Custom modular packaging of the chartiq.j bundle is now supported for special needs and in order to minimize library footprint (contact us for more information).

    • All other functionality not in chartiq.js, has been moved to the following individual files which can be included or excluded as needed:

      • js/quoteFeedSimulator.js example of new quotefeed API; connects to ChartIQ's new data simulator
      • js/quoteFeedSamples.js legacy demo quotefeed samples
      • js/componentUI.js UI web components used in template-advanced.html
      • js/thirdparty/iscroll.js third-party support for smooth scrolling
      • js/thirdparty/splines.js third-party spline-plotting functionality
      • js/thirdparty/object-observe.js third-party support for asynchronously observing an object
      • js/thirdparty/webcomponents-lite.min.js third-party support for web components used in templates
      • js/translations.js support for internationalization
      • js/addOns.js rare addons including ExtendedHours and ToolTip (for crosshairs)
      • js/animation.js plugin to enable specialized chart animation
      • js/plugin.js additional code required to support plugins (TFC, stocktwits, etc.) in the web components template (template-advanced.html)
  • A new Quotefeed API simplifies integrating your own data. A new tutorial provides an overview with links to the new API. template-advanced.html provides an example using the new quotefeed API. The legacy STX.QuoteFeed is still being maintained.

  • Animation performance improvements.
  • Heads-up display enhancements.
  • Theme enhancements.
  • New Price-Related Study -CIQ.ChartEngine#cleanupGaps now supports "carry" and "gap" values. Setting to non-false will default to "carry" for backward compatibility with prior versions.
    • carry will cause the closing price to be carried forward, resulting in dashes on a candle/bar chart or continuous line on a line or mountain chart.
    • gap will cause physical breaks to occur on the chart in the gapped position.
  • New CIQ.ChartEngine#captureMouseWheelEvents parameter added. If set to false it will allow up/down mouseWheel / touchPad swiping to pass trough the chart container so the main page can manage it. This allows a user swiping up and down to swipe trough the chart instead of having the chart capture the event and prevent the page from continue moving. It therefore produces a more natural up/down sliding of the page.

New Tutorials

  • Many new tutorials have been written and a few old ones rewritten. The new tutorials are flagged on the main tutorial page of the library documentation.

Version 09-2016-19

  • Breaking change: If using splines, it is now required to include the following: <script src="js/splines.js"></script> and corresponding js/splines.js file.
  • Breaking change: In chartiq.html comparisons are now reset and not carried over between symbols.
  • Breaking change: Templates no longer included in the license package: stx-phone.html and stx-basic.html
  • Breaking change: CIQ.ChartEngine#addSeries parameters.data.useDefaultQuoteFeed is no longer needed to be specified. If no parameters.data is provided the quotefeed will be automatically used, and no longer tries to use an existent masterData field.

Core Functionality

  • New template chartiq-basic.html (web components)
  • Library now provides support for CommonJS and NodeJS or RequireJS
  • New advanced studies:
    • VWAP
    • Performance Index
    • Beta
    • Balance of Power
    • Trend Intensity Index
    • Vortex Indicator
    • ZigZag
    • Psychological Line
    • Moving Average Deviation
  • New advanced drawing:
    • Crossline
    • Speed Resistance Arc
    • Speed Resistance Line
    • Gann Fan
    • Time Cycle
    • Regression Line
    • Tirone Levels
    • Quadrant Lines
  • Added studyOverBoughtValue and studyOverSoldValue selectors to study dialog.
  • Modified CIQ.ChartEngine.stxx.markerDelay to immediately cause markers to move. Prior setting had a 25ms delay.
  • Chart aggregations (Heikin-Ashi, etc.) now preserves server side data on dataSet.
  • Studies can now use attributes to set allowable ranges for numeric inputs. Example:
    "Hist Vol": {
      "name": "Historical Volatility",
      "calculateFN": CIQ.Studies.calculateHistoricalVolatility,
      "inputs": {"Field":"field", "Period":10, "Days Per Year":[252,365], "Standard Deviations":1},
      "attributes": {
          "Standard Deviations":{min:0.1,step:0.1} // this limits the range of Standard Deviations to a minimum of 0.1 and only allows changes in 0.1 steps.
      }
    }
  • Added "Points Or Percent" input field to "Price Oscillator" study
  • Added "Moving Average Type" input field to "RAVI" study
  • Added "Period" input field to Elder Force Index study
  • New CIQ.Renderer.Shading is now available to shade between series lines.
  • New CIQ.Tooltip module is now available to display datapoint details on the current crosshair location.
  • CIQ.ChartEngine#addSeries parameters.data.DT can now also take an epoch number.
  • CIQ.ChartEngine#addSeries now allows a series to be added on an empty chart.
  • new function CIQ.ChartEngine#moveMarkers moves the markers from one panel to another. Useful when renaming panels

WebComponents UI

  • Added CIQ.UI.ViewsMenu for Views support (cq-view-dialog)
  • Added Key up/down support for search windows
  • Study legend renderer now displays the 'display' name insted of the ID
  • Added Trading Central support (cq-tradingcentral and cq-tc-number)
  • Added basic details component (cq-details)
  • Heads up tooltip (stx-hu-tooltip)

Enhancements


Version 07-2016-16

Core Functionality

  • Added a Smoothing Period parameter to the ADX study.
  • New parameter CIQ.ChartEngine#minimumZoomTicks to set the minimum number of ticks that must remain on the chart when zooming in. (07-2016-16.6)
  • New parameter CIQ.ChartEngine#cloneDrawing is now needed to clone a drawing. A developer can toggle it based on the control key to maintain the previous functionality. (07-2016-16.7)
  • FloatDate now stays pinned to the left size if there isn't enough room to display (prevents it from being clipped).(07-2016-16.7)
  • Safety check for negative study periods added -- if a negative number is selected it is reset to 1. (07-2016-16.7)

WebComponents UI

  • Custom themes added
  • Study legend component added ( cq-study-legend )
  • Close price added to comparison legend ( cq-comparison )
  • Added study zones parameters to UI. (07-2016-16.7)
  • Corrected line not centered on drawing line style drop down. (07-2016-16.7)

Enhancements

  • Comparison no longer causing error if chart is panned all the way to the left showing just the first tick.
  • Fixed identical studies causing infinite loop -- corrected study name-relationship logic. (07-2016-16.7)
  • Corrected moving Average not allays working on volume study. (07-2016-16.7)
  • Undo/Redo drawing button now resets when a symbol is changed. (07-2016-16.7)
  • CIQ.colorToHex - fixed bug with missing leading 0's. (07-2016-16.7)
  • Fix for zoom bug on iOS. (07-2016-16.7)
  • Callbacks.longhold no longer triggered when pinching (catching two finger situation). (07-2016-16.7)
  • Corrected setRange issue causing shifted renderings with white space on left. (07-2016-16.7)
  • Fixed calculateRandomWalk divide by 0 issue. (07-2016-16.7)

Version 06-2016-21 ( minor release )


Version 05-2016-10

Core Functionality

  • CIQ.ChartEngine.Chart#lockScroll can now be set to true to stop the chart from auto-scrolling when new data arrives

  • stxx.preferences.currentPriceLine can now be set to true to display a horizontal line at the current price.

  • stxx.preferences.horizontalCrosshairField can now be set to lock the crosshair Y value to the value of the specified field name.

  • stxx.xAxisAsFooter can now be set to display the xaxis at the bottom of the screen instead of the bottom of the chart panel.

  • CIQ.ChartEngine#setSpan will now save the desired span in stxx.layout. Users will get the same span when they change symbols, and the span will now be saved and restored with the layout between sessions

  • "Equal Citizen" series. Series may now be added without dependency to the start or end date of the primary series and without setting a masterData. This is done by using parameters.forceData which will create a masterData entry if none exists for that DT. See CIQ.ChartEngine#addSeries for details.

  • Users can now pan chart all the way to the left (previously 1/3 or the screen would always be taken by the chart). Use CIQ.ChartEngine#minimumLeftBars to set the minimum amount of chart to always display on the left side of the screen.

  • Equation charts now work for comparison symbols, relative price symbols and any other condition where a study requires a symbol other than the master.

  • New Marker placement options: yPositioner="on_candle", "under_candle", "top", "bottom", "value" to position the market on top of, or underneath the candle, at the top or bottom of the panel, or at the specified value. See CIQ.Marker

  • Autocalculated values now available in chart.dataSet automatically: "hl/2" - Median Price "hlc/3" - Typical Price "hlcc/4" - Weighted Close "ohlc/4" - OHLC divided by 4

  • Library now compatible with "use strict".

  • CIQ.ChartEngine#importLayout and CIQ.ChartEngine#exportLayout can now optionally also restore/save the stock symbol using the "withSymbols" parameter

  • Market.getOpen(dt), getClose(), getNextOpen(), getNextClose(), getPreviousOpen(), getPreviousClose() convenience functions

  • New baseline_delta_mountain and colored_mountain chart types are available.

WebComponents UI

There is now a new file chartiq.html which is an updated, responsive UI that is based off of webcomponents. The webcomponents-lite.min.js polyfill (included) are required to run this on browsers other than Chrome. object-observe.js polyfill is currently required (this requirement will be removed in an upcoming release).

Recent changes:

  • cq-toggle now a true webcomponent
  • cq-side-panel webcomponent now used to house side panel plugins (trade from chart)
  • Any cq webcomponent can now be loaded as a marker with the cq-marker attribute.
  • All cq webcomponents now automatically have this.node as a jquery accessor.
  • All cq click bindings now pass an "activator" object (instead of a node) to their action methods. This object contains the node, event and optional parameters.
  • cq-focus on an input tag inside of a menu will cause the input to receive focus immediately when the menu is activated.
  • cq-color-picker now repositions itself it is off screen.
  • cq-comparison-description if exists will display the description of a comparison symbol in the legend.
  • cq-tooltip tag replaces css :after elements, allowing them to be translated

Enhancements

  • Held draggable elements will no longer trigger an inadvertent mouse click if they are dragged underneath a button (TFC).

Version 03-2016-11

  • Breaking change: A new Market class replaces LegacyMarket class. If calling any functions from LegacyMarket, please replace them with equivalent Market functions. The Market class now allows a market's hours and holidays to be defined with a market definition file. Market iterators allow you to move forward and backward in time, with the Market automatically skipping over time when the market is closed. See CIQ.Market for all instructions and details.

  • Breaking change: chart.xAxis.useDataDate is not longer available. Instead use CIQ.ChartEngine.XAxis#adjustTimeZone with inverted logic.

  • Breaking change: The Twiggs study now requires attribution. Please see the attribution information in stx-advanced.html.

  • Breaking change: iscroll4 was removed from stxThirdParty.js. (iscroll5 remains)

  • Improved mobile gestures for smoother and more accurate pinch and swipe.

  • You can now swipe a chart with the mouse.

  • Equations are now supported (when using a QuoteFeed). Start equations with "=". Example =IBM+AAPL. CIQ.ChartEngine#allowEquations

  • Home button animates the chart to home instead of skipping immediately.

  • Color picker colors can now be customized by redefining the values in CIQ.colorPickerColors

  • CIQ.Studies.replaceStudy method now available to replace an existing study.

  • Support for fractional y-axis values (treasuries and treasury futures) CIQ.ChartEngine.YAxis#fractional

  • New improved semi-log y-axis CIQ.ChartEngine.YAxis#prettySemiLog

  • Multiple identical studies can now be added. Each one will have a name that ends in -1, -2, -3 (to support adding studies without a dialog)

  • Advanced template: Menus now automatically resize and allow scrolling if there is not enough vertical space.

  • Advanced template: up and down arrow keys now zoom the chart

  • Performance improvements when many (especially old) drawings on the screen

  • Resolved issue with focus (solo) button overlapping studies y -axis when activated.

  • Charts on mobile devices will pass scroll up and down to the parent app by setting CIQ.ChartEngine#captureTouchEvents to false

  • New callbacks CIQ.ChartEngine#callbacks.layout and CIQ.ChartEngine#callbacks.drawing will be called when the layout is changed or a drawing is changed, added or deleted.

  • CIQ.ChartEngine#addEventListener to allow multiple listens on a callback.

  • New CIQ.QuoteFeed.Subscriptions object can manage subscriptions in order to combine query (for historical) with streaming updates. This QuoteFeed type will callback when new symbols are required or old symbols are removed by the user from the chart.

  • Multiple Markers on the same chart bar will now stack.

  • CIQ.ChartEngine#newChart parameter stretchToFillScreen can be set to increase the candleWidth to fill the left-side gap created by a small dataSet.

  • Trade From Chart:

    • Forex hedging now optionally supported
    • Positions markers are now displayed on the chart.

Version 12-2015-08 ( minor release )

Fixed crosshair positioning bug on touch devices.

Added flag to control side-swipe touch pad scrolling. set stxx.allowSideswipe=false to disable.


Version 11-2015-01

  • Breaking change: stxx.cleanupGaps now defaults to false. We've found that most customers who have gaps in their date prefer this behavior. If you wish to fill gaps with "dashes" then set this value to true.

  • Breaking change: Translations have now been moved into an optional translations.js file which you only need to include if you are supporting multiple languages.

  • Breaking change: New file stxShare.js contains the code for chart sharing. If you were previously supporting chart sharing you will need to include this file.

  • Breaking change: stx-demo.html and stx-demo.css have been renamed stx-standard.html and stx-standard.css. Please be sure to update your include references.

  • Breaking change: stx-drag-chart class is now added to the chart container when dragging, no longer the document.body

  • Breaking change: the stxx.callbacks.studyOverlayEdit function definition in stx-advanced.html was slightly updated. You will need to replace the function on your project with the latest one to ensure overlay studies properly delete.

  • Breaking change: CIQ.ChartEngine.YAxis#drawPriceLabels now controls the rendering of all y axis labels (using CIQ.ChartEngine#createYAxisLabel). Setting this to false will turn off y-axis labels regardless of any other settings. For study series, stxx.preferences.labels now controls the rendering. Example: stxx.preferences.labels=false;. This flag can be set to false before calling CIQ.Studies.displayIndividualSeriesAsLine or CIQ.Studies.displaySeriesAsLine and then set back to true to disable labels just for that one study.

  • Breaking change: The up/down arrow buttons on the main chart control panel as well as the focus (solo) button on all panels have been removed on the stx-advanced.html sample template. To re-enable them, comment out the display:none; line on the following style controls found in stx-advanced.css

      /* comment out if you want the main chart controls on. */
      .stx-panel-control.stx-chart-panel .stx-btn-panel{
          display:none;
      }
    
      /* comment out if you want the focus button on. */
      .stx-panel-control div:nth-of-type(3) { /* solo button */
          display:none;
      }
  • Breaking change: the stxx.callbacks.studyOverlayEdit function in your project (originally in) stx-advanced.html must be replaced with the latest code to allow for a custom removal process needed on special studies.

Specifically this portion of the function:

    CIQ.safeClickTouch(remove, function(){
        CIQ.DialogManager.dismissDialog();
        var removeFN=sd.libraryEntry.removeFN?sd.libraryEntry.removeFN:CIQ.Studies.removeStudy;    // <---- changed
        removeFN(stx,sd);                                                                          // <---- changed
        var closeIcon=$$$("#menuWrapperStudies #" + sd.type.replace(" ","-"));
        if(closeIcon) {
            CIQ.clearSafeClickTouches(closeIcon);
            closeIcon.style.display="";
        }
    });
  • A new "pretty" algorithm is the default for calculating y-axis grid levels. Set CIQ.ChartEngine.YAxis.prototype.pretty=false for the old algorithm.

  • The number of decimal places to use in the current price label is now calculated by the callback calculateTradingDecimalPlaces. The default implementation now looks at the most recent 50 trades rather than the entire masterData. This reduces the risk of displaying too many decimal places due to unscrubbed data. This methodology can be overridden if desired (for instance if a source exists for the actual number of decimal places). See CIQ.ChartEngine#callbacks

  • Charts with second and millisecond periodicities are now supported. Pass an optional third parameter timeUnit into setPeriodicityV2 to qualify the periodicity number. For instance to create a 5 second chart from 5 second data: setPeriodicityV2(1, 5, "second").

  • Added CIQ.yyyymmddhhmmssmmm method to support second and millisecond charts. Drawings will now save in this format but will remain backward compatible with drawings saved prior to this upgrade.

  • Added volume_candle chart type.

  • New studies:
    • Darvas Box study
    • STARC Bands study
    • Supertrend study
  • New views in TFC positions panel. Easily add protection to current positions. Display P&L. Display "trades" view for Forex systems. New Enhanced positions configs:
    • config.closeAll drives the close all button
    • config.tradeActions controls the protection view
    • The presence of account.trades drives the lots view and the ability to protect/close a trade.
  • Practice Trading Simulator is now available as a plugin.

  • Autochartist is now available as a plugin.

  • To improve layout efficiency , the default study menu in stx-advanced.html now contains a lookup capability. Only the most popular studies will be displayed in the initial drop down. This initial list can be modified by altering the HTML in stx-advanced.html. Clicking "all" will pull up a scrollable list of studies.

  • Drawing undo button now available in stx-advanced.html

  • Added new "HeatMap" renderer. See CIQ.Renderer.Heatmap

  • Horizontal trackpad/mouse wheel support

  • Fixed clipping issues with IE8 excanvas.

  • Candles are now "centered" in their allocated space. Previously candles were left aligned. This would not have been noticed in most cases but was counter-intuitive for developers who were writing code to draw directly on the canvas.

  • CIQ.Studies.addStudy can now be called directly. CIQ.Studies.quickAddStudy is deprecated but still supported.

  • QuoteFeed now receives both a symbol and a symbolObject. A symbolObject can contain additional information used to identify a security, for instance exchange code. See {@CIQ.QuoteFeed#fetch} and CIQ.ChartEngine#newChart for details on how to use a symbol object in your chart.

  • CIQ.ChartEngine#addSeries now supports a symbol and a symbolObject.

  • CIQ.Comparison.add was enhanced - compareSymbol now supports a symbol and a symbolObject.

  • CIQ.ChartEngine#newChart is now capable of setting periodicity and span via params settings.

  • CIQ.ChartEngine#appendMasterData - Function signature updated:
    • params bypassGovernor and allowReplaceOHL were added
    • params force was deprecated. Every call will update the tick to maintain the proper volume and createDataSet is now controlled by sp.maxTicks, sp.timout or params.bypassGovernor
  • CIQ.LegacyMarket.getNextOpen, CIQ.LegacyMarket.getPreviousClose - Function signature updated:
    • stx is now a required parameter
  • CIQ.ChartEngine.YAxis#shadowBreaks was added. This is an array that determines how many decimal places to print based on the size of the shadow (the difference between chart high and chart low). The array consists of tuples in descending order. If the shadow is less than n1 then n2 decimal places will be printed. Set to CIQ.ChartEngine.YAxis.defaultShadowBreaks by default.

  • CIQ.ChartEngine#mouseWheelAcceleration was added - Set to false to turn off mousewheel acceleration

  • New Drawing tools and constructors:

    • Callout drawing tool. This is like an annotation except it draws a stem and offers a background color and line style.
    • New Shape constructor - CIQ.Drawing.shape is a default implementation of a CIQ.Drawing.BaseTwoPoint drawing which places a "shape" on the canvas. It can be rotated and/or stretched. It is meant to be overridden with specific shape designs, such as arrows, etc.
  • New side-swipe scrolling. 2 finger side-swipe motion on touch pad (left/right) scrolls the chart.


Version 08-2015-01

This is a minor release containing mostly tweaks or minor bug fixes.

  • Please Note: The fibonacci drawing tool has been renamed "retracement" although the old name is supported for backward compatibility.

  • Added mutual fund support in Xignite quote feed

  • Fibonacci timezones, arcs, fan

  • Fibonacci settings

  • Resizing the chart now automatically maintains scroll position

  • IOS8 fixed:position bug workaround in stx-phone

  • Removal of markers bug fix

  • Removed small canvas used for floating last/current price label. It is now directly drawn on the chart canvas using CIQ.ChartEngine#createYAxisLabel The following styles in stx-chart.css are no longer needed:

.stx-float-price {/* Floating horizontal value */
    margin-left: -13px;
}

.stx-float-price-canvas {
    margin-top: 7px;
    margin-left: 2px;
}
.stx-float-price-arrow {
    color: #333;
}
.stx-float-price-inner {
    position: absolute;
    top: 10px;
    padding-left: 13px;
}

Version 07-2015-01

  • Breaking change: CIQ.Comparison.quoteFeedCallback should no longer be set on the QuoteFeed. Comparisons (series) quote fetching is now done automatically when using a QuoteFeed.

Example:

var quoteBehavior={
  refreshInterval: 15,
  //callback: CIQ.Comparison.quoteFeedCallback <<<---- remove this line if you want to use the new automatic series data loading
};

For backwords compatibility, the CIQ.Comparison.quoteFeedCallback function will still be called instead of the new automatic QuoteFedd fetching if defined in the quoteBehavior. But it is important that if you wish to continue using the legacy architecture, you must ensure you continue to flag series properly so the quoteFeedCallback continues to update data as needed. So if your quoteFeedCallback function uses quoteFeedCallbackRefresh as the flag for series that use the QuoteFeed for data, you must continue to include this flag in your series parameters.

  • Breaking change: All drawings and studies have been moved into stxLibrary.js (previously in CIQ.js) except those that are only available with the advanced package which are now in stxAdvanced.js.

  • New drawing types: Gartley, Pitchfork, Channel, Callout, Shapes (arrow, heart, etc). Shapes includes a facility for developers to draw custom shapes by specifying a series of vectors.

  • New Studies: Choppiness Index, Ulcer Index, Disparity Index, Rainbow Oscillator, Rainbow Moving Average, Pring's Know Sure Thing, Pring's Special, Price Momentum Oscillator

  • Support for multiple y-axis, including y-axis on the left side of the chart. See CIQ.ChartEngine.YAxis#position and Renderers

  • The floatHR element (y-axis value that moves with crosshair) is no longer a DIV element but is now painted on to a new transparent canvas called floatCanvas. This was done to facilitate multiple y-axis, where each one would need a separate floating element.

  • Updated, simplified, Markers interface. See Markers. Trade From the Chart, panel icons, home button, etc all modified to use the new Marker interface.

  • New Renderer concept allows developers to build custom "renderers" for building time series based visualizations. Initial Renderer.Line and Render.Histogram can be used for adding multiple series to the chart in either line or stacked histogram format, with optional left y-axis. See Renderers

  • Callbacks object for for developers to tap into commonly requested callbacks such as tap, move, studyOverlayEdit, studyPanelEdit. See CIQ.ChartEngine#callbacks (In stx-advanced.html CIQ.editCallback was replaced with stxx.callbacks.studyPanelEdit and stxx.callbacks.studyOverlayEdit)

  • A new server side symbol lookup module is available for customers who utilize Xignite market data.

  • stx-advanced.html now includes a context menu when right clicking on study overlays. The context menu allows users to either edit or delete the overlay.

  • Charts will now display partial bars on both left and ride side of the chart for a more seamless look. dataSegment as a result can now contain references to bars that are not entirely on the screen. Canvas clipping has been implemented more rigorously to accomodate this new functionality.

  • Baseline Delta charts now have a user draggable centerpoint.

  • Default studies in stx-demo.html have been changed to reduce clutter. Original studies are still available, just manually add them back if you need them.

  • Changes to stx-phone.html to better support full-screen mode, especially on older phones.

  • All browsers other than Chrome now use requestAnimationFrame by default. Set stxx.useAnimation to override this behavior. This improves performance on Firefox and Safari.

  • chart.left, chart.right, chart.width, etc all now refer to the space occupied by the chart panel itself, minus the axis. Similarly panel.left, panel.right, panel.width, etc is available for every panel. Finally, stxx.left, stxx.top, etc now refer to the position of the chartContainer on the page. stxx.width references the width of the chartContainer.

  • A chart object is now required by the LookupWidget (to facilitate language translation).

  • CIQ.destroy() convenience method for destructing (cleaning up) te chart instance and accompanying UI elements.

  • Added CIQ.ChartEngine.YAxis#justifyRight and CIQ.ChartEngine.YAxis#textBackground parameters.

  • stxx.yaxisLeft and stxx.yaxisWidth have been deprecated in favor of CIQ.ChartEngine.YAxis#width and CIQ.ChartEngine.YAxis.left.

  • stxx.preferences.zoomInSpeed and stxx.preferences.zoomOutSpeed now available to set the zoom sensitivity. See CIQ.ChartEngine#preferences

  • Example built in themes in stx-advanced.html use names "White" and "Black". You can keep the old "Light": true, "Dark": true if desired.

  • excanvas.js now supports rudimentary clipping.

  • All convenience price conversion functions now take an optional yAxis argument. See for instance CIQ.ChartEngine#pixelFromPrice.

  • A number of minor syntactical changes were made throughout the library to reduce warnings from jshint.


Version 05-2015-15

  • Chart title reverted back to display by default. Un-comment 'display:none' to hide.
.stx-panel-control.stx-chart-panel{ /* hide chart controls */
    /*display:none;*/
}
  • Added logic to properly remove any studies that relied on the old panel ID name, for instance a moving average on RSI(14) is no

  • stxx.streamParameter.maxWait set to default to 1 second.

  • stxx.allowZoom flag now also enables/disables mousewheel events.

  • Added logic to properly translate between camel and hyphenated preventing style error in order native Chrome browsers.

  • Fixed MA study line dropping to zero at head-end of the chart if not enough data is available in the dataSet.

  • Improved scrolling stability control by reducing the amount of accidental vertical scrolling when panning left/right.

  • Improved performance of appendMasterData.


Version 04-2015-24

  • Breaking change: The library files have been reorganized from the last version into subdirectories: js, css, img. The advanced package also includes a "plugins" subdirectory. See Library Package - file-by-file descriptions for more details.

  • Breaking change: A new file stxLibrary.js now contains a library of studies, drawing tools and quote feeds that were previously contained in the kernel.

  • Breaking change: New SVG elements are now included in the img directory. These are used to render some chart components such as the icons on the chart panels.

To maintain IE8 compatibility, please ensure the following code is included:

// IE8 doesn't support svg as background image. This will cause a png to be used instead.
if(!document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1"))
  CIQ.appendClassName($$$("body"), "no-svg");
  • Breaking change: QuoteFeed implementations should now support startDate<->endDate. This specific date range functionality is required by the chart when loading comparison symbols.

  • Breaking change: the chart is now market hours aware. As such a valid symbol must be used in stxx.newChart(symbol, masterData); so the library can activate the proper exchange hours. To disable market hours and default to 24x7, set stxx.calendarAxis=true;. stxx.beginHour, stxx.beginMinute, stxx.endHour, stxx.endMinute are no longer relevant.

  • Breaking change: CIQ.ChartEngine#setSpan and CIQ.ChartEngine#setRange will now intelligently fetch appropriate data when called, if a QuoteFeed is attached and the masterData does not contain all data required to render the range selected. This makes it much easier to build range pickers. setSpan now also supports "all", "ytd" and "today" as possible values. Be aware the functions will now override the selected periodicity and automatically choose the best periodicity for the selected range according to the following rules map:

          [
              {range:CIQ.WEEK, periodicity:1, interval:5}, // Any range less than a week, load 5 minute bars
              {range:CIQ.MONTH, periodicity:1, interval:30}, // Any range less than a month, load 30 minute bars
              {range:CIQ.MONTH*7, periodicity:1, interval:"day"}, // Any range less than a year, load daily bars
              {range:CIQ.DECADE, periodicity:1, interval:"day"}, // Any range less than a decade, load daily bars
              {range:CIQ.DECADE*10, periodicity:1, interval:"month"}, // Any range less than a century, load monthly bars
              {range:Number.MAX_VALUE, periodicity:12, interval:"month"} // Anything greater than a century, load yearly bars
          ]

    See CIQ.ChartEngine#setSpan and CIQ.ChartEngine#setRange for usage details and parameters needed to override the new defaults.

  • Breaking change: The panel control buttons layout has been restructured. There is a new div called stx-btn-panel and new background files.

Previous version panel controls layout:

<div class="stx-panel-control" style="display: none;"><div class="stx-panel-title"></div><div class="stx-btn stx-ico"><span class="stx-ico-up"> </span></div><div class="stx-btn stx-ico"><span class="stx-ico-focus"> </span></div><div class="stx-btn stx-ico"><span class="stx-ico-down"> </span></div><div class="stx-btn stx-ico"><span class="stx-ico-edit"> </span></div><div class="stx-btn stx-ico"><span class="stx-ico-close"> </span></div></div>

This version panel controls layout:

<div class="stx-panel-control"><div class="stx-panel-title"></div><div class="stx-btn-panel"><span class="stx-ico-up"></span></div><div class="stx-btn-panel"><span class="stx-ico-focus"></span></div><div class="stx-btn-panel"><span class="stx-ico-down"></span></div><div class="stx-btn-panel"><span class="stx-ico-edit"></span></div><div class="stx-btn-panel"><span class="stx-ico-close"></span></div></div>

You will need to make sure your CSS contains the following (IF NOT COMPLETELY REPLACING WITH THE NEWLY PROVIDED CSS FILES) :

/* Panel Buttons */

.stx-btn-panel,
.stx-btn-panel span {/* Button Defaults */
 display:inline-block;
 width:25px;
 height:25px;
 cursor:pointer;
   -webkit-transition: -webkit-transform .2s;
   transition: transform .2s;
}
.stx-btn-panel {/* Button Spacing */
 margin:3px 2px;
 }
.stx-btn-panel:hover span,
.stx-btn-panel:active span {/* Make buttons full opacity on hover or hit */
 opacity:1;
 }
.stx-btn-panel:active {/* Scale up when active */
 -webkit-transform: scale(1.2, 1.2);
 -ms-transform: scale(1.2, 1.2);
 transform: scale(1.2, 1.2);
}
.stx-btn-panel span {/* Button Icons */
 background-image:url(../img/stx-sprite-panels.svg);
 opacity:.6;
   -webkit-transition: opacity .2s;
   -moz-transition: opacity .2s;
   transition: opacity .2s;
}
.no-svg .stx-btn-panel span {/* Button Icons for non SVG browsers */
 background-image:url(../img/stx-sprite-panels.png);
}
.stx-btn-panel > span.stx-ico-up {background-position: -150px -25px;}
.stx-btn-panel > span.stx-ico-down {background-position: -200px -25px;}
.stx-btn-panel > span.stx-ico-close {background-position: -250px -25px;}
.stx-btn-panel > span.stx-ico-edit {background-position: -300px -25px;}
.stx-btn-panel > span.stx-ico-focus {background-position: -350px -25px;}

.stx-panel-control.stx-chart-panel{ /* hide chart controls */
 display:none;
}

.stx-panel-control div:nth-of-type(3) { /* solo button */
 display:none;
}

You may need these as well if you don't have it:

.stx-panel-control {/* Panel Control buttons template */
 position: absolute;
 left: 0px;
 overflow: hidden;
 z-index: 30;
 display: none;
}

.stx-panel-control * {
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
}

.stx-panel-control.stx-show {
 display: inline-block;
}

.stx-panel-title {/* Panel/Chart Titles */
 margin: 5px 10px;
 float: left;
 display: inline-block;
 color: #333;
 padding: 0 10px;
 line-height:22px;
 font-size: 12px;
 text-align:left;
 text-transform: uppercase;
 -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, .2);
 -moz-box-shadow: 0px 1px 2px rgba(0, 0, 0, .2);
 box-shadow: 0px 1px 1px rgba(0, 0, 0, .2);
 cursor: auto;
 background-color:#fff;
}

.stx-panel-control .stx-btn {/* Float all icons so they stay in line on the left */
 float: left;
}

Use this for the light theme (replace existing):

.Light .stx-btn-panel > span.stx-ico-up {background-position: -150px -25px;}
.Light .stx-btn-panel > span.stx-ico-down {background-position: -200px -25px;}
.Light .stx-btn-panel > span.stx-ico-close {background-position: -250px -25px;}
.Light .stx-btn-panel > span.stx-ico-edit {background-position: -300px -25px;}
.Light .stx-btn-panel > span.stx-ico-focus {background-position: -350px -25px;}

Use this for the dark theme (replace existing):

.Dark .stx-btn-panel > span.stx-ico-up {background-position: -150px -50px;}
.Dark .stx-btn-panel > span.stx-ico-down {background-position: -200px -50px;}
.Dark .stx-btn-panel > span.stx-ico-close {background-position: -250px -50px;}
.Dark .stx-btn-panel > span.stx-ico-edit {background-position: -300px -50px;}

Make sure to add the new background-image:url(../img/stx-sprite-panels.png) and background-image:url(../img/stx-sprite-panels.svg)

  • Breaking change: The "focus" icon which temporarily hides the other panels has been eliminated. It can still be added back for users who want backward compatibility by changing this line in stx-advanced.css:
.stx-panel-control div:nth-of-type(3) {
    display: none;
}
  • Breaking change: The chart title (symbol displayed on the upper left corner of the main chart) has been eliminated in the advanced package in favor of the input symbol box which also displays it. It can still be added back for users who want backward compatibility by changing this line in stx-advanced.css:
.stx-panel-control.stx-chart-panel{ /* hide chart controls */
    display:none;
}
  • It is no longer necessary to include stxTimeZoneData.js unless you wish to support the Timezone UI widget (standard and advanced packages). The default implementation now includes just the timezone information for New York and UTC which is necessary to support market hours logic. If you require logic for other timezones then you should include stxTimeZoneData.js.

  • Smooth scrolling. Charts now scroll pixel by pixel instead of candle by candle. This results in a smoother looking scrolling. An animation is used when pressing the zoom buttons. CIQ.ChartEngine.micropixels now contains the offset in pixels from the basepoint of the first candle. set stxx.animate=null to turn off the animation effect.

  • New chart types Heiken Ashi, Kagi, Line Break, Renko, Point & Figure. (Advanced Package).

  • Gartley drawing tool. (Advanced Package).

  • New Studies: Relative Volatility, Market Facilitation Index, Relative Vigor Index, Alligator, Gator

  • New optional StockTwits and RSS News plugins. (Advanced Package).

  • studyLibrary now contains a friendly "name" member which can be used to drive automatic generation of menus.

  • Custom studies that require data to be fetched from a remote server can now do so by attaching a custom CIQ.QuoteFeed to the study.

  • Drawing tools now take into consideration shifting timezones, so that a user's drawings will appear in the right spot when they move to another timezone. Use the CIQ.Drawing#setPoint method to accomplish the same when building custom drawings.

  • CIQ.ChartEngine.layout.chartScale="log" is now the preferred way to enable log scale (CIQ.ChartEngine.layout.semiLog is maintained for backward compatibility).

  • YAxis Features: yAxis.min and yAxis.max can be used to set fixed minimum and maximum values for the y-axis. (For instance 0 and 1 on a percentage chart) yAxis.drawCurrentPriceLabel - set to false to not draw the current price label yAxis.drawPriceLabels - set to false to not draw price labels on that axis only yAxis.goldenRatioYAxis - will attempt to create grid lines that approximate the golden ratio. This creates an "airy" modern looking chart

yAxis parameter object can now be passed directly into the CIQ.ChartEngine constructor.

  • A custom yAxis parameter object can now be specified as part of the studyLibrary entry for a study.

  • More refinements to the non-time-based axis algorithm. xAxis.axisType="ntb" now provides superior x-axis label alignments under most conditions. This axis is enabled by default for range bars, kagi, renko and p&f

  • stxx.allowZoom and stxx.allowScroll can now be set to false to disable zooming or scrolling. Must be sent in as a config parameter to CIQ.ChartEngine. Example: var stxx=new CIQ.ChartEngine({container:$$$(".chartContainer"), allowZoom:false, layout:{"candleWidth": 16, "crosshair":true}});

  • Injections can now be made to independent chart instances (as well as the prototype that affects all charts).

  • CIQ.addMemberToMasterdata can now be used to add a raw data series to the chart. (this is used internally by CIQ.ChartEngine#addSeries).

  • Fixed bug in CIQ.ChartEngine#tickFromPixel where the tick was being multiplied by the periodicity.

  • An injection was added to stx-advanced.html and stx-demo.html to provide a mechanism for deleting studies that don't support right click.

  • Performance improvements on createDataSet.

  • Complex security types are now supported. That is, a security object can be passed into newChart now instead of a string. Your QuoteFeed will receive this object. Set object.symbol to the unique label you want to print on the chart.

  • #chartContainer deprecated in favor of .chartContainer in css

  • Revised and simplified styling for chart components based on scalable svg elements.

  • z-index values of chart components have been re-arranged.


Version 01-2015-20

  • Breaking change: createVolumePanel() has been deprecated. Previously volume charts were created within CIQ.ChartEngine.displayChart(). Now they follow the same loading process as any other study. As such, the layout of the storage and retreival format has changed.

To make this change transparent to the end users, you can either

1- Add the following line at the end of displayChart() if the "vchart" panel is present:

if(stxx.panels.vchart) CIQ.Studies.addStudy(stxx, "volume", {}, {"Up Volume":"#8cc176","Down Volume":"#b82c0c"});

2- Add code in the restoreLayout() function to append the following to the layout data before calling stxx.importLayout(d) :

vchart:{
    type:"vchart",
    inputs:{
        id:"vchart",
        display:"Volume"
    },
    outputs:{
        Up Volume:"rgb(227, 100, 96)",
        Down Volume:"rgb(184, 44, 12)"},
        panel:"vchart",
        parameters:{
            chartName:"chart",
            editMode:true
        }
    }
}

It assumes the layout already includes the pannel "vchart":

panels:{
    chart:{"percent":0.7622929936305733,"display":"SPY","chartName":"chart"},
    vchart:{"percent":0.2377070063694267,"display":"Volume","chartName":"chart"}
}

Here is the function where you need to add the code:

function restoreLayout(){
    var datum=CIQ.localStorage.getItem("myChartLayout");
    if(datum==null){
        return;
    }
    var d=JSON.parse(datum);

    /****************************************************************/
    /********** add code here to include d.studies.vchart  **********/
    /****************************************************************/
    if(d.panels.vchart && d.studies && !d.studies.vchart)
        d.studies.vchart=    {
                                type:"vchart",
                                inputs:{
                                    id:"vchart",
                                    display:"Volume"
                                },
                                outputs:{
                                    Up Volume:"rgb(227, 100, 96)",
                                    Down Volume:"rgb(184, 44, 12)"},
                                    panel:"vchart",
                                    parameters:{
                                        chartName:"chart",
                                        editMode:true
                                    }
                                }
                            };
    stxx.importLayout(d);
    if(stxx.layout.semiLog) CIQ.appendClassName($$$(".stxLog"), "true");
    if(stxx.layout.aggregationType=="heikinashi") CIQ.appendClassName($$$(".stxHeikinashi"), "true");
    else if(stxx.layout.aggregationType=="kagi") CIQ.appendClassName($$$(".stxKagi"), "true");
    else if(stxx.layout.aggregationType=="linebreak") CIQ.appendClassName($$$(".stxLinebreak"), "true");
    else if(stxx.layout.aggregationType=="pandf") CIQ.appendClassName($$$(".stxPandf"), "true");
    else if(stxx.layout.aggregationType=="renko") CIQ.appendClassName($$$(".stxRenko"), "true");
    else if(stxx.layout.aggregationType=="rangebars") CIQ.appendClassName($$$(".stxRangebars"), "true");
}
  • minMax miscalculations on studies with negative values due to use of MIN_VALUE

  • Studies can now be specified as singletons by including "singleton=true" in the library entry. This will prevent this study from being loaded in multiple panels.

  • Editing studies of studies now works correctly, daisy chaining all the way from parent to youngest child study

  • Additional moving average types

  • New Study : Volume profile

  • CIQ.ChartEngine and UI Singletons now have destroy() methods to clean up their memory heaps

  • Default timezones for pacific islands modified based on customer feedback

  • minimumCandleWidth member of CIQ.ChartEngine now specifies the smallest user zoom (1 pixel by default, previously 0.25)

  • Bug fix for chart borders on studies with "zones"

  • More efficient createDataSet() method

  • Formula corrections for pivot points

  • Iscroll5 is now "probe edition"


Version 12-2014-02

Breaking change: stxThirdParty.js and stxTimeZoneData.js are now required includes because our market date logic (used to compute the x-axis) is now timezone aware. Please includes these two scripts before CIQ.js.

Breaking change: The floating price label is now based off of a small canvas. CSS changes are necessary for a smooth transition. These are included in the updated stx-chart.css

.stx-float-price {/* Floating horizontal value */
    margin-left: -13px;
}

.stx-float-price-canvas {
    margin-top: 7px;
    margin-left: 2px;
}
.stx-float-price-arrow {
    color: #333;
}
.stx-float-price-inner {
    position: absolute;
    top: 10px;
    padding-left: 13px;
}

Breaking change: The DrawingToolbar has changed. To maintain compatibility please copy the <div class="stx-toolbar" id="stx-toolbar">...</div> section from the new stx-demo.html or stx-advanced.html to your existing system.

CIQ.ChartEngine now accepts a config object. The config object can contain any member variable or subvariable for the CIQ.ChartEngine object. For instance to set up a mountain chart:

var stxx=new CIQ.ChartEngine({chartType:"mountain", container:$$("chartContainer")});

Aesthetic improvements:

+ Capitalized months by default on x-axis
+ Optional borders on chart enabled with stxx.axisBorders
+ More pleasing volume study and volume underlay
+ User customizable colors for volume and volume underlay
+ Crisper drawings
+ Options for y-axis label pointers. Default is now pointy arrow. See yaxisLabelStyle in CIQ.js
+ initialMarginTop and initialMarginBottom now default to 10 pixels to create buffer space at bottom and top of chart
+ More intuitive y-axis numbering
+ Support for billions and trillions in CIQ.condenseInt() for studies such as on balance volume
+ yTolerance stiffened so that horizontal panning is more natural for users. yTolerance exposed for developer override stxx.yTolerance
+ stxx.extendLastTick extends line and mountain charts to left and right edge of candleWidth for continuous look.

New baseline_delta chart type displays green above first (opening) tick and red below first tick.

New colored_line chart type alternates green/red on up down days

Range bar charts now available by setting stxx.layout.aggregationType="rangebars". A default range will be selected or programatically set stxx.layout.range to your desired range. Note that this is only available programatically.

Candle shadows (wicks) can now have different up/down colors. Custom colors on mountain charts can now support user controlled gradient.

Custom chart callbacks can now be used to program chart types where the color is determined programatically.

Drawings may now be repositioned by end users.

Annotations now support user defined font/size/color.

Fibonacci now supports printing prices rather than levels (programatically by setting CIQ.ChartEngine.currentVectorParameters.fibonacci.printValues=true)

Non-Time-Based x-axis for supporting tick, range bars and other chart types that have non-linear dates on the x-axis. Set xAxis.axisType="ntb" or stxx.layout.interval="tick".

xAxis variables exposed for developer override. See CIQ.ChartEngine.XAxis. xAxis.formatter callback can be used to completely control x-axis formatting.

Stochastics now defaults to displaying overbought/oversold zones (similar to RSI).

New "0 to max" study type now supported. Studies such as OBV and TVI now extend the full height of their axis to show their range over the course of the chart.

CIQ.DropDownManager for creating drop downs. This class uses document level events rather than an overlay to detect "tap to close".

stxx.streamParameters can now throttle inbound ticks to streamTrade().

stxx.cleanupGaps when set to true the chart will automatically identify gaps in a linear chart sequence and populate those gaps with last close dashes

Async callbacks now allow developers to know when a chart has rendered when it depends on asynchronous date (for instance a study that makes a call out to a server for data). See CIQ.ChartEngine#startAsyncAction, CIQ.ChartEngine#completeAsyncAction, CIQ.ChartEngine#registerChartDrawnCallback

CIQ.ChartEngine#postAdjustScroll and CIQ.ChartEngine#preAdjustScroll can be used to maintain a chart scroll position between resize events,such as if you need to adjust the size of the chart container.

DrawingToolbars can now be set up for multiple charts on one screen.

Iscroll5 is now available in stxThirdParty.js. We will be migrating from Iscroll4 to Iscroll5. Iscroll5 has much better support, particularly support for active scrollbars.

Dropped support for legacy class names such as STXStudies (now CIQ.Studies). It is no longer necessary to set stx_namespaced=true.

Version 08-2014

Breaking change: as of this version many of the CSS styles have been changed. In general we have added stx- in front of styles. So what previously was "btn" would now be "stx-btn". This was done to avoid conflicts with toolkits such as Bootstrap and Angular.js which are now using many of the same names.

If you're using a prior version and have either customized the HTML or CSS there will be some effort to convert forward. You can compare the new stx-demo.html or stx-advanced.html files with the previous ones to see the CSS changes. If you have not heavily modified the code then you should be able to use a merge tool to quickly make the transition.

At the bottom of stx-demo.html and stx-advanced.html we have included a function called stxClassReplacer() to assist in the transition. This function will automatically convert any old CSS names to the new CSS names in real-time. The way to use this is:

1) replace the old stx-demo.css file with the two new files (stx-chart.css and stx-demo.css) 2) Copy the stxClassReplacer() function to your current code 3) Uncomment the conversion map

Now your old code should work with the new CSS. We recommend running this way as a temporary solution. Now:

1) Comment each line in the conversion map 2) Manually convert the class name in your HTML. For instance, change all instances of class="btn" to class="stx-btn" 3) Make sure nothing is broken 4) Repeat

After finishing this process your code should now be converted to the new CSS.

  • New file stx-chart.css contains the basic CSS required for a chart, but none of the CSS required for widgetry such as is found in stx-demo.html.
  • Removed stx-demo-theme-1.css and stx-demo-theme-2.css. These files are no longer necessary for theming. Instead, the class "Light" or "Dark" is automatically added to the BODY tag when a theme is enabled, causing CSS to be overridden by the higher specificity. The themes are thus included directly in stx-demo.css. You can of course override these themes if desired.
  • stx-print.css is now included. This formats the chart properly for printing.
  • A new phone interface is available in the Advanced package. This includes the new files stx-phone.css, stx-phone.html, stx-sprite-phone.png and stx-sprite-phone@2x.png.
  • STX_SAMPLE_30MIN.js and STX_SAMPLE_5MIN.js are no longer included. Demonstration intraday data is now generated randomly by CIQ.QuoteFeed.Demo
  • New Trade From Chart package
  • Ichimoku Cloud study now available in Advanced package
  • New CIQ.QuoteFeed class now makes it much easier to integrate a custom quote feed using an event driven callback model.
  • Most classes now using STX namespace. STXDialog becomes CIQ.Dialog. The old classes are still available for backward compatibility.
  • The library is now compatible with Require.js.
  • All global functions have now been moved into the STX namespace. The global functions are still available for backward compatibility.
  • STX#loadScript can now dynamically load JavaScript content.
  • "Right click to delete" message now appears when hovering on drawings or overlay studies.
  • Y-axis labels are now added for user drawn horizontal lines
  • Measure tool now available in Advanced package
  • Zoom by grabbing y-axis or x-axis with mouse
  • Charts now automatically detect container size changes through 1 second polling mechanism. Turn off by setting stxx.resizeDetectMS=0
  • Charts now default to displaying gaps when Close=null for a data point
  • CIQ.ChartEngine#setStyle function now available to programatically change chart styles
  • CIQ.ChartEngine#removeDrawing function to programatically remove user drawings
  • CIQ.ChartEngine#drawXAxis now separates out functionality from CIQ.ChartEngine#createXAxis so that either can be ammended through the Injection API
  • Smarter x-axis layout code to avoid unnecessary gaps and handle overlapping labels
  • yAxis.minimumPriceTick can be set to specify that the y-axis vertical grid be drawn with specific ranges. eg stxx.chart.panel.yAxis.minimumPriceTick=.25
  • Automatic selection of text color for y-axis labels
  • Vertical zoom is now pixel based rather than price based making for much smoother zooming
  • stxx.initialMarginTop and stxx.initialMarginBottom can now be used to add space to top or bottom of chart
  • Candle rendering is crisper and wicks are now always centered
  • series can now be added using the CIQ.ChartEngine#addSeries method
  • CIQ.ChartEngine#watermark now supports vertical and horizontal centering
  • Data can now be initialized either as a string for Date or as a JavaScript Date object (DT). See CIQ.ChartEngine#newChart, CIQ.ChartEngine#setMasterData

Version 05-2014

  • Added loadWidget method to dynamically load html/css/js functionality
  • Added safeClickTouch, safeMouseOver, safeMouseOut, safeDrag functionality for supporting complex UI with mouse and touch devices
  • dragToDraw capability now supports optional draggable drawing tools
  • Mountain chart color can now be user selected
  • CIQ.ChartEngine.yaxisLeft can now be used in conjuction with yaxisWidth to control positioning of the y-axis (for instance the y-axis can now be on top of the chart)
  • Timezone calculation performance improved with caching
  • Clearing drawings can now be undone with undo()
  • Improvements to x-axis time/date scaling
  • Performance improvements when scrolling and zooming chart
  • “chart-title” class can be used to style the symbol label on a chart
  • Smoother zooming. Better Apple Magic Mouse support.
  • z-indexes of chart controls raised by one
  • Fixed faulty GMT timezone choice

Standard Package

  • Added vertical line drawing tool
  • Added full screen capability

Advanced Package

  • Added freeform and continuous drawing tools
  • Added optional side panels to stx-advanced.html

Version 02-2014

Breaking change: as of this version the charts will no longer function when double clicked from the filesystem (file:///). Instead, you can develop the charts using localhost or 127.0.0.1

  • Chart "componentry" is now dynamically created. No need to include these html elements in your chart container unless you wish to override them.
  • Added support for "series" overlays
  • Added last sale streaming capability
  • Drawings can now be made in panels
  • Mousewheel zoom
  • "Mountain" chart type
  • Y-Axis labels are now native canvas and not DOM. Optionally display labels for all indicators and overlays.
  • Native importLayout() and exportLayout()
  • Consolidation of file structure.
  • Create a new chart using newChart() function which consolidates setMasterData(), initializeChart(), createDataSet() and draw().
  • Injection API now support multiple append and prepend functions.
  • Increased developer control over the y-axis on charts and studies
  • Built in modalBegin() and modalEnd() functions
  • floatDate now a built in capability
  • currentPanel now always equals the current panel that the cusor is within
  • priceFromPixel() now takes an optional second "panel" parameter and can be used on indicator panels
  • Further performance enhancements
  • Less sensitive vertical scrolling (horizontal pans are now more even)
  • Better pinching (pinches now occur where the user places her fingers and more consistent with the motion of the pinch)
  • Automatic resizing of chart canvas even when container is resized dynamically
  • Developer control over Fibonacci tool layout
  • Added createDrawing() convenience function
  • Undo functionality now built in using undoLast() function
  • deleteAllPanels() function now available

Version 11-2013

  • Performance tuning. A significant effort has been put into performance tuning the application so that it can provide quicker rendering and user interface.
  • Support for HTML5 Canvas animation by setting ‘CIQ.ChartEngine.useAnimation=true’. Animation is automatically enabled for Android devices.
  • Drawing tool overhaul. A new drawing tool architecture has been released. Building custom drawing tools is much easier. Rectangles and ellipses are now supported natively. Line width and pattern can now be selected. Annotations no longer include a "stem".
  • Right hand side whitespace is now automatically maintained when a user selects a chart. This provides an improved experience for end users.
  • A new translation API and toolkit now included in stxI18N.js. See the documentation on Localization.
  • Logarithmic charting display has been improved. Users can now pan and resize logarithmic charts without affecting the aspect ratio.
  • Improved pinching and zooming. The chart is now intelligent about its placement when zooming, especially when pinching on touch devices.
  • Scatterplot chart now supported for datasets with more than one value per x-axis location.
  • CIQ.ChartEngine#getStartDateOffset, CIQ.ChartEngine#setStartDate, CIQ.ChartEngine#leftTick methods provide convenient programmatic access to chart navigation.
  • Vertical line tool.
  • tickFN functionality now deprecated. seriesFN should be used for all custom indicators in order to boost performance.

Version 9-2013

  • Added stx-quickstart.html file.
  • Added stx-demo.html sample file – supports changing chart colors, enabling themes, smart menus, smart dialogs, symbol lookup widget, Scrolling manager, Timezone selector, Storage manager, drawing toolbar, head's up display
  • Added stx-demo.css, stx-demo-theme-1.css, stx-demo-theme2.css files.
  • Added stxUI.js library file.
  • Renamed sample.html to stx-sample.html and included more coding examples.
  • Consolidated images into stx-chart-icons.png and stx-ui-icons.png sprite files.
  • $$$() convenience function for using css selectors
  • clearCanvas() renamed STX#clearCanvas. Now supports clearing of canvas on old (defective) Android devices. Enable this functionality by setting global CIQ.ChartEngine.useOldAndroidClear to true.
  • Default color palette for drawing modified to more useful, web friendly colors
  • STX#newChild convenience function for creating new HTML elements
  • stxStudies – library now supports "auto" colors which will automatically be white or black depending on the brightness of the chart background
  • CIQ.Studies#quickAddStudy – convenience function for programmatically adding new studies.
  • RSI now defaults to display of overbought and oversold lines. Override the CIQ.Studies#studyLibrary "parameters" to eliminate or change the defaults.
  • Studies may now be programmatically created with the "permanent" flag which will prevent users from deleting them.
  • Optional "yaxis" library parameter can override drawing the y-axis for a study.
  • Default study y-axis spacing reduced to provide more y-axis points.
  • Line drawings that go off screen no longer display horizontally at top or bottom of the chart.
  • Dashed and dotted line drawings now supported.
  • Timezone support.
  • CIQ.ChartEngine.Chart.beginHour, CIQ.ChartEngine.Chart.beginMinute, etc now automatically default to 24 hour trading unless overridden.
  • CIQ.ChartEngine.Chart.minutesInSession now automatically calculated.
  • CIQ.ChartEngine.registeredCharts eliminated in favor of CIQ.ChartEngine.registeredContainers which contains references to the HTML containing elements.
  • showMeasure html element eliminated (consolidated with mSticky)
  • x-axis drawing and layout improved to eliminate gaps and overlaps
  • CIQ.ChartEngine#formatPrice now available to format price in locale format
  • CIQ.ChartEngine.constructVector now takes a "parameters" parameter which describes the width and pattern of the line, segment, etc.
  • Candle borders now supported.
  • “hollow" candle chart type now supported.
  • Panel close icon moved to top of panel, and changed from trashcan to "X"

Version 7-2013

This version adds support for the following:

  • Internationalization – See tutorial Localization and new files stxI18N.js as well as the Intl.js library for more details.
  • Multiple Charts – Multiple charts may now be displayed on the screen without the use of iframes. See the new stx-multi.html sample file.
  • Internet Explorer 8 Support – Using the excanvas.js shim library. Note that in order to support IE8 charts must not be created until the document body has been fully loaded. sample.html therefore no longer calls 'loadChart' inline but instead calls it via body onload.
  • Improved layout of x-axis eliminates gapped spacing and overlapping labels.
  • CIQ.ChartEngine objects may now be set to manage their own mouse and touch events by setting CIQ.chart.manageTouchAndMouse= 'true'. When this is done the document level mouse and touch events can be eliminated from the main html page.
  • Some minor changes were made to sample_style.css to better support the menu layouts in sample.html. measureLit and measureUnlit classes were deprecated.
  • CIQ.Studies#go now accepts an CIQ.ChartEngine object as a second parameter. This is necessary to support translation.
  • {link CIQ.displayInitialized} variable is now set when a chart is rendered. The old method of checking CIQ.chart.crossX!=null is no longer valid.
  • A streaming chart simulator was added to sample.html in order to better demonstrate the usage of CIQ.ChartEngine#appendMasterData.
  • CIQ.ChartEngine may now be constructed with a container DIV reference. That container may be accessed at CIQ.ChartEngine.chart.container.
  • References to HTML navigational componentry are not included in CIQ.ChartEngine.chart. These include mSticky, showMeasure, annotationSave, annotationCancel and chartControls.
  • CIQ.MenuManager.registeredCharts now contains an array of all CIQ.ChartEngine objects on the page.
  • Right clicking through context menu can now be overridden by replacing document.oncontextmenu. See CIQ.ChartEngine

Version 5-2013

Important! stxModulus.js has been added as a new file. Please be sure to include this in your application before stxKernelOs.js with the charset="ISO-8859-1" attribute.

Important! The CIQ.computeLength() object has been modified. It no longer takes a height but instead takes two prices, high and low. This was necessary to support logarithmic charts which cannot by their nature support linear length calculations. If you've used this function in your code then please modify those cases to the new signature.

Important! STXMarket.nextPeriod() and STXMarket.prevPeriod() both now require an interval. This was necessary for supporting intraday charts with n-period intervals. If you've used these functions independently then please modify your code to use the new signature.

Important! Div objects that previously were placed outside of the chart containing object must now be positioned within the chart containing object. In sample.html this is the section under the "CHART TEMPLATES" comment. This decision was driven by the increasing complexity of positioning the objects on charts that are being used in many different ways. By placing these objects within the chart container the library has fewer calculations to make and the likelihood of bugs is decreased.

  • The layout of mSticky and showMeasure have changed slightly.
  • Also in this version div tags have been added for the crosshairs. In previous versions the crosshairs were created dynamically by the library but this now gives web developers more control over these tags. (note that the z-index for crosshairs has also been reduced from 3 to 2).
  • A currentHR tag has been added that displays the current price on the Y-axis in green or red depending on whether the security is currently up or down.
  • A button has been added to toggle crosshairs on or off.
  • Semi-Logarithmic scale is now supported. Set stxx.layout.semiLog=true to turn on semi-log scaling.
  • A new periodicity function stxx.setPeriodicityV2(period, interval) allows more flexible periodicity for intraday charts. See the new section in this documentation on periodicity. (Note that setPeriodicity() remains functionally deprecated).
  • The functions for floatDate and floatHR in sample.html have been modified to reflect the changes in the contained objects. If you've copied these functions into your own code be sure to modify it to reflect these changes. -The mouse and touch events section in sample.html main() function have been modified to provide better support for Windows8 touch events. The library is now compatible with "all in one" computers that use both touch and a mouse. For complete touch support please migrate to this new functionality.
  • A new library stxSocial.js is available. This library supports chart image creation and sharing. Please contact us if you'd like to license this package.
  • CIQ.ChartEngine.appendMasterData() can now be used to implement auto-updating or streaming charts. See the new section in the above documentation.
  • CIQ.Studies.removeStudy() can now be used to programmatically remove a study.
  • Several new convenience functions have been added to stxUtilities.js.

Version 3-2013

  • This version remains unchanged but sample.html now includes an example of an intraday chart.

Version 2-2013

  • Charting performance is greatly improved in this version thanks to smarter rendering algorithms to the HTML5 Canvas. Zooming and panning have also been improved for a better overall user experience.
  • This version includes support for Windows 8 touch events which makes it compatible with Windows Surface. We've also improved our support for Android devices (please note that there is a bug in the current Android browser that causes it to crash under heavy load such as can be experienced on tablets. We recommend that users use Android Chrome which does not crash and has much better performance).
  • This version uses a different image nomenclature for the icons. In this package you should find several icons that begin with "stx". The icons are the same as the previous versions but this new naming system is less likely to conflict with other naming conventions.

New features include:

  • A label "currentHR" which shows the current price on the y-axis in red or green.
  • Colored bar charts (red if the stock is down, green if it is up)
  • Crosshair offset can be set programmatically and the default has changed on touch devices to be a little easier for users to see
  • Magnet mode allows drawing tools to snap to points on the chart
  • CIQ.ChartEngine.Chart#symbolDisplay allows programatic change of the display label on the charting panel
  • Sharp display on iPad retina displays

New tools

  • CIQ.Plotter – High performance drawing on the canvas
  • CIQ.Plotter.dashedLineTo - Dashed line drawing support
  • CIQ.textLabel – Convenience tool for drawing a text label on the canvas