I created a dojo chart using;
var pieChart = new dojox.charting.Chart2D("pieChart");
Afterwards I want to update/destroy this chart. SO I do;
var pieChart = dojo.byId("pieChart");
pieChart.destroy();
This seems to be not functional. Am I doing something wrong here?
best
I ran into this same problem, where I created the chart in one place and then wanted to destroy it in another, but I didn't have a reference to the chart object. The only solution I found is to empty the DOM node you used to make the chart:
dojo.empty("pieChart");
As you're using dojox so dojo.byId will not return javascript object try using dijit.byId I think it'll work as suggested below:
var pieChart = dijit.byId("pieChart");
pieChart.destroy();
the same problem I was facing with dojox.form.BusyButton after a great effort I found this...
The second variable will reference DOM object, not the javascript object that store chart object.
var pieChart = new dojox.charting.Chart2D("pieChart");
pieChartDom = dojo.byId("pieChart"); //you cannot destroy,
pieChart.destroy(); //you can destroy, this is original variable
I hope it helps.
Related
I have a sheet with 30 charts and I'm trying to iterate over all of them updating the colors of the background and the series.
Even though I could do it blindly, I'd rather be able to look at all the series in a chart first so that I could add extra logic based on the number of series, if it is already using one of my custom colors, title, etc. The problem is that I couldn't find a way to get the series from a chart.
Given that I can modify the series with setOptions I thought something like sheet.getCharts()[0].getOptions().get('series') would work, but it returns Access to class "(class)" is prohibited. when I try to log it.
Any advice on how to get an object where I can read information about the series in a chart?
its like hashmap (key/value) when you set option put key and value and when you get it try to use json to get the oject value too
function myfunction() {
var sheet = SpreadsheetApp.getActiveSheet();
var len = sheet.getCharts().length;
for(var i=0;i<len;i++){
var bg=sheet.getCharts()[i].getOptions().get('backgroundColor.fill');
var s=sheet.getCharts()[i].getOptions().get('series.0.color');
}
}
I am following markercluster examples from Mapbox library, but can't solve my problem. If you guys take a look at my working example here, you will notice this line of code:
L.mapbox.featureLayer(markerLayer).on('ready', function(e) {
What I initally thought was I could put markers inside of markercluster featureLayer, but I guess it was a wrong approach. Any solutions? Thanks.
Example following here
The mapbox example you refer to makes an AJAX call to retrieve the GeoJSON data, hence it needs to attach an on "ready" listener.
In your case your GeoJSON data is defined in your scripts, so the "ready" event will not be triggered (besides, you should use L.mapbox.featureLayer with your GeoJSON object directly, not a Feature Layer).
You can simply use the eachLayer method to iterate through all created markers within the Feature Layer, and add them into your Marker Cluster Group.
var clusterGroup = new L.MarkerClusterGroup();
var markerLayer = L.mapbox.featureLayer(markers).eachLayer(function(layer) {
clusterGroup.addLayer(layer);
});
map.addLayer(clusterGroup);
Updated Plunker: http://plnkr.co/edit/fN6xYcn1Lg532eLe39IS?p=preview
I am using ZK charts in my project. I am having line type charts. And using addSeries on my chats. But when I want refresh charts as in when user if fetching new Data, I am not sure how to clear the graph. Please help.
For example, if you are using series to add points on the chart (in my example I am using Float values) you can empty data displayed by setting an empty list to the series, like this:
chart.getSeries().setData(new ArrayList<Float>());
this one worked for me,
just write this line before populating your chart
chart.getSeries().setData(0);
To do that just call the method
chart.invalidate();
In the OL3 examples I can drag objects and drop on the map, but I want to move/resize/rotate things that are already on the map like ol.geom.Point and other ol.geom objects. What is the OL3 way do do this?
Example in OL2:
OpenLayers.Control.DragFeature(layer)
Not sure why the example on OL3 website is so complicated. Dragging vector objects can be easily achieved using new ol.interaction.Modify.
Here is a simpler working example: jsFiddle
In short, if you marker was:
var pointFeature = new ol.Feature(new ol.geom.Point([0, 0]));
You can define modify interaction as :
var dragInteraction = new ol.interaction.Modify({
features: new ol.Collection([pointFeature]),
style: null
});
map.addInteraction(dragInteraction);
You can then get a event for getting the new location of marker after drag like so:
pointFeature.on('change',function(){
console.log('Feature Moved To:' + this.getGeometry().getCoordinates());
},pointFeature);
Take a look at the modify interaction (example). Though rotation is not yet supported.
I have create a simple lib that add drag interaction to openlayers 4 by slightly changing this official example: https://openlayers.org/en/latest/examples/custom-interactions.htm
you can find the lib here :
https://gist.github.com/kingofnull/0ad644be69d8dd43c05721022ca5c3a5
and you should simply add it this way:
var map = new ol.Map({
interactions: ol.interaction.defaults().extend([new ol.interaction.Drag(),])
});
Update
I test the translate and it works in openlayer 4 and there is no need for a custom interaction. keep it in mind if you going to combine it with modify interaction you should add it before modify. here is my final code:
var map = new ol.Map({...});
var featureDrager = new ol.interaction.Translate();
var modify = new ol.interaction.Modify({...});
map.addInteraction(featureDrager);
map.addInteraction(modify);
I want to create a scatter chart dynamically and load the series by fetching the data from the store. Is there any method to do that? I did the following:
var myChart = Ext.create('Ext.chart.Chart',{
id:'myChart',
renderTo:'myPanel',
axes:[], // blank because i need to add axes from store
series:[] // blank because i need to add series from store
:
:
});
for(conditions){
myChart.config.axes[0].fields.push(record[cnt].data.fieldName);
var series = {
type:'scatter',
axis:['right', 'bottom'],
xField:'myXfield',
yField:record[cnt].data.yfieldVal
}
myChart.config.series.push(series);
}//for loop ends
myChart.redraw();
Iam not able to see the chart with the plots that are dynamically added.
Any help will be appriciated!
Thanks!
I realized how to address the issue. I declared Global variables for the store name and other related fields. I created the get and set methods. These are defined in app.js file. I was able to set the values dynamically to these global variables using set methods and use the assigned values using the get methods. I hope someone will be able to use this technique if required.